# WEB+DB PRESS企画会議 #2 * 2021年10月6日22時00分-23時00分 ## アジェンダ 以下のイシューについて意識合わせをする。 * [「とは何か」と「仕組み」節の構成を統一する · Issue #14 · elixirjp-slack-com/webdbpress-vol127](https://github.com/elixirjp-slack-com/webdbpress-vol127/issues/14) * [「技術仕様」節の構成を統一する · Issue #15 · elixirjp-slack-com/webdbpress-vol127](https://github.com/elixirjp-slack-com/webdbpress-vol127/issues/15) * [RealWorld節の構成を統一する · Issue #16 · elixirjp-slack-com/webdbpress-vol127](https://github.com/elixirjp-slack-com/webdbpress-vol127/issues/16) ## 議事録 ###  「とは何か」と「仕組み」節の構成を統一する ``` # Phoenixとは何か ## Phoenixが解決すること ## Phoenixの特徴 # Phoenixの仕組み ## Phoenixのディレクトリ構成 ### Contextsによる機能のグループ化 ## リクエストルーティング ## Mixタスクによるスキャフォールディング ``` ``` # Ectoとは何か ## Ectoが解決すること ## Ectoの特徴 ### Ecto.Repo --- データストアのラッパー ### Ecto.Query --- Elixirシンタックスで書けるクエリ ### Ecto.Schema --- データソースとElixir構造体のマッピング ### Ecto.Changeset --- 外部パラメータのフィルター、キャスト、バリデーション ### トランザクション ### マイグレーション ``` ``` # phx.gen.auth とは何か ## phx.gen.authが解決すること ## 特徴 ``` ``` # LiveViewとは何か ## LiveViewが解決すること ## LiveViewの特徴 ### LiveViewの仕組み ### 他のフロントエンド技術との比較 ### LiveViewのユースケース ``` #### 決定事項 * 「〜の仕組み」の節は「〜の基礎知識」に名前を統一する * 「〜とは何か」節は、以下のみとする * 「## 〜が解決すること」 * 問題領域とかユースケースについて書く * 「## 〜の特徴」 * 他の同様の技術と比較した時の特徴を書く * 3章の「特徴」の下の`###`見出しの部分は、「〜の基礎知識」に移動 ### 「技術仕様」節の構成を統一する ``` # Phoenixの仕組み ## Phoenixのディレクトリ構成 ### Contextsによる機能のグループ化 ## リクエストルーティング ## Mixタスクによるスキャフォールディング ``` ``` # Ectoの技術仕様 ## データベース作成 ## マイグレーション ## データ操作 ### 作成(Create) ### 読み出し(Read) ### 更新(Update) ### 削除(Delete) ## データリセット ``` ``` # phx.gen.auth を使って認証システムを生成する ## 認証機能付きユーザーの生成 ## 生成された機能を見てみる ### 認証機能 ### 新規登録 ### 確認処理による本登録 ### ログイン・ログアウト ### email・パスワード変更 ### パスワードリセット # アクセスコントロール ## pipelineによる処理の共通化 ## 認証を必要とするscope 必要としない scope # パスワードの最低文字数を変更する ## パスワードバリデーション ## テストの修正 # メールの送信方法を変更する ## ブラウザで見る ## SMTP ## SendGrid ``` ``` # LiveViewの技術仕様 ## LiveViewのディレクトリ構造 ## LiveViewのライフサイクル ## UIの制御 ### HEExテンプレート ### DOMバインディング ### ルーティング ### JavaScriptとの連携 ## 状態の制御 ### 状態の管理と更新 ### ファイルアップロード ### PubSubによるリアルタイム更新 ## Phoenix.LiveViewTestによる結合テスト ## 実装例 --- シンプルなカウンター ``` #### 決定事項 * しくみのところは「〜の基礎知識」に統一 * しくみの節は以下の2つに分ける * ◯◯の基礎知識 * ◯◯の実践的な使い方 * 2章も「Phoenixの実践的な使い方」を追加 * その中では、PhoenixのHello World的な内容を説明する ### RealWorld節の構成を統一する ``` # 本特集の構成 ## RealWorld:シンプルなブログの実装例 ## Realworldの開発で学ぶElixirによるWebサービス開発 ``` ``` # PhoenixによるRealWorldの開発 ## 事前準備 ## Phoenixのインストール ## Phoenixプロジェクトの作成 ## 記事一覧/投稿/削除/編集機能の実装 ## コメント機能の実装 ## 実装した機能のテスト ### 記事一覧のテスト ``` ``` # EctoでのRealWorldの実装 ## コメントと記事を関連づけた保存の実装 ## タグと記事を関連づけた保存の実装 ## タグによる記事検索の実装 ## タグによる記事検索のテスト ``` ``` # phx.gen.authによるRealWorldの開発 ## 認証機能を追加する ## 現在ログイン中のユーザーを取得する ## 記事の投稿に Author を追加する ## コメントの投稿に Author を追加する ## アクセスコントロールをテストする ``` ``` # LiveViewでのRealWorldの開発 ## 画面の実装 --- 記事一覧/作成/削除/更新 ## コンポーネント分割 ### Phoenix.Component --- ステートレスなコンポーネント ### Phoenix.LiveComponent --- ステートフルなコンポーネント ## データの更新をリアルタイムに反映 ### 記事の登録を一覧と詳細に反映 ### 記事の更新を一覧と詳細に反映 ### 記事の削除を一覧と詳細に反映 ## タグによる記事検索のテスト ``` #### 決定事項 * 「〜によるRealWorldの開発」に統一する