Метеор Привет, пример мира
В этом руководстве мы покажем вам, как создать веб-сайт с помощью фреймворкаMeteor.
Используемые инструменты:
-
Метеор 1.2.1
-
Протестировано с Linux (Debian, Ubuntu или Mint)
-
Протестировано с Mac OSX
1. Установите Метеор
Выдавайтеcurl https://install.meteor.com | sh, все будет установлено и настроено.
$ curl https://install.meteor.com | sh
% Total % Received % Xferd Average Speed Time Time Time Current
Dload Upload Total Spent Left Speed
100 6674 0 6674 0 0 4145 0 --:--:-- 0:00:01 --:--:-- 4145
Downloading Meteor distribution
######################################################################## 100.0%
Meteor 1.2.1 has been installed in your home directory (~/.meteor).
Writing a launcher script to /usr/local/bin/meteor for your convenience.
//...
Это установит исполняемый скриптmeteor.
2. Создать приложение Meteor
2.1 Issue meteor create {app-name} to create a Meteor app based on the default ‘click-and-count” template. В этом уроке мы создадим приложение «привет».
$ meteor create hello Created a new Meteor app in 'hello'. To run your new app: cd hello meteor //...
2.2 When it’s done, you will see a hello directory, containing the following files :
$ tree -a -L 1 hello hello |--- hello.css |--- hello.html |--- hello.js |--- .meteor
2.3 Review the generated files.
hello.js
if (Meteor.isClient) {
// counter starts at 0
Session.setDefault('counter', 0);
Template.hello.helpers({
counter: function () {
return Session.get('counter');
}
});
Template.hello.events({
'click button': function () {
// increment the counter when button is clicked
Session.set('counter', Session.get('counter') + 1);
}
});
}
if (Meteor.isServer) {
Meteor.startup(function () {
// code to run on server at startup
});
}
hello.css
/* CSS declarations go here */
hello.html
hello Welcome to Meteor!
{{> hello}}You've pressed the button {{counter}} times.
P.S The folder .meteor containing the current Meteor project configuration info, often times, you don’t touch this.
3. Запустите приложение Meteor
Чтобы запустить приложение Meteor, перейдите к корневому пути проекта, введитеmeteor
$ cd hello/ $ pwd $ /home/example/hello $ meteor [[path-to/hello ]]]]] => Started proxy. => Started MongoDB. => Started your app. => App running at: http://localhost:3000/
Метеор будет запущен в порту 3000.
4. Demo
4.1 Opens the browser and access http://localhost:3000/
4.2 In the broswer, open few tabs and access the same URL http://localhost:3000/, leaves the browser open. Отредактируйтеhello.html, добавьте «hello world» в конец строки заголовкаh1 и сохраните его.
hello.html
hello Welcome to Meteor! hello world
{{> hello}}You've pressed the button {{counter}} times.
4.3 Review the browser again, changes immediately appear on all browser tabs, no need to refresh the browser or F5!
5. FAQs
5.1 How to stop the running Meteor app?
A : Bring up the terminal where the Meteor app is running, and press ctrl+c
5.2 Is there other Meteor app template?
A : meteor create --list
$ meteor create --list Available examples: clock leaderboard localmarket simple-todos simple-todos-angular simple-todos-react todos
Пример создания приложения Meteor из шаблона «localmarket»
$ meteor create hello --example localmarket
5.3 How to start Meteor app on different port?
A : Uses meteor --port {port-number}
$ meteor --port 8080
Для порта ниже 1024 требуетсяsudo
$ meteor --port 80 Error: listen EACCES $ sudo meteor --port 80