DOCSEARCHbyAlgolia
Submit Docs

RedwoodJS Documentation

website·Indexed 36 days ago

https://docs.redwoodjs.com/docs/introduction/

Full-stack framework documentation covering the frontend stack (Router, GraphQL, Cells, Apollo Cache), backend integration with Prisma, and authentication options including dbAuth, Firebase, and Supabase. Includes guides on creating functions, implementing real-time capabilities, form helpers, and testing with Jest, React Testing Library, and Storybook. Features documentation for version 8.8 and Canary releases.

Tokens
2.2M
Snippets
12.8K
Records
15.5K
Agent score
48%

What's inside RedwoodJS

  1. Overview of RedwoodJS Form Helpers

    RedwoodJS provides a suite of form helpers in the @redwoodjs/forms package. These are wrappers around React Hook Form (RHF). If the helpers are insufficient, developers can import RHF hooks like useForm and useFormContext directly from @redwoodjs/forms.
    import { useForm, useFormContext } from '@redwoodjs/forms'

  2. Overview of RedwoodJS Form Helpers

    RedwoodJS provides a suite of form helpers in the @redwoodjs/forms package. These are wrappers around React Hook Form (RHF). If the helpers are insufficient, developers can import RHF hooks like useForm and useFormContext directly from @redwoodjs/forms.
    import { useForm, useFormContext } from '@redwoodjs/forms'

  3. Overview of Trusted Documents in RedwoodJS

    Trusted Documents (also known as persisted operations) allow RedwoodJS to enforce that the GraphQL server only executes pre-approved queries and mutations. Instead of sending the full GraphQL document over the network, the client sends a unique hash ID. The server then looks up this ID in a pre-generated store to execute the corresponding query.

    This approach provides several benefits:

    • Security: Massively decreases the attack surface by preventing malicious actors from executing arbitrary GraphQL queries, which helps prevent unwanted resolver traversal or information leaking.
    • Performance: Increases performance and decreases bandwidth usage by reducing the size of request payloads.

    This feature is ideal for GraphQL APIs that serve only your own application.

  4. Overview of RedwoodJS Realtime

    RedwoodJS Realtime provides real-time updates using GraphQL over Server-Sent Events (SSE) in 'distinct connections mode'. Because it requires a long-running connection between the client and server, it requires a serverful deployment and cannot be used with serverless providers like Netlify or Vercel.

    Key capabilities include:

    • Subscriptions: Standard GraphQL subscriptions for event-driven updates.
    • Live Queries: Queries that automatically re-run when dependent data changes.
    • @defer: Postpones delivery of slow fields grouped in fragments to improve perceived latency.
    • @stream: Streams individual items of a list field as they become available (Note: Not supported by Apollo GraphQL client).
    • Authentication: Supports @requireAuth directives for subscription requests.

  5. Overview of the RedwoodJS Framework

    Redwood is a full-stack web framework designed for scaling from side projects to startups. It provides an end-to-end development workflow by integrating several industry-standard tools: React for the UI, GraphQL for the API layer, Prisma for the ORM, TypeScript for type safety, Jest for testing, and Storybook for UI component development.

  6. Overview of RedwoodRecord ORM

    RedwoodRecord is an experimental ORM for RedwoodJS (version 8.7) built on top of Prisma. It is heavily inspired by ActiveRecord from Ruby on Rails, providing a natural object-oriented interface to database data and abstracting away SQL syntax. In RedwoodRecord, a model is a class that represents a database table, and a record is an instance of that model representing a single row of data.

  7. Overview of RedwoodJS Authentication providers

    RedwoodJS provides @redwoodjs/auth, a lightweight wrapper around popular SPA authentication libraries. It supports several providers including Netlify Identity Widget, Auth0, Azure Active Directory, Netlify GoTrue-JS, Magic Links (Magic.js), Firebase's GoogleAuthProvider, Ethereum, Supabase, Nhost, and a self-hosted solution called dbAuth. Developers can use helpers like getCurrentUser and requireAuth to manage authenticated sessions.

  8. Overview of RedwoodJS testing tools

    RedwoodJS integrates several industry-standard tools to provide a comprehensive testing environment:

    • Jest: The primary test runner.
    • React Testing Library: Used for rendering components in isolation and testing DOM structure/text.
    • Mock Service Worker (MSW): Intercepts GraphQL calls to the API side and returns canned responses, preventing slow tests and dependencies on the actual API.
    • Storybook: Used for visual sanity checks and building components in isolation (not for automated CI testing).
    • Generators: Redwood generators automatically create basic test files for Components, Pages, Cells, and Services.

  9. Overview of RedwoodJS testing tools

    RedwoodJS integrates several industry-standard tools for testing:

    • Jest: The primary test runner.
    • React Testing Library: Used for rendering components in isolation and verifying HTML structure/text.
    • Mock Service Worker (MSW): Intercepts GraphQL calls to the API side and returns canned responses, preventing slow tests and dependencies on the actual API implementation.
    • Storybook: Used for visual sanity checks and building components in isolation (not for automated CI testing).
    • Generators: Redwood generators automatically create basic test files for Components, Pages, Cells, and Services.

  10. Overview of RedwoodJS Background Job System

    RedwoodJS provides a background job system to handle asynchronous tasks (e.g., sending emails) without blocking the user's request. The system consists of three main components:

    1. Scheduling: The interface used in application code to queue a job to run as soon as possible, after a delay, or at a specific future datetime.
    2. Storage: Decouples jobs from the running application using an adapter. The PrismaAdapter stores jobs in the database, allowing the API server, database, and workers to scale independently.
    3. Execution: Handled by a job worker that retrieves jobs from storage and executes them.

    Note: Job execution time is not guaranteed; the specified time is the earliest a job can run, depending on queue volume and worker availability.

  11. Overview of Redwood Directives

    Redwood Directives act as middleware for GraphQL execution, allowing developers to run reusable code for tasks like authentication (Validators) and data formatting (Transformers). Directives are denoted by the @ symbol (e.g., @myDirective) and can be applied to fields, queries, mutations, and relations. They can also accept arguments for dynamic behavior, such as role-based access control.
    type Bar {
  name: String! @myDirective(roles: ["ADMIN"])
}

type Query {
  bars: [Bar!]! @myDirective
}

  12. Overview of RedwoodJS scaffolded project structure

    When generating a scaffold (e.g., for a 'Post' entity), RedwoodJS organizes the code into the following directory structure to separate concerns:

    • Web Pages (web/src/pages/Post): Contains pages for CRUD operations: EditPostPage, NewPostPage, PostPage (detail), and PostsPage (list).
    • Layouts (web/src/layouts/ScaffoldLayout): Common UI wrappers for the scaffolded pages.
    • Routes (web/src/Routes.tsx): Defines the URL paths for the generated pages, typically wrapped in a layout component.
    • Cells (web/src/components/Post): Data-fetching components that handle the connection to the API (e.g., PostsCell for lists, PostCell for single items).
    • Components (web/src/components/Post): Presentational components that render the UI (e.g., PostForm for input, Posts for the table).
    • GraphQL SDL (api/src/graphql/posts.sdl.ts): Defines the GraphQL schema, queries, and mutations.
    • Services (api/src/services/posts/posts.ts): Contains the business logic and Prisma client calls to interact with the database.