stamPedia

25年 1-Monthon 11 班「stamPedia」

ハッカソンの開発メンバー

カッコ内はtraQ ID

• yas-ako (yasako)
• nyson411 (mamo)
• iwnevaf (dislike_fruits)
• hachimitsu-pichi (hachimitsu)
• ikea-6330 (ikea)
• rurun418 (rurun)

使用技術

• クライアント
  • Nuxt4
  • Vue3
  • NuxtUI
  • openapi-typescript
  • openapi-fetch
• サーバー
  • Go
  • Echo

機能

traQで使用可能な9000個以上のスタンプについて

• タグ付け
• 説明文の投稿

を行うことで、検索できるようにする。

開発環境の準備

クライアント

クライアントディレクトリに移動し、依存関係をインストールする。

cd client
npm install

環境変数は .env.example を参考に .env に設定する。

NUXT_PUBLIC_API_BASE=http://localhost:8080/api/v1
# サーバーのAPIのベースとなるURL

設定が完了したら、開発サーバーを起動する。

npm run dev

Note

OpenAPIの /api/swagger.yml をもとに、TypeScriptの型定義を自動生成している。 APIの仕様を変更した際は、次のコマンドを実行する。

npm run generate:openapi
npm run lint:fix

サーバー

https://github.com/ras0q/go-backend-template/ を使用させていただいた

環境変数は .env.example を参考に .env に設定する。

BOT_TOKEN_KEY=bot_token_key_here # traQ Bot のトークン (traQ API を利用するため)
CLIENT_ID=client_id_here # traQ OAuth2 Client ID
TOP_PAGE_URL=top_page_url_here # トップページのURL (OAuth2 認証後にリダイレクトする先)
ALLOWED_ORIGINS=http://localhost:3000,http://localhost:8080　# CORSで許可するオリジン (カンマ区切り)

開発時は docker compose watch でホットリロード付きのサーバーを起動できる。

• app
  • Go製のサーバーアプリケーション
• db
  • MariaDB
  • 本番環境では NeoShowcase のデータベースを使用する。開発環境では docker-compose.yml で立ち上げた MariaDB を使用する。
• adminer
  • データベース管理画面