TypeScriptの学習とReact

前々から周りのエンジニア仲間の中でTypeScriptが流行っていて、前々から興味があったのと静的型付け言語を使えるようになりたかったので、学習してみます。 また、業務でReactから少し離れてしまっていたので、こちらも再学習。

とりあえず学習環境を立ち上げるために私物のMacにインストール。

node.jsバージョン管理のためにndenvを入れたいが、 rbenvもついでに共通管理したいのでanyenvを入れて、それ経由でndenvを入れる。

git clone https://github.com/riywo/anyenv ~/.anyenv

自分のmacはbash使ってるので

echo 'export PATH="$HOME/.anyenv/bin:$PATH"' >> ~/.bash_profile
echo 'eval "$(anyenv init -)"' >> ~/.bash_profile

ANYENV_DEFINITION_ROOT(/Users/riywo/.config/anyenv/anyenv-install) doesn't exist. You can initialize it by:

anyenv install --init マニフェストディレクトリがないよと怒られたので

anyenv install --init

でanybenvインストール完了 updateできるように以下をanyenv-updateも入れる

$ mkdir -p $(anyenv root)/plugins
$ git clone https://github.com/znz/anyenv-update.git $(anyenv root)/plugins/anyenv-update

ndenv入れようとしたけど、nodenv推奨らしいので

anyenv install nodenv

node.jsインストール

最初12.0.0入れたけど、このバージョンは問題があるらしく、あとでyarnが実行できないことが発覚したので、最終的に以下のバージョンをインストール。

nodenv install 12.1.0

reactでとりあえずhello-worldを作るために以下のコマンド

 npx create-react-app hello-world --typescript 

作成されたディレクトリに入って

 yarn start

でクロームが立ち上がりlocalhost:3000で無事にreactが実行されました。

これでReactの環境構築完了です！

react