タスク管理アプリ

タスクの管理とコメントの追加ができるシンプルなWebアプリケーションです。Vue 3とNuxt 3を利用して開発されており、バックエンドとしてHasuraのGraphQLエンドポイントを使用しています。
このアプリケーションは、「GraphQL完全理解ハンズオン」で解説しているアプリケーションのフロントエンド部分です。

機能

• タスクの追加、表示
• タスクの完了/未完了のトグル
• タスクごとのコメントの追加と表示
• タスクの作成日時を日本時間での表示

セットアップ

1. Hasuraのセットアップは、以下のリポジトリを参照してください: graphql-hands-on-hasura
2. .envファイルを作成し、HasuraのGraphQLエンドポイントを設定: cp .env.example .env
3. このアプリの依存関係をインストール: npm install
4. 開発サーバーの起動: npm run dev

アプリケーションは http://localhost:3000 でアクセス可能です。

使用技術

• Vue 3
• Nuxt 3
• Hasura
• @urql/vue
• GraphQL
• date-fns
• date-fns-tz

注意事項

本アプリでは、GraphQLへのアクセスにx-hasura-admin-secretを使用しています。
実際のWebアプリケーションでは、セキュリティの観点からJWT認証などの実装が必要です。