🐕

React初心者が「りあクト!」本読んで勉強する記事

2021/06/24に公開

りあクト 始める以前の環境構築の話

SIerにいて今後のキャリアが不安なので新しい技術を勉強してます。

普段バックエンド(C#)メインなので「ナウい」言語やってみたいと思ってReact入門してみました。
この記事を見てくださった初学者の方と3ヶ月後の僕のために調べたことを書いてますので、ご指摘あればコメントいただけると幸いです。

Linuxコマンドわからん芸人なのでまずはここから学習

まずはこれの意味をわかるようになりたい

$ brew install anyenv ##anyenv(pyenvやrbenvもまとめて管理できるパッケージマネージャー)
$ echo 'eval "$(anyenv init -)"' >> ~/.zshrc  # "$(anyenv init -)"をコマンドとして実行(eval) というのを.zshrcに書き込み
$ exec $SHELL -l # シェルを再起動
$ anyenv install nodenv
$ exec $SHELL -l # シェルを再起動

ここで

$ anyenv install nodenv

anyenv-install: definition not found: nodenv

おや。。。うまくいかない。。

$anyenv install --init
$anyenv install nodenv

anyenv の初期化が必要だったようですね
上手くインストールすることができました👍

次→

anyenv プラグイン、nodenvプラグインのインストール

$mkdir -p $(anyenv root)/plugins
$ git clone https://github.com/znz/anyenv-update.git $(anyenv root)/plugins/anyenv-update
$ mkdir -p "$(nodenv root)"/plugins
$ git clone https://github.com/nodenv/nodenv-default-packages.git "$(nodenv root)/plugins/nodenv-default-packages"
$ touch $(nodenv root)/default-packages

$mkdir -p $(anyenv root)/pluginsの場所ってどこにできてるのかな
確認↓

% ls

Applications Documents Library Music Public workspace
Desktop Downloads Movies Pictures RubyMineLearningProject

あれ。。。。ないねえ。。。。

環境変数に入れてたし呼び出して確認してみる

% echo $(anyenv root)

/Users/maa/.anyenv

いた👍

nodenvも同様に

いるいる☺️

default-packages 内の中身の変更

Node.jsのインストール

$ nodenv install -l
$ nodenv install 14.4.0
$ nodenv global 14.4.0  # デフォルトで使用するNode.jsのバージョンを指定
nodenv local <バージョン番号>  # 任意のディレクトリのNode.jsのver固定。
$ node # irbのような挙動をとる。中で計算や変数設定し編集もできる。

> .help
.break Sometimes you get stuck, this gets you out .clear Alias for .break
.editor Entereditormode
.exit .help .load .save
Exit the repl
Print this help message
Load JS from a file into the REPL session
Save all evaluated commands in this REPL session to a file
Press ^C to abort current expression, ^D to exit the repl
> .load 01-hello/01-env/rectangle.js > const square = new Rectangle(5, 5); > square.getArea();
25

Visual studio codeのインストール

私の開発環境にはRubymineしかなかったので新たにインストール。
柴崎さんオススメの VS Code 拡張リストの他にVS Codeを日本語化するプラグイン入れてます。
参考資料 https://www.javadrive.jp/vscode/install/index4.html

Discussion