タスクマネージャーアプリを作る
投稿日：2024年10月01日
更新日：2024年10月01日
タスクマネージャーアプリの作成を複数回に分けて、動画で紹介します。
技術スタック
- Bun
- TypeScript
- Next.js
- Tailwind CSS
- shadcn/ui
データテーブル
tasks table
| カラム名 | データ型 | 主キー | 備考 |
| id | integer | ○ | |
| title | text | タスク名 | |
| description | text | タスク内容 | |
| due_date | text | 期日 | |
| completed | boolean | 完了有無 | |
| important | boolean | 重要有無 | |
| user_id | text | ユーザーID |
動画
レスポンシブ対応ヘッダーを作る
ヘッダーには、アプリロゴと検索窓とユーザー登録ボタンとログインボタンを表示します。
また、レスポンシブに対応して、認証のボタンは2つのボタンとドロップダウンメニューで切り替えるようにします。
上記の動画でレスポンシブに対応したヘッダーを作成ができるようになります。