バックエンドにFastAPI、フロントエンドにNuxt3、データベースにMySQLを利用した、モダンなWebアプリのチュートリアルです。
※ tutorial/
配下にチャプターごとにディレクトリが切ってあります。
- Chapter1 FastAPI入門
- Chapter2 RDB入門
- Chapter2.5 SQLAlchemyを利用したデータベースの操作
- Chapter3 Alembicを利用したマイグレーションを実装してみよう
- Chapter4 FastAPIでCRUDを実装してみよう
- Chapter5 認証・認可が必要なAPIを実装してみよう
- Chapter6 APIテストを実装してみよう
- Chapter7 番外編1: JavaScriptのおさらい
- Chapter8 番外編2: TypeScriptのおさらい
- Chapter9 Nuxt.js入門
- Chapter10 ログインページの実装
- Chapter11 アイテム・ユーザー管理ページ(CRUD)の実装
完成形を動かしてみましょう
※ dockerを事前にインストールしておいてください
git clone https://github.com/ng3rdstmadgke/web-tutorial.git
cd web-tutorial
ローカルデータベースの起動
./bin/mysql.sh
データベースの初期化
# 開発shellにログイン
./bin/run.sh chapter11 -m shell --sample
# DBの初期化
./bin/init-database.sh
# 開発shellからログアウト
exit
アプリの起動
# アプリの起動
./bin/run.sh chapter11 -m app --sample
アプリが起動したら http://localhost:3000/ にアクセスしてみましょう。
下記ユーザーでログイン可能です。
Username: sys_admin
Password: admin
- APIにバリデーションを追加
- chapter9