あらすじ
CLI は大抵の場合、プロジェクトフォルダごと作ってしまいます。
しかしプロジェクトフォルダを作ってからフォルダ指定で CLI を動かすこともできるのです。
自分がいろんなフレームワークのチュートリアルをやったときの話です。
Git単体やフレームワーク単体での取り扱いはウェブサイトや書籍でよく見かけます。
ところが、両方連携してどう扱うのかという話ってなかなか見かけません。
コマンドでプロジェクト生成終わった後に Git 使う場合どうするんだ？
ってとても大変だったので、まだ気が付いてない人はぜひ早めに気が付いて欲しいです。
どっちが先がいいのか？
- CLI でフォルダ作成＆各種ファイル生成→
git initで Github アドレス指定 - Github でプロジェクト作成→
git clone→CLIで各種ファイル生成
状況に応じて好きなほうを選べたらいいと思います。
フレームワークごとに比較
フレームワークによっては、先にフォルダがあると作成できずエラーメッセージが帰ってきます。
mysiteが既に存在すると怒るのに、.は常に存在するのに怒られません。謎です。
| フレームワーク名 | カレントフォルダにフォルダ作成＆構築 | カレントフォルダに構築 |
|---|---|---|
| Django | django-admin startproject mysite | django-admin startproject . |
| Angular | ng new my-app | ng new . |
| React | npx create-react-app my-app | npx create-react-app . |
| Vue | vue create my-project | vue create . |
『.』に気が付けるか？
この.が結構厄介で、これが使えることに触れているドキュメントが少ないです。
そのうえ書籍を参考にしてたりすると印刷ミスか汚れと勘違いしたりします。
自分はこれに気が付かず、遠回りをしてしまいました。
最後には Sails.js のチュートリアルに書かれていて気が付くことができて、
「お？これは他のフレームワークでも利用できるのでは？」と得意げでした。
中には.がカレントディレクトリだと常に意識している人がいたりして、
ぱっと閃くのかもしれません。普段からCUIに慣れているとお手の物なのでしょうか。
オススメの手順
個人的にはgithubのサイト上でプロジェクト作成してから、
緑のボタン「clone or download」で「Open in Desktop」するのがお気に入りです。
以下のツールを持ってると連携が楽なのでお勧めです。
githubサイト上で「Open in Desktop」すると、
自動で「github desktop」が起動します。
その画面上でcloneボタンを押すと、
次の瞬間には「open in VS code」と書かれたボタンが出現します。
そして、Vscode内のターミナルでフレームワークのCLIコマンドを実行します。
Excelsior!