Meteor - 開始第一個 Meteor 應用程式專案

發表於 更新於

Meteor 是架構在 Node.js 上的平台，用來開發 real-time 的網頁程式。Client/Server 都是 Javascript 開發，Meteor 程式都能夠在前後端共用。而且這套框架非常容易學習，短時間內就能夠開發出應用程式出來的唷

學習目標

逐一步驟介紹建置 Meteor 初始化應用程式專案。

安裝 Meteor

安裝 Meteor 的方式在 terminal 輸入以下命令：

curl https://install.meteor.com | sh

安裝完之後你可以再次輸入 meteor 後，執行會說明目前不是在 meteor 專案下，所以目前還只能確認 Meteor 安裝成功並且還會指引你建立 Meteor 專案的指令

1
2
3
4
5
6
7
8
9
$ meteor
  run: You\'re not in a Meteor project directory.

  To create a new Meteor project:
    meteor create <project name>
  For example:
    meteor create myapp

  For more help, see 'meteor --help'.

建立新的專案

裝好 meteor 後，我們建立一個新的專案，建立時使用 meteor 的工具

meteor create meteor_demo

按照命令就會把 meteor 建立基礎的檔案結構，建立完成後就會有一個 meteor_demo 的資料夾，並且說明如何執行應用程式

1
2
3
4
5
6
7
8
9
10
11
12
13
$ meteor create meteor_demo
  Created a new Meteor app in 'meteor_demo'.

  To run your new app:
    cd meteor_demo
    meteor npm install
    meteor

  If you are new to Meteor, try some of the learning resources here:
    https://www.meteor.com/learn

  meteor create --bare to create an empty app.
  meteor create --full to create a scaffolded app.

也包含以下的檔案與資料夾

1
2
3
4
5
6
drwxr-xr-x   7 User  staff   238 Feb 12 08:40 .
drwxr-xr-x  49 User  staff  1666 Feb 12 08:40 ..
drwxr-xr-x  10 User  staff   340 Feb 12 08:40 .meteor
drwxr-xr-x   5 User  staff   170 Feb 12 08:40 client
-rw-r--r--   1 User  staff   183 Feb 12 08:40 package.json
drwxr-xr-x   3 User  staff   102 Feb 12 08:40 server

接著，我們就依照他的指引安裝一些套件

1
2
3
$ cd meteor_demo
$ meteor npm install
$ meteor

在輸入第三行的 meteor 時，是否有發現先前我們在一開始介紹時已經有輸入過了，而這次的執行 meteor 確實是有專案，現在就馬上打開瀏覽器，檢視 http://localhost:3000/ 或是 ( http://0.0.0.0:3000/ )

1
2
3
4
5
6
7
8
$ meteor
[[[[[ ~/Projects/demo/meteor_demo ]]]]]

=> Started proxy.
=> Started MongoDB.
=> Started your app.

=> App running at: http://localhost:3000/

執行成功畫面

執行成功畫面

這樣子順利運行，若想停止運行應用程式的話只要在執行的 terminal 按下 ctrl+c 就可以了喔！

參考資料

Meteor: Build Apps with JavaScript