This Week with Meteor: Project Structure

8This week with Meteor we restructured the application.  After developing on this project for the last month or so, we have decided on some best practices for our team.  Drawing on other experiences that we have had with .Net, Backbone.js and Angular, we decided to go with a feature based approach.

At the top most level, we have 4 main folders so far:

meteor-1.png 


1.
       Client folder

meteor-2.png

The client folder contains JavaScript to be ran on the client.  In here we have global Meteor helpers in the helpers.js, the router paths in the router.js, any Meteor subscriptions separated into features (the same as in the features folder, see below), and the sites common template for all the pages.  We also have our head.html which contains the <head> section for all our pages and the notFound.html which is our generic 404 not found page.


2.
       Features folder

meteor-3.png
The feature folder keeps each feature into its own folder for easier locating and troubleshooting. A feature can be a single page or a group of pages depending on the scope of the feature.  Each feature has its own client folder with the code to be ran on the client and a server folder with the code to be ran on the server.  There is also a shared folder of JavaScript that should be ran on both the client and server.  In the image here, we put the collection.js in this folder which defines all the collections we have in our project.

3.       Public folder

meteor-4.png

The public folder contains all assets you want to be displayed on the web page.  We have placed the favicon.ico here as well as the downloadable fonts and any images we want to be shown on our web page.  We also have created a data folder that contains any offline data for web service calls we make for developing offline.

 

4.       Server folder

meteor-5.png
Finally we have the server folder that contains the Meteor publication information and any global server side settings, such as SMTP server settings.
That’s our project structure, obviously it’s subject to change as we learn more about Meteor.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s