Sign In Start Free Trial
Account

Add to playlist

Create a Playlist

Modal Close icon
You need to login to use this feature.
  • Book Overview & Buying Getting Started with Meteor.js JavaScript Framework - Second Edition
  • Table Of Contents Toc
  • Feedback & Rating feedback
Getting Started with Meteor.js JavaScript Framework - Second Edition

Getting Started with Meteor.js JavaScript Framework - Second Edition

By : Isaac Strack
4.2 (5)
close
close
Getting Started with Meteor.js JavaScript Framework - Second Edition

Getting Started with Meteor.js JavaScript Framework - Second Edition

4.2 (5)
By: Isaac Strack

Overview of this book

This book is for developers or students who have a working knowledge of JavaScript and HTML, and want to learn how to quickly develop full-stack web applications using pure JavaScript.
Table of Contents (14 chapters)
close
close

Loading an example application


The wonderful people at Meteor have included several example applications, which you can quickly create and play with; these help you to get a better idea of what Meteor is capable of.

We want to use the simplest possible example, just to get an idea of how Meteor works, so we will be creating the leaderboard example. We'll be using the command line again. This is awesome news if you still have it open! If not, open a terminal window and follow these steps.

Selecting your file's location

So that we can remember where they are later, we'll put all the files for this book in the ~/Documents/Meteor folder. We will create this folder as follows:

$ mkdir ~/Documents/Meteor

Now, we need to get to that directory. Use the following command:

$ cd ~/Documents/Meteor

Loading the example application

We can now use the Meteor create command with the --example parameter to create a local copy of the leaderboard example application:

$ meteor create –-example leaderboard

As with the Meteor installation itself, the create command script has a friendly success message:

leaderboard: created.
To run your new app:
   cd leaderboard
   meteor

There are even instructions on what to do next. How handy! Let's go ahead and do what our good command-line friend is telling us.

Starting the example application

To start up a Meteor application, we need to be in the application directory itself. This is because Meteor looks for the startup files, HTML, and JavaScript that are needed to run the application. These are all found in the application folder, so let's go there:

$ cd leaderboard

This puts us in the ~/Documents/Meteor/leaderboard folder, and we're ready to run the application:

$ meteor

Yes, that's it. Meteor takes care of everything for us; it reads all the files and scripts, and sets up the HTTP listener:

[[[[[ ~/Documents/Meteor/leaderboard ]]]]]

Running on: http://localhost:3000/

We can now take the URL we've been given (http://localhost:3000/) and check out the example application in a web browser.

Previewing the application

Open your favorite web browser (we'll be using Chrome, but any modern, updated browser will work) and navigate to http://localhost:3000/.

You should see a screen with a list containing the names of scientists, similar to the following screenshot:

You can go ahead and poke around the application a bit, if you want to. Click on Nikola Tesla's name and add 5 points to his score about 20 bajillion times, because he deserves it. Give some love to Marie Curie because she was so radioactive that she actually made up the word. Go nuts, friend!

Help! I made too many changes!

Do you fear change and want to reset the scores? No problem, we can start with a clean database instance; to do this, perform the following steps:

  1. Open the command line, and press Ctrl + C.

  2. This stops the running application. Now, enter the following command:

    $ meteor reset
    
  3. Restart your app, and you're good to go. Just type the following command:

    $ meteor
    

Note that the initial scores are random, so it won't look exactly like it did before. The meteor reset command resets all the data collections and whatnot; so in a non-random app, the command will indeed reset the app cleanly.

notes
bookmark Notes and Bookmarks search Search in title playlist Add to playlist font-size Font size

Change the font size

margin-width Margin width

Change margin width

day-mode Day/Sepia/Night Modes

Change background colour

Close icon Search
Country selected

Close icon Your notes and bookmarks

Confirmation

Modal Close icon
claim successful

Buy this book with your credits?

Modal Close icon
Are you sure you want to buy this book with one of your credits?
Close
YES, BUY

Submit Your Feedback

Modal Close icon

Create a Note

Modal Close icon
You need to login to use this feature.

Delete Bookmark

Modal Close icon
Are you sure you want to delete it?
Cancel
Yes, Delete

Delete Note

Modal Close icon
Are you sure you want to delete it?
Cancel
Yes, Delete

Edit Note

Modal Close icon
Write a note (max 255 characters)
Cancel
Update Note