# [meteor]一分鐘完成一個WEB APP by javascrpit

- URL: https://justfly.idv.tw/meteor%e4%b8%80%e5%88%86%e9%90%98%e5%ae%8c%e6%88%90%e4%b8%80%e5%80%8bweb-app-by-javascrpit/
- 日期: 2012-04-14
- 分類: WEB&RIA
- 標籤: app, free, javascript, server, service

https://justfly.idv.tw/wp-content/uploads/2012/04/meteor.png繼node.js之後，又出現了一個光靠javascript就幫我們做後前後端的framework – [meteor](http://www.meteor.com)

說是framework其實應該是把Node.js＋Heroku＋npm的功能包在了一起，並且在檔案儲存的瞬間，即時反應到本地端測試伺服器上。要發佈也非常的容易。

說的好像很神奇，不如實際來操作看看：

- 安裝

```
$ curl install.meteor.com | sh
```

-

```
# 做一個專案取名leaderboard
$ meteor create --example leaderboard
# 到專案目錄下
$ cd leaderboard
# 取一個id發佈到meteor.com
$ meteor deploy justfly.meteor.com
# 在本地端啟動meteor
$ meteor
```

-
		這時本地端跟meteor.com上的服務都已經啟動了，所以打開瀏覽器輸入

		「[http://justfly.meteor.com/](http://justfly.meteor.com/)」

		「[http://localhost:3000/](http://localhost:3000/)」(meteor預設就是使用port 3000)

		這時兩邊看到的會是一樣的sample。各在兩邊都按按玩玩，兩邊的資料是不同步的（廢話＠＠），但是如果用不同的電腦或瀏覽器同時對「[http://justfly.meteor.com/](http://justfly.meteor.com/)」做更動，就會即時的同時反應….哦～多了一些想法了吧？

- 修改

		打開~/leaderboard/leaderboard.js

```
Template.leaderboard.players = function () {
	return Players.find({}, {sort: {score: -1, name: 1}});
};
```

```
Template.leaderboard.players = function () {
	return Players.find({}, {sort: {score: 1}});
};
```

		儲存後，看看「[http://localhost:3000/](http://localhost:3000/)」，會發現他已經套用了我們的修改了！！！

- 發佈

```
# 更新到server
$ meteor deploy justfly.meteor.com
```

		這時「[http://justfly.meteor.com/](http://justfly.meteor.com/)」也已經套用了我們的修改，而且是帶著原本的資料。

當然只是這個例子的話，就沒什麼有趣的啦。follow [@meteorjs](https://twitter.com/#!/meteorjs)比較有趣的[聊天室範例](http://vimeo.com/40300075)有興趣就試試看吧～順便一提，看到影片中那個編輯器[chocolat](http://chocolatapp.com/)好好用的感覺，就找來用用看～嗯，真的還不錯勒～

資料參考：

- [もうJavaもRubyも要らない？–JavaScriptオンリーの未来派WebアプリフレームワークMeteorがデビュー](http://jp.techcrunch.com/archives/20120411meteor-launch/)

- [1分でWebアプリを作れて、3分で公開できた！オールJavaScriptでWebアプリを開発できるMeteorを触ってみた](http://d.hatena.ne.jp/Syunpei/20120413/1334276712)