Tech Type

https://github.com/balckowl/typing-game

Next.js

Kubernetes

AWS

Firebase

PostgreSQL

Web開発でよく使う単語を生成するタイピングゲーム。

Sora_339

ネッシー

くしらぁ

potekichi

推しアイデア

日々、様々な技術スタックを扱うすべてのWebエンジニアをにっこりさせるために、タイピングさせる文字列をAIに生成させることで、数多くの技術スタックの中から選択できるようにしました!あなたの好きな技術が、きっと見つかる。

作った背景

AIが書いたコードをそのままコピペすることも増えた今日、もう一度みんなと手打ちの楽しさを分かち合いたい...!!これからもAIとプログラマーが協力し合えることを願って、AIを活用したタイピングゲームを考案しました。

推し技術

書き中

プロジェクト詳細

Webエンジニアほいほいのタイピングゲーム、作りたいなあ...。

概要

TechTypeは、Web開発でよく使う単語を生成するタイピングゲームで、技術に対する興味を深めながらタイピングスキルを向上させることができるゲームです。
全世界のプレイヤーと競い合いながら、楽しく学んでスキルアップを目指しましょう。

ぜひあなたもTechTypeでタイピングの腕を磨いて、ランキング上位を目指してみませんか?

マイページ

image

NextAuthとFirebaseを使用しており、Googleアカウントでのログインが可能です。

ゲーム画面

image

Claude3 Sonnetを利用してタイプする内容を生成しています。 選択できる技術は数多くあります。あなたのお気に入りの技術もきっとあるはず。

ランキング機能

image

ランキング機能で世界中のプレイヤーと競い合うことができます。自分の技術を極めてランクインを目指そう!

技術スタック

アプリ部分

image

  • フロントエンドは、Next.js, TailwindCSS, TypeScript, framer-motion, shadcnを用いました。
  • バックエンドは、Next.js, TypeScript, prisma, Supabase、Auth認証にNextAuth, Firebase、AIにAmazon Bedrockを用いました。
  • 開発には、GitHub Actionsを用いて堅牢な開発を心がけました。

インフラ部分

image

  • AWSのEKSを採用して,オートスケールや障害復旧に対応できる構成にしました。
  • Nginxからnextjsのサーバにプロキシすることで,nextjsを隠蔽しました。
  • Route53とACMを用いて,https通信を行うことで,安全なサイトにしました。

Sora_339

@83983ead4a2d5ce5