Skip to content

Latest commit

 

History

History
165 lines (148 loc) · 10.5 KB

ch01-setup.md

File metadata and controls

165 lines (148 loc) · 10.5 KB
Raw

< Previous Chapter | Next Chapter >

Chapter 1: Initial Setup

01.01. Create a Meteor app

  1. Create a Meteor project through your terminal. cd into the correct parent folder and create a new Meteor app $ meteor create meteoric-projects.
  2. Open the project in your preferred editor and delete the 3 generic files.
  • project-name.html
  • project-name.js
  • project-name.css
  1. Optional, if you use WebStorm IDE, like me, then create a .gitignore file in the root and add .idea.

01.02. Setup Git

Prerequisite: Setup Git and push to GitHub, if you need help check GitHub Bootcamp

  1. We will be using GitHub Issues and Waffle.io to track our progress
  2. On GitHub under Issues select the Milestone nav pill and add a Milestone for each development order item 2 through 9 from the readme. Here is an example of what mine looks like. Image showing example of github milestones
  3. Now we will use Issues in the rest of this tutorial for outlining our steps before we do them.
  4. Optional, go ahead and get acquainted Waffle.io, learn about all the nice Kanban features they offer for free.

Example image: Waffle.io example

01.03. Folder Structure

Create this standard folder structure, adapted from Differential Boilerplate

.meteor/
client/
  ├── compatibility/
  └── stylesheets/
    ├── _app-mixins.scss
    ├── _app-variables.scss
    └── app.scss
  └── views/
    └── activities/
      ├── activities.html
      ├── activities.scss
      └── activities.js
    └── contacts/
      ├── contacts.html
      ├── contacts.scss
      └── contacts.js
    └── notes/
      ├── notes.html
      ├── notes.scss
      └── notes.js
    └── projects/
      ├── projects.html
      ├── projects.scss
      └── projects.js
    └── users/
      ├── users.html
      ├── users.scss
      └── users.js
    └── layouts/
      ├── mainLayout.html
      └── mainLayout.js
    └── shared/
    └── index.html
collections/
  └── activities/
    ├── activitiesCollection.js
    ├── activitiesController.js
    └── activitiesSchema.js
  └── contacts/
    ├── contactsCollection.js
    ├── contactsController.js
    └── contactsSchema.js
  └── notes/
    ├── notesCollection.js
    ├── notesController.js
    └── notesSchema.js
  └── projects/
    ├── projectsCollection.js
    ├── projectsController.js
    └── projectsSchema.js
  └── users/
    ├── usersCollection.js
    ├── usersController.js
    └── usersSchema.js
routes/
  └── router.js
packages/
public/
  ├── fonts/
  └── images/
server/
  ├── accounts.js
  ├── email.js
  ├── permissions.js
  ├── seeds.js
  └── publications/
      ├── activities.js
      ├── contacts.js
      ├── notes.js
      ├── projects.js
      └── users.js

01.04. Install Standard Atmosphere Packages

Add all the following packages in one swoop by running this in your terminal from the project folder:

$ meteor add accounts-password underscore mrt:underscore-string-latest stevezhu:lodash fastclick jquery reactive-var reactive-dict iron:router zimme:iron-router-active fuatsengul:iron-router-auth dburles:collection-helpers matb33:collection-hooks reywood:publish-composite alanning:roles ongoworks:security momentjs:moment aldeed:autoform aldeed:collection2 aldeed:simple-schema tmeasday:publish-counts u2622:persistent-session zimme:collection-softremovable zimme:collection-timestampable meteorhacks:kadira meteorhacks:aggregate meteorhacks:zones matteodem:easy-search dburles:factory anti:fake fourseven:scss meteoric:ionic-sass meteoric:ionicons-sass meteoric:ionic meteoric:autoform-ionic
Package Name Github Atmosphere Website
accounts-password github atmosphere website
underscore github atmosphere website
mrt:underscore-string-latest github atmosphere website
stevezhu:lodash github atmosphere website
fastclick github atmosphere
jquery github atmosphere website
reactive-var atmosphere website
reactive-dict atmosphere
iron:router github atmosphere guide / site
zimme:iron-router-active github atmosphere
zimme:iron-router-auth github atmosphere
dburles:collection-helpers github atmosphere
matb33:collection-hooks github atmosphere
reywood:publish-composite github atmosphere website
alanning:roles github atmosphere website
ongoworks:security github atmosphere
momentjs:moment github atmosphere website
aldeed:autoform github atmosphere
aldeed:collection2 github atmosphere
aldeed:simple-schema github atmosphere
tmeasday:publish-counts github atmosphere
u2622:persistent-session github atmosphere
zimme:collection-softremovable github atmosphere
zimme:collection-timestampable github atmosphere
meteorhacks:kadira github atmosphere website
meteorhacks:aggregate github atmosphere
meteorhacks:zones github atmosphere
matteodem:easy-search github atmosphere website
dburles:factory github atmosphere
anti:fake github atmosphere
fourseven:scss github atmosphere website
meteoric:ionic-sass github atmosphere website
meteoric:ionicons-sass github atmosphere website
meteoric:ionic github atmosphere website
meteoric:autoform-ionic github atmosphere

01.05 Add standard <head> elements in index.html

  <head>
    <title>Meteoric Projects</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-title" content="Meteoric Projects">
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
  </head>
  <body>
  </body>

< Previous Chapter | Next Chapter >