スキップしてメイン コンテンツに移動

M1 MacbookのWeb開発環境

投稿者: ホンダ


ng new my-app ちょっと時間が開いてしまいましたが、開発環境の整備をしていこうと思います。

Web開発にはプロジェクトによって色々なプログラミング言語を使ったりしていますが、ここ最近一番多い構成はAngular / node.js / TypeScript な構成です。エディタにはVisual Studio Codeを使っています。

Node.jsのインストール

v15からARM64に対応しているそうなので、v15をインストール。node.jsのバージョン管理には以前からnvmを使用しているので、まずはnvmをインストール。

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.37.2/install.sh | bash

xcodeをまだ動かしていなかったのでライセンスの確認をするようにメッセージが表示される。

You have not agreed to the Xcode license agreements, please run 'sudo xcodebuild -license' from within a Terminal window to review and agree to the Xcode license agreements.

Failed to clone nvm repo. Please report this!


エラーメッセージの通り sudo xcodebuild --license を実行してライセンスを確認して agree と入力。

もう一度 nvmのインストールスクリプトを実行。


すると今度はシェルの設定ファイルがないから、ファイルを作って再度スクリプトを実行するか、設定ファイルに追記しろってメッセージが表示される。


=> Profile not found. Tried ~/.bashrc, ~/.bash_profile, ~/.zshrc, and ~/.profile.

=> Create one of them and run this script again

   OR

=> Append the following lines to the correct file yourself:


touch ~/.zshrc を実行して再度nvmのインストールスクリプトを実行して無事にインストールできました。


開いているターミナルではパスが通っていないので、一旦ターミナルを立ち上げ直して、nvmコマンドが使えることを確認したら


nvm install v15

を実行してnodejs v15のインストールを行います。バイナリファイルがないようで、ソースコードからビルドを行うので少々時間がかかります。


Visual Studio Codeのインストール

Visual Studio Codeのリリース版ではまだARM64版は提供されていませんが、ベータ版的な位置付けのInsider BuildでARM64版が提供されているのでこちらをインストールしてみます。

https://code.visualstudio.com/insiders/

ARM64版をダウンロードしたら、zipファイルを展開してアプリケーションフォルダにコピーするだけですね。

Insider版はアイコンの色がちょっと違う


まあ、普通に使えてますね。

Angularを動かしてみる

とりあえずnodeとエディタの準備ができたので、angularを動かしてみる。

npm install -g @angular/cli ng new my-app cd my-app npm install ng serve

はい、何事も問題なく動きますね。

ラベル:

コメント

コメントを投稿

このブログの人気の投稿

電子マネーチャージ用のクレジットカード

投稿者: ホンダ
MUFGカードでマイルをセコセコ貯めているのですが、昨年、 MUFGカードからの衝撃的なお知らせ をお伝えしたとおり、MileagePlus MUFGカード ゴールドプレステージ Visaでの電子マネーチャージしてもマイルが貯められなくなって寂しい思いをしています。 マイルを1箇所にまとめてためたいところですが、コンビニでクレジットカード払いをするのもなんだな面倒な感じですし、そもそもおサイフケータイ大好きっ子なので、電子マネー使えるところでは、シャリーンとか、ピュリーンとかピピッ！とかワォンとか鳴かせたいわけです。 そこで仕方がないので、電子マネーチャージ用に別のクレジットカードを作ることにしました。1.2%のPontaポイントが貯まる リクルートカード です。 昨年まではリクルートポイントってのが貯まってたみたいですが、リクルートポイントがPontaポイントに統合されたみたいです。じゃらんとかホットペッパーとかよく使うので、リクルートポイントでもPontaポイントでもどちらでもいいのですが、Pontaポイントの方が購買情報などをより広くばらまかれるんでしょうね。 今なら最大6000ポイントもらえるらしいですが、内4000ポイントはカードで携帯電話の料金を払った場合なので、ちょっと煩わしいです。 カードの紹介に「電子マネーチャージでもポイント対象になります。」って書いているので大丈夫だと思うのですが、カードの発行元がMUFGカードなので、またそのうち衝撃的なお知らせが来ないか心配ではあります。 とはいえ、年会費無料で1.2%の還元率は魅力的なので、ひとまず電子マネーチャージ用に申し込んでみました :)
コメントを投稿
続きを読む

やっと格安SIMに引っ越しします

投稿者: ホンダ
ケータイ乞食に冬の時代が訪れてしばらく経ちますが、やっとドコモ様の2年縛りの呪縛から開放されるので格安SIMに引っ越ししようと思います。 ケータイ乞食の春の時代はiPhone本体一括0年で、何故か数万円のキャッシュバックがもらえていたりしていました。その頃は多いときで3大キャリア合わせて10回線以上の契約があったりしていました。 冬が訪れて、徐々に整理していって今や4回線となりました。アプリ開発のテストとかも考えると4回線くらいはあった方がいいかなと思います。 （普段遣いのAndroid, iPhone用に2回線、テスト端末用に2回線) 格安SIMはたくさんの会社がいろいろ出していて、どのサービスにするかとても悩みます。私的にいろいろ悩んだ結果、DMMモバイル にすることに決めました。 DMMモバイル に決めた理由は ・複数SIMが使える ・10分間通話し放題のオプションがある ・ギガが割と安い ・DMM光 の割引がある あたりです。 当初はSNSフリーという月額250円でTwitterやFacebookなどの通信が無制限にできるオプションに惹かれていたのですが、口コミとか調べているとSNSフリーにするとかなり遅くなるみたいなので、SNSフリーは使わないでギガを多めにしようと思います。 家のインターネットにはドコモ光を使っているのですが、こちらもDMM光 に乗り換えます。 一旦ドコモ光を解約してからDMM光 の新規契約という流れになるみたいでちょっとめんどくさいですが、ドコモ光を使い続ける理由もないし、DMMモバイル とセットで使うと月500円割引があるので、インターネット代も少し安くできそうです。
コメントを投稿
続きを読む

MacBook Proのキーマップその２

投稿者: ホンダ
KeyRemap4MacBookで快適日本語入力生活をおくっていますが、キーマップ変更といえば奥さん、あれですよね、あれ。ControlとCapsLockの入れ替えです。 Emacs使いなら必須ですね。僕はEmacs使いじゃありませんが、そのうちEmacs使いになりたいような、なりたくないようなそんな感じです。 CapsLockやControlキーのキーマップ変更は、KeyRemap4MacBookの拡張機能として提供されている PCKeyboardHack から簡単に設定できました。 Change Caps Lockにチェックを入れて、keycodeに59（Control L)を指定します。 すごい簡単。 でも、Macでターミナル使ってるとキーボードショートカットがCommandだったり、Controlだったりしてちょっと混乱します。 慣れるのが先か、設定いじるのが先か、どうしましょ。
コメントを投稿
続きを読む