Hitching a Ride on the huMONGOus Meteor, Part 2 of 9

B. Clay Shannon

0.00/5 (No votes)

6 Aug 2015CPOL2 min read

8.5K

Part 2 of the 9-part series As the Meteor Blazes - making changes to the default HTML

You Gotta Have a Uniform to Fight Crime

Now, let's add some custom HTML to our Meteor app.

To do so, follow these steps:

First (if your Meteor app is not running yet), open a Command Prompt, and navigate to the folder where you created your Meteor app.

One you have navigated to your project's directory, enter "meteor run" and mash the <Enter> key.

Once your app is running, "point your browser" to http://localhost:3000

Now open Windows Explorer, and navigate to the folder where you created your app. It could be something like:

C:\Users\clayshan\Meteor\<yourProjectName>

In the folder that bears your project's name, you will find an .html file named <yourProjectName>.html

Open that html file in your preferred editor (Notepad or Notepad++ will work fine, but feel free to use fancier tools) and replace the existing html with something quick and easy like:

<head>
	<title>timeandspace</title>
</head>
<body>
	<h1>A List of the Places I Have Lived</h1>
</body>

IOW, just replace the body text and remove everything else but the head section, which automatically contains your project name. When you are ready to save your changes to the HTML file, you may have to do a "Save As" to get the changes to stick and, if you look at the command prompt, you might now see, "Client modified -- refreshing"

Now you should see the out-of-the-box html of your Meteor app change its appearance to correspond with the html you replaced it with.

What Am I Doing Up Here? I'm Scared of Heights!

Nice! You can now call yourself a Meteorite (that is to say, a denizen of virtual Meteorville).

However, you may want to spiffy up the appearance of that HTML with some CSS. To do so, open up the .CSS file, add some classes or such, and then do a "Save As" similar to what you did with the HTML file.

That's all for this exciting episode of "As the Meteor Blazes." Next, we will dip our toes into the MongoDB aspect of the Meteor framework. The first thing to do will be to create a "table" (called a Collection in Mongo-speak, but we'll cross that bridge when we ... you know). So next time we'll start in with the MongoDB (huMONGOus DataBase) side of the house.