EclipseでAngular2を用いたクライアントを作成する手順をまとめます。もし同じように挑戦したい方は、まず同じようにやってみてください。事前にEclipseをインストールし、Angular IDEを追加していることが前提となります。
まずEclipse上でプロジェクトを作成する。[New Project]を選択すると、事前にEclipseにAngular IDEをインストールできていれば下のようにAngularプロジェクトが選べる。(選べない場合はインストールできているか確認する)
Angularプロジェクトを選択し、必要な設定をすると、裏でAngular CLIというツールが動いて、テンプレートが生成される。なお、Angular CLIのバージョンはbeta.24以降が好ましい。古いと、「'listLazyRoutes' of undefined」という不可解なエラーが発生する場合があり、対処法が良く分からない。ドツボにはまる前に設定をしておくこと。
Finishを押してプロジェクトを作ると、以下のような画面が出てくる。ソフトのダウンロードに時間がかかるので3分位待つ必要があるので注意。
これでプロジェクトのテンプレートは完成。試しに以下のように虫を押すか、Start Server in Development Mode(Productionでも可)を押すと、ブラウザが立ち上がり、「app works!」と表示されるはずである。
今度は、完成したテンプレートをGitHubに登録するため、プロジェクト共有の設定を行う。まずは、プロジェクトを右クリックして[Share]>[Share Project..]を選択する。
出てきたダイアログの[Use or create repository in parent folder of project]を選択する。はじめは以下のように[Finish]が選択できない状態だが、[Create Repository]を押すと…
以下のように[Repository]の列に[.git]が出てきて、[Finish]が押せるようになる。
上記の作業が完了した時点でローカルのリポジトリは生成されるが、中身はまだ空である。ローカルのリポジトリに、ファイルを保存するためにはコミットを実行する。対象ファイルは、リストに表示されたファイル全てでOK(不要なものは事前に取り除かれているので)
コミットまでできたら、ローカルのリポジトリにファイルが保存された状態になる。
今度は、ローカルのリポジトリをGitHubにPushする。(これにより他の人が閲覧したり編集したりできるようになる)。
そのためにはまず、ローカルのリポジトリの設定画面で、Remoteの設定をする必要がある。(ローカルのリポジトリは、GitHubにあるオリジナルを持ってきたクローンであると教えてあげることで、ローカルのリポジトリの内容をGitHubに反映する=Pushできるようになる)。設定画面のURLにはGitHubで表示されるリポジトリのURLを入力する。
今回はGitHubに事前に登録してあるSSH公開鍵を使った認証をしたいので、↑のURLはSSHのものを選択している。↓の設定画面のPutty Key(秘密鍵)には、GitHubに登録してある公開鍵に対応したPuttyの秘密鍵のファイル(.ppkファイル)を設定している。
これで[Add New/Save]をすれば、 ローカルの編集をGitHub上にPushできるようになる。
とりあえずこれで開発の準備はOKになります。…あまりに説明のない手順でした。