meteor Flashcards
1
Q
meteor: To run your app on localhost, type
A
cd into it and type meteor
2
Q
meteor: To create a new app, type
A
meteor create my_app
3
Q
meteor: To render code into your html, type
A
{{myVar}}
4
Q
meteor: To create a for loop in a template, type
A
{{#each items}}
{{> item}}
{{/each}}
5
Q
meteor: To run code only on client, type it into
A
if (Meteor.isClient) {
}
6
Q
meteor: meteor parses your template to find
A
head, body and template
7
Q
meteor: templates can be rendered in HTML by typing
A
{{> templateName}}
8
Q
meteor: To create an if statement in a template, type
A
{{#if}}
9
Q
meteor: To pass data into templates from your JavaScript code, type
A
if (Meteor.isClient) {
Template.body.helpers({
myCollection: [
{ field: "String" },
{ field: "String" },
]
});
}
10
Q
meteor: To create a template, type
A
-template name=”templateName”>
…
-/template>
11
Q
meteor: To create a database collection, type
A
MyCollection = new Mongo.Collection(“my-collection”);
note: remember new
12
Q
meteor: To pass data into a template from a database query as a helper, type
A
Template.body.helpers({
getCollection: function () {
return MyCollection.find({});
}
})
13
Q
meteor: Items inside collections are called
A
documents
14
Q
meteor: To access the mongo console from the terminal, type
A
meteor mongo
15
Q
meteor: To insert a document into a collection inside the mongo console, type
A
db.collectionName.insert({ field1: “string”, createdAt: new Date });
16
Q
meteor: To listen to and handle an event in a template, type
A
Template.templateName.events({
“click .css-class”: function(event, template_instance)} {
event.preventDefault();
})
17
Q
meteor: To access the value of an input field from a form submit event, type
A
event.target.fieldName.value
18
Q
meteor: To clear the value of an input field from a form submit event, type
A
event.target.fieldName.value = “”;
19
Q
meteor: To sort the data going into a template, type
A
MyCollection.find({}, {sort: {field1: -1}});
20
Q
meteor: In a collection, every inserted document has a unique
A
_id
21
Q
meteor: To access the _id of the event currently being handled, type
A
this._id
22
Q
meteor: The update function on a collection takes
A
two arguments
23
Q
meteor: To update a field of a document, type
A
MyCollection.update({field1: “value”}, {
$set: {field: “value”}
});
24
Q
meteor: To delete a document, type
A
“click .css-class”: function () {
MyCollection.remove(this._id);
}
25
meteor: To build and run your app for ios, type
meteor add-platform ios
26
meteor: To run your app in ios simulator, type
meteor run ios
27
meteor: To run and run your app in ios simulator, type
meteor run android
28
meteor: To build and run your app for ios, type
meteor add-platform android
29
meteor: To run your app on an ios device, type
meteor run ios-device
30
meteor: To run your app on an ios device while connected to a previously deployed server, type
meteor run ios-device --mobile-server my_app.meteor.com
31
meteor: to store temporary reactive state on the client use a
Session
32
meteor: Some listenable events are
change, click, submit, keypress, input
33
meteor: To pass is a var that in a count of all of the documents in a collection, type
documentCount: function () {
return MyCollection.find({}).count();
}
34
meteor: To enable user accounts and login ui, type
meteor add accounts-ui accounts-password
35
meteor: To access the id of a logged in user in app.js, type
Meteor.userId()
36
meteor: To access the username of a logged in user, type
Meteor.user().username
37
meteor: To display something in the view only if a user is logged in, type
{{#if currentUser}}
...
{{/if}}
38
meteor: To revoke client side permission to edit mongo, type
meteor remove insecure
39
meteor: To create a method for securely editting mongo, type
```
Meteor.methods({
insertMethod: function (text) {
if (! Meteor.userId()) {
throw new Meteor.Error("not-authorized");
}
MyCollection.insert({
field: text,
createdAt: new Date(),
owner: Meteor.userId(),
username: Meteor.user().username
});
},
deleteMethod: function (Id) {
MyCollection.remove(Id);
},
setMethod: function (Id, set) {
MyCollection.update(Id, { $set: { field1: set} });
}
});
```
40
meteor: adding properties and methods to Template.body.helpers({}) seems to
pass the body that data across all templates.
41
meteor: To set the value of a variable that is currently available in just the client and not the server, type
Session.set('varName', 'value')
42
meteor: To return the value of a session variable, type
Session.get('varName')
43
meteor: To set a default value for a session variable, type
Session.setDefault('varName', 'value');
44
meteor: To add url routing, type into terminal
meteor add iron:router
45
meteor: the "items" in {{#each items}} is
the name of a function that returns an array
46
meteor: To render something from an {{#each items}} block if the function returns empty, type
{{#each items}}
{{else}}
{{/each}}
47
meteor: You can place functions that are callable from a template, and that return query data in
Template.templateName.helpers({})
48
meteor: CollectionName.find({}) returns a
cursor
49
meteor: Making the data available to the template using a cursor makes the ui
reactive
50
meteor: To create a mongo collection that is only on the browser you must
instantiate the mongo collection inside if (Meteor.isClient) {}
51
meteor: To search for atmosphere packages in the terminal type
meteor search package_name
52
meteor: To add a package, type
meteor add author:package_name
53
meteor: To see the installed packages, type
meteor list
54
meteor: To pass a {{var}} in a template as a param to a helper function, type
{{functionName item}}
55
meteor: A data context is
the data being passed into a part of the view
56
meteor: The data context can be accessed from javascript using
this.field_name
57
meteor: Packages that you install
do not need to be imported anywhere, they become available everywhere
58
websockets uses
DDP
59
DDP stands for
Distributed Data Protocol
60
meteor: To subscribe to a collection, type
Meteor.subscribe("subscriptionName")
note: Must match the name defined in publish function
61
meteor: To query the database after autopublish is removed, you must
Publish that data using a cursor in if (Meter.isServer) {} and subscribe to that data in if (Meter.isClient) {}
62
meteor: To create a cursor that publishes data from the server without autopublish, type
Meteor.publish("subscriptionName", function() {
return CollectionName.find({});
})
note: The subscriptionName can be anything, but the subscription function has to use the same name
63
meteor: To unsubscribe from a collection connection, type
subscriptionName.stop()
64
mongo: To list all your collections from the mongo shell, type
show collections
65
mongo: To return all the documents of a collection in a pretty way, type
db.collectionName.find().pretty()
66
mongo: To insert a new document into a collection from within the mongo shell, type
db.collectionName.insert({field1: "value", field2: "value"})
67
meteor: To clear a form, type
```
var form = template_instance.find("form")
form.reset();
```
68
meteor: The messages the server sends to the client are
added
removed
changed
69
meteor: To manually send an added message to the client, add
this.added("collectionName", "id", {"field1":"value"})
| to the publish function
70
meteor: To manually send a ready message to the client, add
this.ready()
| to the publish function
71
meteor: To give your subscribe function a callback function, type
Meteor.subscribe("subscriptionFunctionName", function(){
})
72
meteor: To send node the debug environment variable then debug on the server using chrome, type
NODE_OPTIONS="--debug" meteor
| node-inspector
73
meteor: To return an array of documents from the database, type
MyCollection.fetch()
74
meteor: RPC stands for
remote procedure calls
75
meteor: To call a meteor method from the client, type
Meteor.call("functionName", param1, function(err, result){
})
in isClient
note: The last param passed in must be a callback function
76
meteor: To create a meteor method on the server, type
```
Meteor.methods({
functionName: function() {
return ...
}
})
```
in isServer
77
meteor: A positional argument is an argument
sent into the function separated by commas
78
meteor: optimistic updating uses
a method stub
79
meteor: Meteor.methods can also be run
on the client
80
meteor: The local cache is just
an array of documents
81
meteor: To see everything in the local cache, type
into the chrome console
| MyCollection._collection
82
meteor: To render a button that comes for free in github's oauth package, type
{{> loginButtons}}
83
meteor: To return one document from a collection based on a field, type
MyCollection.findOne({field1: {
$in: ["value"]
})
84
meteor: To only publish to logged in users, type
if (this.userId)
return CollectionName.find()
else
return this.ready()
85
meteor: To control the permissions for users using mutator functions on the server, type
```
CollectionName.allow({
insert: function(userId, doc) {
return !!userId
},
update: function(userId, doc) {
return false
},
remove: function(userId, doc) {
return false
}
})
```
86
mongo: Every time mongo mutates a collection it also
logs the change in a collection called opLog
87
meteor: When you make a request to meteor it returns
script tags in the head tag and an empty body tag
88
meteor: To create the templates, meteor in the background
uses createElement and appendChild to add stuff to the body
89
meteor: Spiderable works by
creating a virtual machine that renders the page on the server before serving to google bot
90
meteor: To add spiderable, type
meteor add spiderable
| note: spiderable depends on phantomJS
91
meteor: The lookup chain is
the sequence of places meteor searches to find the property or method you are calling
92
meteor: To enter an object (returned from a helper) in a template and render a property of it, type
{{#with myObject}}
{{objectProperty}}
{{/with}}
or
{{myObject.objectProperty}}
93
meteor: To make a variable's value reactive it must
be getting called by Session because the function it is in is what makes it reactive
94
meteor: it is a best practise that your helpers always
call functions so the are evaluated at call time and not page load
95
meteor: To put the client side code in its own file,
create a folder called "client" and put a js file in it
96
meteor: Putting the client side code in its own file allows you to
omit if (Meteor.isClient) {}
97
meteor: To make reactive functions rerun, meteor uses
computations
98
meteor: computations are
objects that hold the function you keep rerunning as well as some state about the function
99
meteor: computations rerun the function inside them by calling the method called
invalidate
100
meteor: The things that should go in the "public" folder are
images, favicons, and robots.txt
101
meteor: Files in the "private" folder
are only accessible to methods from the server
102
meteor: To put the server side code in its own file,
create a folder called "server" and put a js file in it
103
meteor: Files stored in a “lib” folder
are loaded before other files and are available to both client and server. Create the collections here.
104
javascript: To create a for loop, type
for (i = 0; i - array.length; i++) {
array[i]
}
105
meteor: To create a ReactiveVar on the client, type
myReactiveVar = new ReactiveVar("value")
106
meteor: To create a computation, type
computationName = Tracker.autorun(function() {
...
})
107
meteor: To set a default layout for all the routes type
outside of client and server
Router.configure({
layoutTemplate: "templateName"
})
108
meteor: To render a certain template when your navigate to a certain route, type
outside of client and server
Router.route("/", function(){
this.render("templateName")
})
109
meteor: To accept a variable into a route, type
Router.route("/folder/:varName", function(){
| })
110
meteor: To return a variable that is passed into a route, type
```
Router.route("/folder/:varName", function(){
var varName = this.params.varName
})
```
111
meteor: To pass a session variable into a route, type
Router.route("/folder/:varName", function(){
Session.set("varName", "value")
this.render("templateName")
})
112
meteor: To pass in data based on the route, type
```
Router.route("/folder/:varName", function(){
this.render("templateName", {
data: function() {
return {key: "value"}
}
})
```
113
meteor: To insert content from a child template into a parent template, type
{{> yield "contentForName"}} in the parent
| {{#contentFor "contentForName"}}string{{/contentFor}}
114
meteor: Files from within the client, lib, or server folders are
loaded in alphabetical order
115
meteor: Files from within the client, lib, or server folders are
loaded in alphabetical order
116
meteor: Files that should go in the client folder are
html, css, and client side js
117
meteor: The js file in the lib folder should hold
the collection variables
118
javascript: To coerce a value into true or false, type
!!value
119
javascript to create an event handler for attributes, type
'click [attribute=value]': func...
120
meteor: To add jquery, type
meteor add jquery
121
meteor: To return whether or not a Session variable is equal to a certain value, type
Session.equals("varName", "value");
122
meteor: To add bootstrap, type
meteor add twbs:bootstrap
123
meteor: To update the database after a key is typed into a text box, use the event called
input
124
meteor: When using CollectionName.update use
the id of an object as the first argument
125
meteor: To turn the elements that you created an event from into a jquery object, type
$(event.target)
126
meteor: To add the google oauth package, type
meteor add accounts-google
127
google: To get a key and secret from googles dev console
search for API Manager in search bar and click Credentials on the left.
128
meteor: To do an if statement on a users profile data before publishing data, type
```
if (this.userId) {
var user = Meteor.users.findOne(this.userId)
if (user == ...) {
return CollectionName.find()
}
} else {
return this.ready()
}
```
129
javascript: To handle a click event if it happens anywhere on the page excluding one place
create an if statement that checks the event.target and if it is the element you want to exclude return false
130
meteor: To add great fonts from a cdn, add the package
meteor add natestrauser:font-awesome
131
meteor: To use oauth, you must have added
the package accounts-ui, not accounts-pasword
132
meteor: To return the name of the currently logged in user in the template, type
{{currentUser.profile.name}}
133
meteor: Using {{currentUser}} in a template returns
Meteor.user()
134
meteor: To create a cursor that points to the users collection, type
Meteor.users.find()
135
meteor: To create a cursor that sorts the collection objects, type
CollectionName.find({}, { sort: {field1: -1} })
136
meteor: To publish only certain fields from a collection, type
CollectionName.find({}, { fields: {fieldName: 1, fieldName: 0} })
137
meteor: To run a function that alters the users profile immediately after the create it, type
Accounts.onCreateUser(function(options, user) {
})
138
meteor: When you create an event handler, always make sure
the event is occurring within the template you are putting the event handler in
139
meteor: For the app to remember what the data context should be, instead of using a route, you can
set all the links to set a Session var which stores the name of the relevant data context.
140
meteor: When creating a chat, before submitting the message you should
check if the message is empty by typing
if (messageVar.trim() == "") {
return
}
141
meteor: To handle an event on the whole page, type
"click": function(event, templateInstance) {
| }
142
meteor: To return all documents where field1 matches exactly, type
CollectionName.find({field1: { $eq: "value" } })
143
javascript: to write an inline if statement, type
2 > 1 ? "returnIfTrue" : "returnIfFalse"
144
meteor: To create a dependency, type
var depName = Tracker.Dependency
145
meteor: A dependency is
an object that holds a list of your computations, and has a .changed() function that invalidates all your computations
146
meteor: To make a computation that depends on a dependency called dep, type
Tracker.autorun(function() {
dep.depend()
...
})
147
meteor: The attribute that makes a data source a reactive data source is that
it calls dep.changed() so that all of the dependent computations rerun.
148
meteor: Session.get("value") is an example of a
reactive data source
149
meteor: To create a computation that depends on a Session.get(), type
Tracker.autorun(function() {
Session.get("value")
...
})
150
meteor: To run a function directly after a CollectionName.insert type
CollectionName.insert({field1: 'value'}, function(){
...
});
151
meteor: To call a function every time you receive an added DDP message, type
```
CollectionName.find({}).observe({
added: function(id, doc){
console.log("string")
}
})
```
152
meteor: To create a computations that depends on changes to a collection, type
```
Tracker.autorun(function() {
CollectionName.find().fetch()
...
})
note: You must do something/anything to the cursor for it to call .changed()
```
153
javascript: To evaluate an object key name
surround it with [key]
154
meteor: To create a new objectId based on an _id string, type
var objectIdInstance = new Meteor.Collection.ObjectID("string");
CollectionName.findOne(objectIdInstance);
155
meteor: To update a document attribute without removing any other data, you must use
{ $set: {attributeName: "value"} }
156
meteor: CollectionName.insert({}) automatically returns
the _id string
157
meteor: Mongo and Meteor insert new document ids
differently. Meteor uses strings, Mongo uses ObjectIDs
158
iTerm2 does not
paste a string with a trailing space
159
html: Numbers in html attributes must
go in quotes
160
learn to understand, why use sessionvar instead of var, which order a sort 1 and -1 goes,
d
161
meteor: To run app on iphone, type
meteor run ios-device
162
meteor: If you are not seeing the changes made in your code reflected in your iphone app
you should delete the app from the iphone and try to run it again
163
meteor: To allow mobile device to rotate with your app, type
window.shouldRotateToOrientation = function(degrees) {
return true;
}
into client code
164
meteor: To make a mobile phone vibrate when a collection recieve an added message, type
meteor add cordova:org.apache.cordova.vibration@0.3.10
```
if (Meteor.isCordova) {
CollectionName.find({}).observe({
added: function (doc) {
navigator.notification.vibrate(90000)
}
})
}
```
165
meteor: To create a route with flowrouter, type
```
FlowRouter.route('/:param1/param2', {
action: function() {
BlazeLayout.render("mainLayout", {content: "templateName"});
}
});
```
166
meteor: To render the template name that is passed in as the "content" variable by flowrouter, type
-template name="mainLayout">
{{>Template.dynamic template=content}}
-/template>
167
meteor: To create the route, data context, template and template level subscription in flow router, type
meteor add kadira:blaze-layout
meteor add kadira:flow-router
```
FlowRouter.route('/:param1/param2', {
action: function() {
BlazeLayout.render("mainLayout", {content: "templateName"});
}
});
```
```
Template.templateName.onCreated(function() {
var self = this;
self.autorun(function() {
var param1 = FlowRouter.getParam('param1');
self.subscribe('subscriptionFunctionName', param1);
});
});
```
```
Template.templateName.helpers({
record: function() {
return CollectionName.findOne({_id: FlowRouter.getParam('param1') })
}
});
```
```
{{#if Template.subscriptionsReady}}
{{#with record}}
{{content}}
{{/with}}
{{else}}
Loading
{{/if}}
```
168
meteor: To add a use images in mobile apps
create a "public" folder and place the images there
| write the paths to the images as if you are in the public directory
169
meteor: To set the icon and splash page you must
set them in mobile-config.js
http://stackoverflow.com/questions/26957503/meteor-way-to-specify-icon-and-launch-screen-of-an-app
170
meteor: For multi touch events, use
chriswessels:hammer
171
meteor: To deploy meteor to heroku, type
git commit -am "string"
heroku create --buildpack https://github.com/jordansissel/heroku-buildpack-meteor.git
heroku addons:create mongolab
open mongolab page and add a user/password in the user tab, then insert it into the provided mongo URI above
heroku config:add MONGO_URL=MONGOLAB_URI_from_heroku_page
heroku config:add ROOT_URL=https://your-app-name.herokuapp.com
heroku labs:enable http-session-affinity
git push heroku master
172
meteor: The folder structure of my meteor app should be
client | layout.html, project.css, name.js, views | view1.html, view2.html
server | name.js
lib | router.js, models.js (collection creation and schema)(any common code for client/server)
public | images, favicons, robots.txt
173
meteor: For prototyping it is fine to use {{> loginButtons}} but later you should
build your own UI and call functions like Accounts.loginWithPassword, Accounts.loginWithFacebook, Accounts.createUser and Accounts.forgotPassword directly
174
meteor: Flowrouters routes must go
in the lib folder
175
meteor: To use regular npm packages in metoer
meteor add meteorhacks:npm
meteor (this create packages.json)
add "packageName": "1.0.0" to packages.json in root
use Meteor.npmRequire("packageName") when requiring in server methods
176
metoer: if you see ERROR whitelist rejection: error
add App.accessRule('*'); to mobile-config.js since it by default blocks remote hosts
