Space Shield (Routing Meteor)
Once you know how, routing in Meteor is pretty darned easy. Let's go through the entire process of creating a simple app and deploying it, adding routing to the various templates we will add in the meantime.
Note: Meteor apps are web apps, and thus cross-platform, and they can also be developed in various environments, such as on a Mac or Linux; although the differences are surely not insurmountable/ungrokkable, this tip explains the Windows-centric way to create, edit, and deploy Meteor apps.
First, of course, you need to download and install Meteor, if you haven't done that.
At the command prompt, enter "meteor create <projectname>", such as: "meteor create dplatypus"
Once the app has been created, follow the prompt to "cd" into the folder created with the project (which will be the project name you entered).
Now, enter at the command prompt, "meteor add iron:router"; doing so will add the routing package we will use.
So that your "raw" or base URL doesn't throw a routing exception, add this to the top of your .js file (above/outside the "isClient" and "isService" blocks):
Router.route('/');
Add a template or two (or more) to your project's .html file (you can use Notepad or Notepad++ for this, but I recommend the free (and "hackable") Atom editor, from Github, with the Meteor helper packages added. The project will be in a subfolder of whatever folder you were in when you entered the "meteor create" command. To download the Atom Editor, click this.
BTW, the video of the futuristic/pastistic coding family on the Atom Editor site is a gas, man!
Getting back to adding templates; as an example, here are a couple of templates I added:
<template name="garrapatabeach"><p>Here's a picture of Garrapata Beach; early morning;
long exposure.</p>
<p class="location">Garrapata Beach.Garrapata State Park.Big Sur.Monterey County.California</p>
<img height="600" src="/images/garrapataBeach.jpg" width="900" />
</template>
<template name="garrapataturnout"><p>Here's a picture from the first Garrapata turnout;
long exposure</p>
<p class="location">First Turnout.Garrapata State Park.Big Sur.Monterey County.California</p>
<img height="600" src="/images/GarrapataTurnout1.jpg" width="900" />
</template>
Now, add routes for those templates in the same part of the project's .js file where you added the "home" ("/") route in the .js file, so that it looks like this (the routes match the template names):
Router.route('/');
Router.route('/garrapatabeach');
Router.route('/garrapataturnout');
Note: This supposes you have added a "public" folder to your project, and an "images" folder beneath that, and that you have images with the names indicated in that images folder. If you want to "play along," you can download those images from dplatypus.meteor.com/garrapatabeach and dplatypus.meteor.com/garrapataturnout; otherwise, simply change the names of the jpgs and use your own images.
You will now be able to view your templates by navigating to the links given above (to run it, simply enter "meteor" at the command prompt while in the project's folder, and navigate to localhost:3000). However, to make it "more better" (so that the main page is not naked as a jaybird), we'll put some anchor tags/links in the main template, like so:
<body>
{{> main}}
</body>
<template name="main">
<a href="garrapatabeach" target="_blank">Garrapata Beach</a>
<a href="garrapataturnout" target="_blank">Garrapata Turnout</a>
</template>
Now the links will display when you navigate to localhost:3000, and clicking on them will route you to the appropriate page/template. To continue, just add another template, along with its corresponding routing entry and anchor tag/link.
Plunging Into Cyperspace
Once your app is ready for "prime time," you can deploy it; Meteor offers free hosting. Back at the command prompt, enter "meteor deploy <projectname>" such as "meteor deploy dplatypus" -- don't actually use "dplatypus" though, because it's already taken. If you used "dplatypus" for your project name, that's okay - just use a different name for the deployment target name - "duckbill" or "weirdmammal" or whatever. If you choose a name that has already been used by someone else, you will be prompted for a username and password. In that case, bow out and choose another name until you come up with an unused one.
After the app has been deployed, and you have tested it, you can let your friends, enemies, family, prospective employeres or clients, etc. know about your site/app. For example, the app partially shown in this tip is available at dplatypus.meteor.com, that is to say, here. Feel free to download the images as desktop wallpaper; I am the photographer/copyright holder, and grant that usage.
