Meteor JS (Part 3.5): Directory Structure

This is a post in a multiple part series on getting started with Meteor JS. If you don’t have Meteor JS installed you will want to start at  the first post in the series. Part 2 is where we start building the application.

This is going to be a short post. That is the reason for calling this part 3.5. I wanted to write a post discussing the directory structure of the price book application.

Old Directory Structure

Old Directory Structure

New Directory Structure

New Directory Structure

Meteor JS allows for a very flexible project layout.

All I have done here is move each template element into its own html file and moved template specific JavaScript into its own js file. I moved the Items collection into the both folder. The both folder is a personal preference. It reminds me that the code in that folder is available to the client and server environments. Now all the pricebook.html file contains is just the head and the body elements.

You can put your files anywhere in the directory tree, but there are a couple of special folders that I would like to call out.


Items that we put in the client directory, or in a sub directory of the client directory, are sent down to the client, and can only be accessed from JavaScript on the client.


Items that we put in the server directory, or in a sub directory of the server directory, are only available on the server. This code will never be seen by the client. This is a good place to put code that might contain sensitive information like a password or client secret.

Any Other Folder

Contents put in any other folder will be available to the client and the server.


I have linked to the Meteor JS documentation that goes into this subject with a lot more detail.

I have checked in this change to the Github repository. I would recommend cloning the repository but if you would like to make the changes by hand it shouldn’t be too difficult.

Leave a Reply

Your email address will not be published. Required fields are marked *