Fixtures:

mantra g <folder inside module> <module name>: filename
Example: mantra g container core:PostAdd.
Example: mantra g container Favorites:FavoritesAdd.
NOTE: When you create a file inside container this will create the same file inside components automatically.
NOTE: You have to create the files inside actions manually by typing: mantra g actions Favorites:FavoritesAdd.

Back to Top

Naming Convention

Names such as route names, modules and filenames should be plural
Filename Example: PostsAdd, PostsView, FavoritesList, InterestsAdd, MessagesView and so on.
Route Example:
- /posts/list,
- /posts/view/id,
- /favorites/list,
- /interests/delete/data,
- /interests/add,
- /messages/view/data
and soon...
In creating a module it should be all lower case. Example:* "products". (folder would be products).
In creating an action it should be all lower case. Example: "products". (file would be products.js).
In creating a container and component it should be Pascal case. Example: "ProductsList" files would be (containers/products_list.js) and (components/products_list.jsx).

Back to Top

Data Subscription Non-Global

In creating a non-global subscription you need to add it inside the context.js under /client/configs/.
See the sample code through the link: http://master.snapzio.com/snapzio/mantraboilerplate/blob/prod/client/configs/context.js
See the function name authCommon and the variable userSubReady.
Using the non-global subscription:
- You can directly use the subscription inside the module container by calling the exported function from the context.js. Example: const {authCommon} = context();
- See the sample code through the link: http://master.snapzio.com/snapzio/mantraboilerplate/blob/prod/client/modules/users/containers/auth_checker.js
- You can now use it in the component by calling the props from the container: const {MainLayout, content, userId} = this.props;.
Note: this is still subject for improvement or changes.

Back to Top

Filaname Prefix and Suffix

The filename prefix should be the module name and the suffix should be event name.
Example: If the module name is Favorites and the event is to add favorite users, the filename should be FavoritesAdd.
Example: If the module name is Interests and the event is to view users you added in your interest list, then the filename should be InterestsView.

Back to Top

Event Names to be used

Add
View
Update
List
Delete

Back to Top

Adding a custom CSS file

it should be added inside the assets folder inside the client. Example: /client/assets/stylesheets/style.css.

Back to Top

Naming convention for Function names, Subscription names, and Publication names

they should all be in Pascal Case

Back to Top

Adding a 3rd party scripts/codes such as Boostrap, JS, Fonts and CSS

these files should be in Public
it should be added in the head tag
Please refer to the topic below Adding content inside the tag using NPM React-Helmet

Back to Top

Adding Routes

Each module should have its own routes.jsx.

Adding a schema

In adding a schema it should be added under /lib/collections/<collection file>.js.
Click the link for the sample format: http://master.snapzio.com/snapzio/mantraboilerplate/blob/prod/lib/collections/products.js

Back to Top

Adding User Authentication

Back to Top

Using StoryBook

Back to Top

Adding content inside the `<head></head>` tag using `NPM React-Helmet`

The Kadirah DocHead needs to be added inside the app loader /client/main.js.
Just import the package inside the file import {DocHead} from 'meteor/kadira:dochead';.
Then use it, here are the syntax:

//Site Title
var title = 'Sample DocHead';
DocHead.setTitle(title);

// Loading Javascript
var gaScript = 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js';
DocHead.loadScript(gaScript);

// Loadintg CSS
var cssLink = {rel: "stylesheet", href: 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css'};
DocHead.addLink(cssLink);

// Loading Meta tag
var metaInfo = {name: "description", content: "FlowRouter SSR is Awesome"};
DocHead.addMeta(metaInfo);

Back to Top

ESLint Rules

There should be a space after if condition and before parentheses. Example: if< space >(condition){arguments}.
If Else should be avoided

Wrong way

if(err) {
return throw new Meteor.Error(e);
} else {
return 'Success';
}

Right way

if(err) {
return throw new Meteor.Error(e);
}
return 'success';

import should be relative meaning to say import path should not point to root directory like /client/path/and/so/on.jsx instead you have to use ../path/to/the/exact/file.jsx.

ickyrr / chatninja Goto Github PK

chatninja's Introduction

Fixtures:

Email: [email protected] to [email protected]

Password: user12345

To run locally:

Mantra BoilerPlate 2

Topics

Installing Mantra CLI

Creating a mantra project via Mantra CLI

Running Mantra using Bash

Creating a module in Mantra CLI

Creating a file inside container, actions and compontents in a modules in mantra CLI

Naming Convention

Data Subscription Non-Global

Filaname Prefix and Suffix

Event Names to be used

Adding a custom CSS file

Naming convention for Function names, Subscription names, and Publication names

Adding a 3rd party scripts/codes such as Boostrap, JS, Fonts and CSS

Adding Routes

Adding a schema

Adding User Authentication

Using StoryBook

Adding content inside the <head></head> tag using NPM React-Helmet

ESLint Rules

Wrong way

Right way

Recommend Projects

Recommend Topics

Recommend Org

Adding content inside the `<head></head>` tag using `NPM React-Helmet`