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.
I am in the process of morphing from a software developer into a portrayer of Mark Twain. My monologue (or one-man play, entitled "The Adventures of Mark Twain: As Told By Himself" and set in 1896) features Twain giving an overview of his life up till then. The performance includes the relating of interesting experiences and humorous anecdotes from Twain's boyhood and youth, his time as a riverboat pilot, his wild and woolly adventures in the Territory of Nevada and California, and experiences as a writer and world traveler, including recollections of meetings with many of the famous and powerful of the 19th century - royalty, business magnates, fellow authors, as well as intimate glimpses into his home life (his parents, siblings, wife, and children).
Peripatetic and picaresque, I have lived in eight states; specifically, besides my native California (where I was born and where I now again reside) in chronological order: New York, Montana, Alaska, Oklahoma, Wisconsin, Idaho, and Missouri.
I am also a writer of both fiction (for which I use a nom de plume, "Blackbird Crow Raven", as a nod to my Native American heritage - I am "½ Cowboy, ½ Indian") and nonfiction, including a two-volume social and cultural history of the U.S. which covers important events from 1620-2006: http://www.lulu.com/spotlight/blackbirdcraven
Submit an article or tip
