AtCoder Problems 開発を始めよう！

AtCoder Problems 開発を始めよう！

必要なもの

始める前に下記のツールが必要です。インストールしておきましょう。

• git
• Yarn

開発環境をセットアップする

# リポジトリを clone する
git clone git@github.com:kenkoooo/AtCoderProblems.git

# atcoder-problems-frontend ディレクトリに移動する
cd ./AtCoderProblems/atcoder-problems-frontend/

# 必要なパッケージをインストールしてくれる魔法のコマンド
yarn

# ローカルサーバーを起動する
yarn start

ここまでやると http://localhost:3000/ にアクセスして自分の PC で起動している AtCoder Problems を確認できます。ソースコードを編集・保存すると自動的にコンパイルされて変更が反映されます。

試しに ./src/components/NavigationBar.tsx を開いて以下の箇所を AtCoder Problems2 に変更してみましょう。

保存してブラウザで確認すると以下のように更新されていると思います。

いかがでしたか？