バックエンドエンジニアによる初めてのJamstack
発売日: 2022/12/9
想定ページ数: 146ページ
ISBN: 9784295601395
全文検索: 対応
★★★★★
★★★★★
0件
-
-
-
-
本書は筆者がJamstackについて実際に役立つ、シンプルなチュートリアル以上のものを目指して筆者が開発したVueアプリケーションを通じて、実装過程中心にまとめた解説書です。
サーバーの管理に関して脆弱性対応など、開発者に求められる業務の範囲は大幅に拡大しています。
しかし有能なプログラマーであると同時に有能なサーバー管理者としてのスキルを維持し続けることは困難です。
本書ではSupabaseで構築したデータベースからデータを取得し、リアルタイムで表示する仕組みを実装します。そのためにVue.jsで開発したフロントエンドアプリケーションを、Netlifyにデプロイする手順についてステップ・バイ・ステップで解説します。
Jamstackって言葉はよく聞くけれどどんなもの?と思ったときに、実際に試すための手順書としても活用できる一冊です。
【目次】
第1章 やりたいこと
第2章 Jamstackとは
第3章 Netlify
第4章 Supabase
第5章 Vue.js
第6章 Vue Router
第7章 パラメーターの受け取り
第8章 Supabaseとの接続とVueスクリプトの構造
第9章 リアルタイムに反映しよう
第10章 GitHubへのデプロイ
第11章 サーバーレス・ファンクション
第12章 見栄えの改善
第13章 APIキーを隠そう
第14章 アニメーションをつけよう
第15章 さらなる学習に向けて
目次プレビュー
- はじめに
- 第1章 やりたいこと
- 第2章 Jamstackとは
-
1.1 何をしたいか
-
1.2 完成物
-
1.3 フレームワークの選定
-
1.4 フロントエンド開発についての誤解
-
1.5 どこから始めるか
-
2.1 スタックとは
-
2.2 「Jam」スタック
-
2.3 何がおいしいの?
-
2.4 Jamstackが向いているサイト
-
2.5 Jamstackの構成
-
3.1 Netlifyとは
-
3.2 アカウントの作成
-
3.3 サンプルのデプロイ
-
4.1 Supabaseとは
-
4.2 アカウントの作成
-
4.3 データベースの作成
-
4.4 テーブルの作成
-
4.5 フィールドの定義
-
4.6 データの入力
-
4.7 サンプルデータの準備
-
4.8 RLSの無効化
-
6.1 なぜ必要か
-
6.2 インストール
-
6.3 コンポーネントを増やす
-
6.4 ルーターの設定
-
6.5 App.vueの修正
-
6.6 未使用コンポーネントの削除
-
6.7 パスの確認
-
7.1 ScoreBoard.vue
-
7.2 ルートの変更
-
7.3 受け取り側の変更
-
7.4 実験
-
9.1 SupabaseのReplication設定
-
9.2 Subscriptionで通知を受け取る
-
9.3 subscribeUpdateMessage()のマウント
-
9.4 確認しよう
-
9.5 このコード変更でスコアが表示されなくなった場合
-
9.6 Unsubcribe
-
9.7 完成したScoreBoard.vue
-
10.1 GitHubリポジトリーの作成
-
10.2 Gitからデプロイ
-
10.3 Netlifyとの接続
-
10.4 Netlifyのビルド設定
-
10.5 Netlifyでパスを使えるようにする
-
10.6 Supabaseとの連携を確認する
-
12.1 App.vueからの削除
-
12.2 <style>にCSS
-
12.3 <template>のタグの構造を改善
-
12.4 確認
-
14.1 GSAPのインストール
-
14.2 初期画面表示の際のアニメーション
-
14.3 transition-groupの属性
-
14.4 script部分の変更
-
14.5 setup()
-
14.6 beforeEnter
-
14.7 enter
-
14.8 アニメーションをつける