blog's People
blog's Issues
📝ページングできるようにする
概要
GraphQLにページング設定を追加する
技術
GOAL
📝パスワード認証からFacebook認証に変更
概要
ユーザのパスワードを管理したくないのでFacebookログインのみにする
技術
GOAL
📝フォーマッターの導入
概要
コードの一貫性を保つためフォーマッターを導入する
技術
GOAL
📝ログイン機能の実装
概要
Cognitoを使用してログイン機能を実装する
技術
- cognito
GOAL
- サインイン用のページがあること
- サインインができること
- サインアウトができること
Ph1.基本設計
ドメイン設計
要件
- 取得済みのドメインを使いたい(tetymd.com)
- ブログサービスをtetymd.comのサブドメインで公開したい
方針
- blog.tetymd.comとしてサービスを公開する
システム構成
要件
方針
運用・監視設計
要件
- サービスの更新は自動化したい
- インフラの構築は自動化したい
- 障害発生時に通知が来るようにしたい
- アクセスログ、証跡ログを残したい
方針
- CICDを使用してサービスの更新を自動化する
- CloudFormationを使用して構築を自動化する
- Slackに通知が来るようにする(Ph2以降に実装)
- アクセスログ、証跡ログを取得し保存する
性能・拡張性設計
要件
- 利用ユーザ数:50~100人/月
- 同時接続ユーザ数:1~5人
- 記事データ量:1GB~
- 想定以上に利用ユーザが増えた場合にもサービスを継続できるようにしたい
方針
- DBがボトルネックになりえるため、Aurora Serverlessを使用し性能・拡張性を高める
信頼性・可用性設計
要件
- 365日24時間サービスが使える状態が好ましい
- 障害が発生した場合24H以内に復旧できるのが好ましい
方針
- 可能な限りマネージドサービスを使用して可用性を高める
コスト
要件
- 予算 10,000Yen/month
- コストは可能な限り抑えたい。
方針
- コスト優先
- 性能や可用性を上げるためにコストがかかる場合は、利用しない。
📝Apollo導入
概要
- ローカル用GraphQLサーバーを立てる
- アプリからGraphQLクエリを投げれるようにする
技術
GOAL
- Apolloサーバーを構築
- ApolloサーバーにアプリからGraphQLクエリを投げて何かしらデータを取ってこれること
📝ページネーション対応
概要
記事の一覧取得がページネーション対応してないので実装する
技術
GOAL
📝CDKを導入できるか検討
概要
バックエンドの構成管理にCDKを導入できるか検討する
技術
- AWS CDK
GOAL
- 学習コストが高くないか
- 使っていて楽しいか
- 運用が大変じゃないか
📝Prisma導入
概要
- Prismaをインストール
- スキーマ定義
- DBにマイグレーション
技術
GOAL
Prisma ClientでDBに読み書きできること
📝CDK導入
概要
CDKでバックエンド環境を構築できるようにする。
技術
GOAL
- CDKのインストール
📝エラーハンドリングの追加
概要
フロントにエラーハンドリングを追加する
技術
GOAL
- GraphQLのエラーハンドリングができること
📝記事の公開・非公開を設定できるようにする
概要
公開ステータスで公開・非公開を制御できるようにする
技術
GOAL
👿:レンダリングの重複
概要
Auth.currentCredentialsなどが二回連続して走ってしまう。
useEffectを使用して実行タイミングを制御する必要あり。
再現手順
📝記事の保存と取得
概要
Apollo serverのWebUIから記事を保存・取得できるようにする
技術
- GraphQL
- Prisma
GOAL
- データベースに記事を保存できる
- 保存した記事を取得(単体・一覧)できる
Ph1.要件定義
サービス概要
自分のブログサービス。
将来的にパブリックなサービスとしてリリースできるよう拡張性を持たせる。
GOAL
サービスインが第一目標。
ここでは必要最低限な機能に絞り開発する。それ以外はPh2以降に開発。
デザイン
- シンプル
- UIよりも開発に集中
利用ユーザ
- 管理者(自分)
- ゲスト(サイト訪問者)
機能
- 管理者のサインイン/サインアウト
- 管理者用機能
- 記事の投稿
- 記事の編集/削除
- 記事の一覧表示
- ゲスト用機能
- 記事の閲覧
- 記事の一覧表示
📝バックエンド構築
概要
AWSにバックエンド環境を構築する
※CloudFormationで構築
➡CDKを使ってみる
技術
- S3
- Route53
- CloudFront
- RDS(Aurora)
- AppSync
- Lambda(?)
- Cognito
GOAL
単体レベルで動作の確認が取れること
※リソースごとに構築タスクを割り振り
📝記事の保存と取得(フロント)
概要
アプリでGraphQLを使い、データ保存・取得する
技術
GOAL
- 記事の閲覧・作成・更新・削除ができること
📝ローカルDB構築
概要
開発用にDBコンテナを使える状態にする。
技術
- Docker
- MySQL
GOAL
MySQL CLIやその他クライアントアプリからアクセスできること。
📝admin画面改修
概要
記事の一覧はテーブル表示にしたい
検索窓欲しい
複数選択して一括削除する機能欲しい
技術
GOAL
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.