Meteor Boilerplate

A Meteor ready-to-use app for Blaze + FlowRouter with a bunch of useful functions, writen in ES6

GitHub repository : https://github.com/Fen747/meteor-boilerplate

by David Panart aka. Fen747

version 1.1.3

Feel free to fork this repository.
Don't forget to star it too if you find it cool!

Public projects using this boilerplate :

• https://talkalang.com

Installation

• Clone this repo : git clone https://github.com/Fen747/meteor-boilerplate
• Change Directory : cd meteor-boilerplate
• Install NPM dependencies : meteor npm install
• Enjoy !

• See HISTORY.MD for more informations
• Meteor forums topic

Doc

Packages ( /.meteor/packages )

• A bunch of very useful packages are either pre-installed or just need to be uncommented to be installed in your app

Changes to globals ( /both/_globals.js )

Lodash

• This app already has erasaur:lodash package installed and aliased to '_' instead of underscore
• Lodash is known to have the same API as UndescoreJs, but with better performances, and more features

Meteor.user()

• I optimized the Meteor.user() function
• It can now be used with a string as parameter to alias a findOne on a specific user
• In addition, you can pass an array of string to automatically filter the fields you need in order to reduce the number of useless re-renders / autorun invalidation
• Indeeds, the default Meteor.user() function return the whole user document, which means that any reactive computation would be invalidated if any field of the doc change, which can be very bad for debugging and performances, specially on mobiles
• Use it like this :
  • Meteor.user() // return the whole current user doc
  • Meteor.user( "aUserIdString" ) // return the whole specified user doc
  • Meteor.user( [ 'field1', 'field2', ... ] ) // return the filtered current user doc
  • Meteor.user( "aUserIdString", [ 'field1', 'field2', ... ] ) // return the filtered specified user doc

API ( /imports/api )

Routes ( /imports/api/routes )

• config.js - Set your routes hierachy and triggers here. Use updateView instead of BlazeLayout.Render to handle your transition animations
• triggers.js - Define the triggers here
• routes.js - Define your routes here

Collections ( /imports/api/collections )

• Store your global collections at /imports/api/collections
• Store your client only minimongo instances in ./client
• Store your private collections in ./server

Methods ( /imports/api/methods )

• Store your optimistic methods at /imports/api/collections
• Store your server only methods at ./server

Library ( /imports/library )

App context ( /imports/library/appContext )

• Using Session or any globally defined variable is not a good thing. You should rather use the appContext as a reactiveDict instead of Session

App utilities ( /imports/library/appUtilities.js )

• getEmailfromUid( userId ) - use this to get the first mail from a user
• secure( collection ) - use this to automatically deny all writing permissions for the user in production
• endLoadingScreen - great to remove loading screen you could have injected via Arunoda's initial inject package
• playAnimation( animationName, elementId, animationTime = 1000 ) - play an animation on an element by adding it a class and removing it automatically after 'animationTime' ms

Blaze helpers ( /imports/library/blazeHelpers.js )

• userConnected - use this handlebar helper to check if a userId exists
• lineBreakText - Automatically tranform \n of a string as br elements in the dom. Use with triple braces
• urlify( str ) - make a string valid as a url. Great for passing post titles in the url for example
• mobileViewSize - check if the window width is lesser than 601 (based on materializecss standard media queries)
• getUserName( uid ) - get a user's name based on his uid
• equals( a, b ) - return true is both arguments are equals
• nequals( a, b ) - return true is both arguments are not equals
• logContext( context = this ) - log the passed context or this
• getEmailfromUid( userId ) - use this to get the first mail from a user
• isCordova - return true if is on a cordova device

Context utilities ( /imports/library/contextUtilities.js )

• A bunch of functions returning a meteor flag and taking an optionnal callback to execute if the flag is set to true
• isClient, isServer, isCordova, isDevelopment, isProduction

DOM Manipulation

• createDOMElement({ tag, classList, id, dataset, innerHTML }) - Use this passing as parameter an object containing the attributes you want to assign to the created element (please, read the function signature for details)

Functional Programming ( /imports/library/funcProg.js )

• A bunch of ES6 functions and aliases for functional programming
• Really useful in order to keep a DRY, easy to read and easy to debug code

Utilities ( /imports/library/utilities.js )

• mobileViewSize - check if the window width is lesser than 601 (based on materializecss standard media queries)
• urlify( str ) - make a string valid as a url. Great for passing post titles in the url for example
• tryReach( object, 'nestedAttribute1', 'nestedAttribute2', ... ) - a very useful function to naviguate in nested objects without throwing errors if an attribute is called on a non-object value
• buildRegExp( str ) - a simple regexp builder
• benchmark( callback ) - a basic functions to check performances of a callback
• unblock( ddp connection ) - an alias to ddp's this.unblock that do not throw an error when the method doesn't exists
• isValidImageUrl( url ) - check if a url points to an image

Modules ( /imports/modules )

Reactive Window

• window.size - a Reactive dict to make resizing the window reactive
• Imported to client by default

DDP Logging

• Use the DDPLogging global object to toggle on and off the listening of DDP messages on the client
• Imported to client by default

Smart disconnect ( /imports/modules/smartDisconnect.js )

• Maintaining sessions alive in meteor is quite costly. Use SmartDisconnect.start() to set Meteor.status().status to `offline` when a user is inactive for a certain time (default to 300s)
• SmartDisconnect.start() takes two optional parameters :
• First, an object like this : { timeBeforeDisconnect = 300, activateOnCordova = true }
• Second, a callback called just before a deconnection occurs
• Credits to mixmaxhq

Startup ( /imports/startup )

Client ( /imports/startup/client.js )

• Add a removeElement (by id) method to the document variable
• Add a log function to the global scope. Useful to log and return a variable without adding new lines to your files when debugging
• The startup callback has a lot of handful features to handle injected loading screens on cordova, defering the router init after roles are loaded, and following the connection state in the appContext

User Interface ( /imports/ui )

Components ( /imports/ui/components )

• Add your re-used components here

Layouts ( /imports/ui/layouts )

• Add your layouts templates here

Modals ( /imports/ui/modals )

• Add your modals templates here

Pages ( /imports/ui/pages )

• Add your pages templates here

Stylesheets ( /imports/ui/stylesheets )

• Add your CSS / SCSS / SASS / LESS files here