OUTPUT QUEST ~叡智の継承者~

使用技術：

担当：

概要

私が開発したWebアプリです。RPG風のゲーミフィケーションを取り入れた学習支援アプリで、Zennで記事を投稿することでアプリ内の「勇者」が成長し、アイテムやなかまを獲得できます。アウトプットを通じて学習意欲や知的好奇心を高め、楽しみながら自己成長を促すことを目的に開発しました。

　このWebアプリはNext.js + CSS Modules + Tailwind CSS + TypeScriptで開発し、デプロイはVercelで行いました。

　トップページ：ゲームのオープニングを彷彿とさせる演出により、冒険のはじまりを視覚的に表現しました。

　アバウトページ：アプリの概要、コンセプト、主要機能について紹介しています。

　ログインページ：Clerk認証によるログイン、Zennのアカウント連携を行ったユーザーのみがアプリを利用できるようにしています。Zennと連携することで、投稿データがアプリ内のUIに反映されます。

　ダッシュボードページ：勇者の成長度合いを示すレベル、Zennでの投稿数、レベルアップ報酬で獲得した勇者のなかまやアイテムを確認できます。

　投稿一覧ページ：Zennで投稿した全ての記事を取得し、アプリ内で「投稿一覧」として確認できます。取得した記事がアプリ内ではカード型UIで表示され、クリックすることでZennの記事ページにアクセスできます。

　つよさページ：勇者の成長度合いを示すレベル、レベルアップ報酬で獲得した「称号」の確認、勇者の「装備アイテム」の確認、学びの記録を時系列で確認できる「冒険ログ」の確認ができます。

　なかまページ：勇者のなかまになったキャラクターを確認できます。1人1人のキャラクターの詳細情報も確認できます。

　アイテムページ：レベルアップ報酬で獲得したアイテムを確認できます。1つ1つのアイテムの詳細情報も確認できます。

このWebアプリは転職活動用のポートフォリオとして開発したものであり、意図した環境でご確認いただくため、noindexとnofollowを設定し、検索エンジンのインデックスから除外しています。