Intermission
一息つきましょう!本当にここまでのチュートリアルを全部見てくれた方:おめでとうございます !もし、このページまで読み飛ばして、タダで祝ってもらおうとしたのなら:チッ、チッ!
一度に多くの新しいコンセプトを吸収する可能性があったので、すべてを完全に吸収できなくても、悪く思わないでください。React、GraphQL、Prisma、サーバレス関数......本当にたくさんありますね!フレームワークを作っている私たちでさえ、1日に何度もググって、これらをどう連携させるかを考えています。
ある匿名のTwitterユーザは言いました:"地球上で最も賢い人間と歴史上最も愚かな人間の気分を1日のうちで切り替えるのが好きなら、プログラミングはあなたに向いている職業かもしれない!"
What's Next?
第5章からは Storybook と Jest に注目し、ブログに新しい機能を追加していきます:コメント機能です。 Storybook はコンポーネントを構築するための新しい方法を紹介します。また、テストを追加し、Jest で実行して、期待通りに動作していることを確認します。 コメントのモデレータに特別な役割を与えることで、 authorization (認可)もカバーします。
ここまでのチュートリアルを終えた方は、第5章に進むことができます。 ただし、この先では、前半で構築できなかった完全なテストスイートといくつかの Storybook コンポーネントを扱う予定です。 第5章の最初と同じスタート地点に立つには、この example repo(サンプルリポジトリ) から始めることができます(強くお勧めします)。このリポジトリは第4章の終わりから始まっていますが、すでに追加のスタイル、最初のテストスイート、いくつかの Storybook コンポーネントがあらかじめ構築されています。
Using Your Current Codebase
以下の例で使用しているのと同じCSSクラスを使用したい場合は、あなたのリポジトリに Tailwind を追加しなければなりません:
yarn rw setup ui tailwindcss
しかし、この後に続くスクリーンショットは、あなたがブラウザで見ているものに近いものではありません(Storybook で構築した、独立したしたコンポーネントを除く)ので、example repo から始めるとよいかもしれません。また、私たちが追加した良いテストスイートも見逃すことになりますよ!
もし、 まだ 自分のリポジトリで続けるつもりで、Netlify のようなサービスにデプロイしたのなら、 schema.prisma
のデータベースプロバイダを postgresql
に変更したことでしょう。
もしそうなら、ローカルの開発環境も同様に変更されていることを確認してください。 Local Postgres Setup を参照してください。
もし、代わりに example repo を使うなら、古き良き SQLite (前半のビルドで使っていたもの)を使うことができます。
準備ができたら開発サーバを起動しましょう:
yarn rw dev
Using the Example Repo (Recommended)
最初のチュートリアルをまだ見ていない人、あるいはRedwoodの古いバージョン(0.41以前)で見た人は、this repo(このリポジトリ)をクローンすると、これまでに作ったものをすべて含み、さらに少しスタイルを追加して、見られるものにしてあります。サンプルのリポジトリにはスタイルアップのための TailwindCSS が含まれており、スタイルアップのためのフックを追加するために <div>
が1つ2つ追加されています。
git clone https://github.com/redwoodjs/redwood-tutorial
cd redwood-tutorial
yarn install
yarn rw prisma migrate dev
yarn rw g secret
これはリポジトリをチェックアウトし、すべての依存関係をインストールし、ローカルデータベース(SQLite)を作成し、いくつかのブログ投稿でそれを埋めることになります。最後のコマンド( yarn rw g secret
)の後、出力された文字列をコピーして、プロジェクトのルートにあるファイル .env
に追加する必要があります:
SESSION_SECRET=JV2kA48ZU4FnLHwqaydy9beJ99qy4VgWXPkvsaw3xE2LGyuSur2dVq2PsPkPfygr
これは dbAuth で使用するセキュアクッキーの暗号化キーです。
そうしたら yarn rw dev
して開発サーバを起動します。ブラウザで新しいブログアプリが開かれるはずです:
トイレ休憩して、飲み物をとってきて、さあ始めましょう!