今はもうない

30代上流SEが技術の勉強をするメモ

Node.js 環境構築(2020年5月時点)とJavaScriptの実行

はじめに

本業は上流SE、副業でRailsエンジニアをやっているのだけれど、本業で急遽フロントエンド(しかもSPA)を書くことになった。
JSは雰囲気で触れるぐらいなので慌ててJSを勉強し直すことに。
とりあえず実行環境としてNode.jsを手元のMacBookに構築する。

構築環境

導入環境はMacBook Pro 13.3インチ(2020)と
OSはCatalina10.15.5で確認しています。 Homebrewは導入済みの前提。
MacOS Catalinaからは標準shellがzshになっているので気をつける。

nodebrewのインストール

nodebrewで実行環境を管理する。 github.com

pyenv,rbenvのようにnodejsのバージョンを管理することができる。

Homebrewでインストールする。

$ brew install nodebrew

完了後は以下のコマンドでバージョンを確認する。

$ nodebrew
nodebrew 1.0.1

Usage:
    nodebrew help                         Show this message
    nodebrew install <version>            Download and install <version> (from binary)
    nodebrew compile <version>            Download and install <version> (from source)
    nodebrew install-binary <version>     Alias of `install` (For backword compatibility)
    nodebrew uninstall <version>          Uninstall <version>
    nodebrew use <version>                Use <version>
    nodebrew list                         List installed versions
    nodebrew ls                           Alias for `list`
    nodebrew ls-remote                    List remote versions
    nodebrew ls-all                       List remote and installed versions
    nodebrew alias <key> <value>          Set alias
    nodebrew unalias <key>                Remove alias
    nodebrew clean <version> | all        Remove source file
    nodebrew selfupdate                   Update nodebrew
    nodebrew migrate-package <version>    Install global NPM packages contained in <version> to current version
    nodebrew exec <version> -- <command>  Execute <command> using specified <version>

Example:
    # install
    nodebrew install v8.9.4

    # use a specific version number
    nodebrew use v8.9.4

node.jsのインストール

以下のコマンドでnodesjの安定版をインストールする。

$ nodebrew install stable

すると、以下のエラーが出た。

Fetching: https://nodejs.org/dist/v14.3.0/node-v14.3.0-darwin-x64.tar.gz
Warning: Failed to create the file
Warning: /Users/xxxxxx/.nodebrew/src/v14.3.0/node-v14.3.0-darwin-x64.tar.gz:
Warning: No such file or directory
curl: (23) Failed writing body (0 != 979)
download failed: https://nodejs.org/dist/v14.3.0/node-v14.3.0-darwin-x64.tar.gz

ディレクトリが無いので作成する。

mkdir -p ~/.nodebrew/src

再トライすると無事インストールされた。

$ nodebrew install stable
Fetching: https://nodejs.org/dist/v14.3.0/node-v14.3.0-darwin-x64.tar.gz
################################################################# 100.0%
Installed successfully

インストールの確認をする。

$ nodebrew ls
v14.3.0

current: none

currentに指定するにはuseを使う。

$ nodebrew use v14.3.0
use v14.3.0

$ nodebrew ls
v14.3.0

current: v14.3.0

これだけだとパスが通っていないため、パスを通す。 zshの場合は.zprofileか.zshrcのどちらか。

$ echo 'export PATH=$HOME/.nodebrew/current/bin:$PATH' >> ~/.zprofile
$ source ~/.zprofile
$ node -v
v14.3.0

これでnode.jsの環境構築はOK。

jsの実行

以下のコマンドで、pythonの対話モードのようにjsを実行できる。

$ node

この環境を使ってJavaScriptのおさらいをした。

developer.mozilla.org

当然だけどhtml等に関連するコマンドは実行できないので、そこだけ気をつける。

MacBookの初期設定と諸々のアプリの導入(2020年5月版)

はじめに

MacBookの初期設定をわりと頻繁にやるので、一連の流れを備忘代わりに記事にする。

対象環境:macOS Catalina 10.15.5

Macの設定等

Dockからいらないアプリを消す

あとでAlfredを入れるので使用頻度がよほど高くない限りdockには入れない。
最初から入っているもので残すのはSafari, AppStore, 環境設定ぐらい。

システム環境設定

Dock

サイズを初期設定の半分ぐらいに。
- 「Dockを自動的に表示/非表示」にチェック
- 「最近使ったアプリケーションをDockに表示」のチェックを外す

セキュリティとプライバシー

最低限のセキュリティ設定を入れる。
- FileVaultをONにする
- ファイアーウォールをONにする

キーボード

  • キーのリピートを最速に
  • リピート入力認識までの時間を最短に

トラックパッド

  • ポイントとクリック > 「調べる&データ検出」のチェックを外す
  • ポイントとクリック > 「軌跡の速さ」を右から3番目に設定

ディスプレイ

  • 解像度を「スペースを拡大」に設定

ツール類の導入

ブラウザ

Chromeを入れる。
別にこだわりはないのでFirefoxでもSafariでもいいのだけれど、拡張機能で慣れているものを使いたいので惰性でChromeにしている。
Chrome拡張機能は別記事に。

IME

何も考えずにGoogle日本語入力を入れる。
Windows生活が長かったせいかMacのデフォルトのIMEが体に合わないので大変重宝してます。
デフォルトだとセキュリティに引っかかってインストールできないので、エラーが出たら
環境設定 > セキュリティとプライバシー > 一般
から実行許可を与える。
インストール後は
環境設定 > キーボード > 入力ソース
から不要な設定を削除する。ひらがな(google)と英数(google)だけあればいい。
環境によってはデフォルトの「ABC」が消せない場合があるかも。

Alfred

みんな大好きAlfred
細かな解説は色んな人が解説してるから省くけれども、Spotlightとショートカットを入れ替える設定だけ紹介する。
Spotlightのデフォルトのショートカットはcmd + space, Alfredのショートカットはopt + spaceになっているんだけど、間違えてSpotlightを起動するたびにいらっとするので入れ替える。

Spotlight

環境設定 > Spotlight > 検索結果 > キーボードショートカット
から「Splotlight検索を表示」をopt + spaceに設定する。

Alfred

上の設定後にAlfredを起動する。
初期設定時にHotkeyを設定できるので、cmd + spaceを割り当てる。

エディタ

Visual Studio Codeを入れる。
比較的軽量で、エクステンション次第でどの言語を扱うにもちょうどいい。
色々試したけど、結局脳死VSCodeを使っている。
拡張機能は……これも別記事か。

パッケージ管理

何も考えずにHomebrewを入れる。 MacPortsの方が便利、と言う人は結構いるけれど、Macのアカウントを複数作らないならHomebrewでいいのでは。
僕が見る限りでは、ツールやフレームワークとかの導入解説の記事はだいたいHomebrewだと思う。

ターミナル

2019年まではiterm2を使っていたのだけれど、試しにHyperを試している。
VS Codeと同じくElectronベースということで使ってみたら実に具合がいい。
テーマの変更もここから選ぶことができる。
上で入れたhomebrew caskでインストールする(公式からパッケージを落としてきてもいい)。

$ brew cask install hyper

まとめ

長くなったので個別の設定は気が向いたら別記事にする。