2018年10月11日木曜日

Node express ect multerのサンプルをGitHubで公開

以前にNode express ect multerでファイルアップロードする機能を実装した記事を書いた。
今回は、そのNodeのプロジェクトを少しブラッシュアップして、GitHubに登録、公開した。
※ブラッシュアップ箇所は、日本語を英語に変更、プログラム内の不要なステートメントの削除など。

node express ect multerでファイルアップロード

手順は次のとおり。
自PCはMac book Pro、masOS High Sierra バージョン10.13.6

GitHubで新規リポジトリを作成する。
GitHubの自分のリポジトリの画面で、New repositoryボタンをクリック。


Repository nameに、multer_sample を入力。
Initialize this repository with a README をチェック。
Add .gitignoreで、Nodeを選択。
これら以外は、デフォルト値のまま。
Create repositoryボタンをクリック。



リポジトリが作成直後。
次の手順に進める。


自分のPCに作成したリポジトリをCloneするために、Clone or downloadボタンをクリック、SSHでClone用のテキストをコピーする。



自PCにmulter_sampleのプロジェクトをCloneする。
Gitのコマンドを入力する。その際にGitHubに登録したSSH keyのパスフレーズを聞かれるので入力が必要。
※[XXXXX]はユーザディレクトリ。

git clone git@github.com:takaharu-kobayashi/multer_sample.git
Cloning into 'multer_sample'...
Enter passphrase for key '/Users/[XXXXX]/.ssh/id_rsa': 
remote: Enumerating objects: 4, done.
remote: Counting objects: 100% (4/4), done.
remote: Compressing objects: 100% (3/3), done.
remote: Total 4 (delta 0), reused 0 (delta 0), pack-reused 0
Receiving objects: 100% (4/4), done.


自PCにmulter_sampleプロジェクトをClone直後。次の手順に進む。



multer_sampleにプログラム一式をコピーする。



multer_sampleプロジェクトの状態を確認してみる。
Gitのコマンドを入力する。

cd ./multer_sample/
git status
On branch master
Your branch is up to date with 'origin/master'.

Untracked files:
  (use "git add ..." to include in what will be committed)

 app.js
 bin/
 package.json
 public/
 routes/
 views/

nothing added to commit but untracked files present (use "git add" to track)


コピーしたプログラム一式をステージ領域に登録、確認をする。
Gitのコマンドを入力する。

git add .
git status
On branch master
Your branch is up to date with 'origin/master'.

Changes to be committed:
  (use "git reset HEAD ..." to unstage)

 new file:   app.js
 new file:   bin/www
 new file:   package.json
 new file:   public/javascripts/jquery-2.1.4.min.js
 new file:   public/uploads/dummy.txt
 new file:   routes/index.js
 new file:   views/error.ect
 new file:   views/footer.ect
 new file:   views/index.ect
 new file:   views/layout.ect
 new file:   views/script.ect


自PCのGitのリポジトリへ、前の操作でステージ領域に登録された内容をコミットする。
Gitのコマンドを入力する。

git commit -m "Added multer sample files"
[master f20cf5d] Added multer sample files
 11 files changed, 296 insertions(+)
 create mode 100644 app.js
 create mode 100755 bin/www
 create mode 100644 package.json
 create mode 100644 public/javascripts/jquery-2.1.4.min.js
 create mode 100644 public/uploads/dummy.txt
 create mode 100644 routes/index.js
 create mode 100644 views/error.ect
 create mode 100644 views/footer.ect
 create mode 100644 views/index.ect
 create mode 100644 views/layout.ect
 create mode 100644 views/script.ect


GitHubのリポジトリへ、自PCのGitリポジトリにコミットした内容をPushする。
Gitのコマンドを入力する。その際にGitHubに登録したSSH keyのパスフレーズを聞かれるので入力が必要。
※[XXXXX]はユーザディレクトリ。

git push
Enter passphrase for key '/Users/[XXXXX]/.ssh/id_rsa': 
Counting objects: 19, done.
Delta compression using up to 4 threads.
Compressing objects: 100% (14/14), done.
Writing objects: 100% (19/19), 32.59 KiB | 5.43 MiB/s, done.
Total 19 (delta 0), reused 0 (delta 0)
To github.com:takaharu-kobayashi/multer_sample.git
   80e8133..f20cf5d  master -> master


GitHubの画面でPushされた内容を確認する。問題なくPushした内容が反映されているみたいだ。



次は念のため、GitHubのmulter_sampleプロジェクトをCloneして動作するか確認する。
自PCのmulter_sampleプロジェクトがあるディレクトリではない別のディレクトリでCloneを行う。
Gitのコマンドを入力する。その際にGitHubに登録したSSH keyのパスフレーズを聞かれるので入力が必要。
※[XXXXX]はユーザディレクトリ。

git clone git@github.com:takaharu-kobayashi/multer_sample.git
Cloning into 'multer_sample'...
Enter passphrase for key '/Users/[XXXXX]/.ssh/id_rsa': 
remote: Enumerating objects: 23, done.
remote: Counting objects: 100% (23/23), done.
remote: Compressing objects: 100% (17/17), done.
remote: Total 23 (delta 1), reused 19 (delta 0), pack-reused 0
Receiving objects: 100% (23/23), 33.63 KiB | 242.00 KiB/s, done.
Resolving deltas: 100% (1/1), done.


multer_sampleプロジェクトに必要なパッケージをインストールする。
npmのコマンドを入力する。
※package.json内で指定しているバージョンがdeprecateになっているものがある。2016年1月に作成したプログラムなので古いから、deprecateになっててもおかしくない。動作確認が目的なので、とりあえずそのままにしておく。

cd ./multer_sample/
npm install
npm WARN deprecated jade@1.11.0: Jade has been renamed to pug, please install the latest version of pug instead of jade
npm WARN deprecated constantinople@3.0.2: Please update to at least constantinople 3.1.1
npm WARN deprecated transformers@2.1.0: Deprecated, use jstransformer
npm WARN deprecated coffee-script@1.12.7: CoffeeScript on NPM has moved to "coffeescript" (no hyphen)
npm notice created a lockfile as package-lock.json. You should commit this file.
added 136 packages from 155 contributors and audited 212 packages in 3.884s
found 15 vulnerabilities (8 low, 2 moderate, 5 high)
  run `npm audit fix` to fix them, or `npm audit` for details


いよいよ、multer_sampleプロジェクトを動作させる。
npmのコマンドを入力する。

npm start


ブラウザで、multer_sampleプロジェクトを表示してみる。
ちゃんと表示された。あとアップロードも正常に動いた。
これで終わり。


ちなみに、GitHub上のmulter_sampleのリンクは次のとおり。

https://github.com/takaharu-kobayashi/multer_sample






0 件のコメント :

コメントを投稿