2
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

Node.jsとMongoDBで作られたサンプルアプリを動かす

Last updated at Posted at 2021-09-26

#はじめに
本記事は以下チュートリアルを補足したものです。
チュートリアルを進める上で嵌った個所などについて補足してみました。

最終的にローカルで動作するTODOアプリが出来ます。↓
Node_Angular-Todo-App-Google-Chrome-2021-09-26-18-10-20.gif

#環境
Windows 10 Home

#前提
以下がインストール済みであること。
git version 2.14.1.windows.1
nodejs v14.15.4
Docker Desktop 20.10.7
MongoDB Compass 1.28.4
Visual Studio Code

#MongoDBコンテナ作成
コマンドを実行し、MongoDBのDockerイメージを取得します。

docker pull mongo

Docker Desktopを起動し、images > RUNを押下します。
image.png

Container NameとPortsを入力し、Runを押下します。
image.png

MongoDB Compassで接続に成功することを確認します。

mongodb://127.0.0.1:27017/

image.png

#サンプルコードのダウンロードと実行

  1. Visual Studio Codeを開きます。
  2. F1 キーを押してコマンド パレットを表示します。
  3. コマンド パレットのプロンプトにgitclと入力し、Git: Clone コマンドを選択して、Enter キーを押します。
  4. リポジトリの URL の入力を求められたら、https://github.com/scotch-io/node-todoと入力し、Enter キーを押します。
  5. プロジェクトの複製先となるローカル ディレクトリを選択 (または作成) します。
  6. Ctrl+` キーを押して Visual Studio Code の統合ターミナルを表示します。
  7. npm install -gと入力し、Enterを押します。
  8. server.jsを開き、12行目のmongoose.connect(database.localUrl);localUrlにマウスカーソルを合わせ、Ctrl+Shift+F12 キーを押します。
  9. localUrlを次のように変更します。localUrl: 'mongodb://127.0.0.1:27017'
  10. server.jsのタブがアクティブになっている状態でF5 キーを押下します。
  11. Node.jsを選択します。
    image.png

#動作確認
ブラウザを開いて http://localhost:8080 に移動し、エラーなくアプリが表示されることを確認します。

#おわりに
おわりです。

2
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?