yarn create redwood-app --ts ./my--redwoodblog
cd ./my--redwoodblog
yarn rw dev

yarn workspace web add marked

web/src/
├── App.tsx
├── components/
├── index.css
├── index.html
├── layouts/
├── pages/
└── Routes.tsx

yarn redwood generate page home /

web/src/pages/HomePage/
├── HomePage.stories.tsx
├── HomePage.test.tsx
└── HomePage.tsx

// 'src/pages/Admin/BooksPage/BooksPage.js' -> AdminBooksPage

yarn redwood generate page about

yarn rw g page about

yarn rw g layout blog

      <Set wrap={BlogLayout}>
        <Route path="/about" page={AboutPage} name="about" />
        <Route path="/" page={HomePage} name="home" />
      </Set>

model Post {
  id        Int      @id @default(autoincrement())
  title     String
  body      String
  createdAt DateTime @default(now())
}

yarn rw migrate dev

yarn rw prisma studio

yarn rw g scaffold post

  ✔ Successfully wrote file `./web/src/components/Post/EditPostCell/EditPostCell.tsx`
  ✔ Successfully wrote file `./web/src/components/Post/Post/Post.tsx`
  ✔ Successfully wrote file `./web/src/components/Post/PostCell/PostCell.tsx`
  ✔ Successfully wrote file `./web/src/components/Post/PostForm/PostForm.tsx`
  ✔ Successfully wrote file `./web/src/components/Post/Posts/Posts.tsx`
  ✔ Successfully wrote file `./web/src/components/Post/PostsCell/PostsCell.tsx`
  ✔ Successfully wrote file `./web/src/components/Post/NewPost/NewPost.tsx`
  ✔ Successfully wrote file `./api/src/graphql/posts.sdl.ts`
  ✔ Successfully wrote file `./api/src/services/posts/posts.ts`
  ✔ Successfully wrote file `./api/src/services/posts/posts.scenarios.ts`
  ✔ Successfully wrote file `./api/src/services/posts/posts.test.ts`
  ✔ Successfully wrote file `./web/src/scaffold.css`
  ✔ Successfully wrote file `./web/src/lib/formatters.tsx`
  ✔ Successfully wrote file `./web/src/lib/formatters.test.tsx`
  ✔ Successfully wrote file `./web/src/layouts/ScaffoldLayout/ScaffoldLayout.tsx`
  ✔ Successfully wrote file `./web/src/pages/Post/EditPostPage/EditPostPage.tsx`
  ✔ Successfully wrote file `./web/src/pages/Post/PostPage/PostPage.tsx`
  ✔ Successfully wrote file `./web/src/pages/Post/PostsPage/PostsPage.tsx`
  ✔ Successfully wrote file `./web/src/pages/Post/NewPostPage/NewPostPage.tsx`

import type { FindPostById } from 'types/graphql'

import type { CellSuccessProps, CellFailureProps } from '@redwoodjs/web'

import Post from 'src/components/Post/Post'

export const QUERY = gql`
  query FindPostById($id: Int!) {
    post: post(id: $id) {
      id
      title
      body
      createdAt
    }
  }
`

export const Loading = () => <div>Loading...</div>

export const Empty = () => <div>Post not found</div>

export const Failure = ({ error }: CellFailureProps) => (
  <div className="rw-cell-error">{error?.message}</div>
)

export const Success = ({ post }: CellSuccessProps<FindPostById>) => {
  return <Post post={post} />
}

import PostCell from 'src/components/Post/PostCell'

type PostPageProps = {
  id: number
}

const PostPage = ({ id }: PostPageProps) => {
  return <PostCell id={id} />
}

export default PostPage

yarn rw g cell Articles

  ✔ Successfully wrote file `./web/src/components/ArticlesCell/ArticlesCell.mock.ts`
  ✔ Successfully wrote file `./web/src/components/ArticlesCell/ArticlesCell.test.tsx`
  ✔ Successfully wrote file `./web/src/components/ArticlesCell/ArticlesCell.stories.tsx`
  ✔ Successfully wrote file `./web/src/components/ArticlesCell/ArticlesCell.tsx`

query ArticlesQuery {
    articles: posts {
      id
      title
      body
      createdAt
    }
  }

export const Success = ({ articles }: CellSuccessProps<ArticlesQuery>) => { /* ... */ }

yarn rw g page Article

<Route path="/article/{id}" page={ArticlePage} name="article" />

yarn rw g cell Article

<Route path="/article/{id:Int}" page={ArticlePage} name="article" />

yarn rw g component Article

  ✔ Successfully wrote file `./web/src/components/Article/Article.test.tsx`
  ✔ Successfully wrote file `./web/src/components/Article/Article.stories.tsx`
  ✔ Successfully wrote file `./web/src/components/Article/Article.tsx`

import {
  Form,
  Submit,
  SubmitHandler,
  TextAreaField,
  TextField,
} from '@redwoodjs/forms'
import { MetaTags } from '@redwoodjs/web'

type FormValues = {
  name: string
  email: string
  message: string
}

const ContactPage = () => {
  const onSubmit: SubmitHandler<FormValues> = (data) => {
    console.log(data)
  }

  return (
    <>
      <MetaTags title="Contact" description="Contact page" />

      <Form onSubmit={onSubmit}>
        <label htmlFor="name">Name</label>
        <TextField name="name" />

        <label htmlFor="email">Email</label>
        <TextField name="email" />

        <label htmlFor="message">Message</label>
        <TextAreaField name="message" />
        <Submit>Submit</Submit>
      </Form>
    </>
  )
}

export default ContactPage

yarn rw g sdl Contact --no-crud

// ...
  validate(input.email, 'email', { email: true })
// ...

/* ... */
      <Form onSubmit={onSubmit} config={{ mode: 'onBlur' }} error={error}>
        <FormError error={error} wrapperClassName="form-error" /> 
{/* ... */}

validateWith(() => {
  const oneWeekAgo = new Date()
  oneWeekAgo.setDate(oneWeekAgo.getDate() - 7)

  if (input.lastCarWashDate < oneWeekAgo) {
    throw new Error("We don't accept dirty cars")
  }
})

yarn rw setup auth dbAuth

model User {
  id                  Int       @id @default(autoincrement())
  name                String?
  email               String    @unique
  hashedPassword      String
  salt                String
  resetToken          String?
  resetTokenExpiresAt DateTime?
}

      <Private unauthenticated="home">
        <Set wrap={ScaffoldLayout} title="Posts" titleTo="posts" buttonLabel="New Post" buttonTo="newPost">
          <Route path="/posts/new" page={PostNewPostPage} name="newPost" />
          <Route path="/posts/{id:Int}/edit" page={PostEditPostPage} name="editPost" />
          <Route path="/posts/{id:Int}" page={PostPostPage} name="post" />
          <Route path="/posts" page={PostPostsPage} name="posts" />
        </Set>
      </Private>

  const { isAuthenticated, currentUser, logOut } = useAuth()

yarn rw g secret

yarn rw setup deploy netlify

yarn rw storybook