開発前の準備「とにかくローカルに表示する！プロジェクトに参加していく！」

3422 ワード
Node.js ローカル npm Windows クローン Windows テキストリンク

【この記事を読むのは、こんなことに困った時】

・プロジェクトに参加するために環境構築するけど流れがわからない
・すでにリモートにあるプロジェクトをローカルに用意したい
・クローンしたあと必ずすることnpm install

【環境構築手順メモ　ーⅠ】

＜前提＞

PC：Windows
Webサーバー：IIS
言語：html css C# PHP JS TS
作成：HP
その他：リモートからプロジェクトをクローン

＜きっかけ＞

サイト引継ぎの際の環境構築。


【手順の流れ】

➀ ローカルにプロジェクトを用意する　◀今回はここ！
➁実行環境の導入（npm install） 　 ◀今回はここ！
➂IIS（ローカルサーバー）の設定
➃サイト表示の確認
➄画像がコード管理から外されている場合はダウンロード（git管理下ならこの作業は不要）


【手順】

「➀ローカルにプロジェクトを用意する」

1. 保存したい場所にプロジェクト用の空ファイルを新規作成

　 　※これは好みですが練習なら練習用ファイル、複数人との共同開発ならそろえた場所にあってもいいかもです。

.例（個人）
・C:/プロジェクトファイル（Windows）
・User/プロジェクトファイル（Mac）
・デスクトップ上
　　　　　　　　　　　　　　　　　　　　　...など
2. リモートからプロジェクトをクローン

　　・リモート（GitHub、BitBucketなどコード管理システム）からgit clone用のURLをコピーしてくる
（「例：git clone https://xxx@クローン元サイト/xxx/xxx.git」 こんなのがプロジェクトのところにあるはず！)

3. ターミナル（もしくは、コマンドプロンプト）を開く

　　・1.で用意した空のプロジェクトファイルに移動（コマンド：　cd 移動したいファイル名）

.例（windows）
 cd Desktop
4.移動できたらコピーしたURLを貼ってクローン



「➁実行環境の導入（npm install）」

1. ➀で用意したプロジェクトをVScodeで開いてそのターミナルでコマンド「npm install」
2.これでgulpのモジュールが使えるようになったので「npx gulp」が使えるようになる。



➀、➁のりローカルでの用意はここで完了！

次回【➂IIS（ローカルサーバー）の設定】です。

※注意IISはWindowsでのみ使えるサーバーです。
※筆者はMacでの開発も行っております。IIS代替えとしてMAMPを使用しておりますので、別記事で追記予定です。


【気になるワード】---記事内でより理解を深めたいワード