gbraver-burst-browser v1.0.0

Gブレイバーバースト

ロボットで対戦するゲームです。 ここでサービスを公開しています。

ローカル環境で動かす

初回

cd <本リポジトリをcloneした場所>
cp .env.tepmpate .env
# 環境に応じた値を.envに記載する
# .env.templateに各環境変数の詳細が記載されている

npm ci
npm start
# ブラウザを起動して<localhost:8080>を開く

2回目以降

cd <本リポジトリをcloneした場所>
npm start

# ブラウザを起動して<localhost:8080>を開く

Dockerで動かす

初回

touch .env
# 環境に応じた値を.envに記載する
# .envの記載内容は本リポジトリの.env.templateを参照

docker run --env-file <.envのパス> -p <任意ポート>:3000 kaidouji85/gbraver-burst
# ブラウザでhttp://localhost:<CLIで指定したポート>/を開く

2回目以降

docker run --env-file <.envのパス> -p <Dockerホストの任意ポート>:3000 kaidouji85/gbraver-burst
# ブラウザでhttp://localhost:<CLIで指定したポート>/を開く

Dockerイメージをビルドする

docker build ./

デプロイする

本プログラムは静的ファイルのみで構成されています。 ビルドしたものを、S3などでパブリック公開するけでデプロイ完了です。 ここでは、S3にアップロードする手順を記載します。

事前準備

# aws cliをインストールする
aws configure
# S3へのフル権限を持つアカウントでログインする

開発環境にデプロイ

./scripts/deploy.sh <アップロードするS3バケット名>

本番環境にデプロイ

./scripts/deploy-production.sh <アップロードするS3バケット名> <CloudFrontのdistributionId>

storybookを動かす

cd <本リポジトリをcloneした場所>
npm run start:storybook
# ブラウザからlocalhost:6006を開く

メカデザイン協力

本ゲームのキャラクターは DOGAL3 で作成しました。 絵心がなくてもカッコいいメカが作れる、とても素晴らしいツールです。