はてなブックマーク

Next.js App Router + Server Actions で管理画面のボイラープレートを作成してみました。 本書では、利用した技術、考慮した点などについて紹介していきます。 1. はじめに 2. プロジェクトセットアップ 3. 自動デプロイ（CI/CD） 4. コンポーネント作成 5. 認証認可 6. 入力フォーム 7. 検索フォーム 8. 共通処理 9. DevOps 10. 終わりに

Astro.jsで SSG／SSR／CSR を併用したサンプルを作成してみました。 本書では、サンプルを作成した手順を紹介していき、Astro.js の魅力をお伝えできればと思います。 1. はじめに 2. プロジェクトセットアップ 3. 自動デプロイ（CI／CD） 4. 連携モジュール追加 5. レンダリングオプション（CSR／SSG／SSR） 6. Astro コンポーネント作成 7. REST-APIを利用したSSG 8. markdownを利用したSSG（Content Collections） 9. Reactを利用したCSR 10. SSRの実装

テストデータ投入後の状態 サンプルコンポーネント取り込み AWSよりAWS Amplify UI Kitが提供されているので、Figmaのアカウントにコンポーネントを複製する。 取り込んだコンポーネントから右クリック -> Copy/Paste as -> Copy linkで共有ファイルのリンクを取得する。 Design -> UI Librayに上記で取得したリンクを貼り付ける。 Acccept allで全て取り込む。 正常終了するとコンポーネントが28個取り込まれる。 コンポーネントプロパティ修正 今回のサンプルでは、以下コンポーネントを利用するため、コンポーネントプロパティを修正し、カスタマイズできるようにする。 NavBar HeroLayout4 CardC MarketingFooter NavBar, HeroLayout4, MarketingFooter レスポンシブデ

Next.jsで管理画面のボイラープレートを作成してみました。 本書では、利用した技術などを紹介していきます。 1. はじめに 2. プロジェクトセットアップ 3. 自動デプロイ（CI/CD） 4. バックエンドの準備 5. コンポーネント作成（Atomic Design） 6. 共通処理 7. 入力フォーム 8. 状態管理 9. 非同期処理（react-query） 10. レンダリングオプション（CSR/SSG/SSR/ISR） 11. 単体テスト