Mean Framework Learning Notes

Source: Internet
Author: User

mean Framework Learning notes

The mean development framework has very little information, and the main information is from the Learn.mean.io website. So holding a kind of zero basic learning mentality, in the process of understanding, through translation and understanding will mean frame a little digestion and absorption, step by step, slowly record my learning mean drip.


1, mean is able to manage the user's
Manage users with mean's mean-cli. The command is:
$ mean user <email>$ mean user <email>--addrole <role>;$ mean user <email>--removerole <role& gt;;
2, mean can be listed also can install and unload modules

The mean module is installed and placed in the/node_modules folder.
$ mean list$ mean install <module>$ mean uninstall <module>

3. Custom packages should be placed in the
/package/custom
folder, and the packages that need to be contributed are placed in the
/package/contrib
Folder.

4, the core package is:
System: Basic page, overall page layout, rendering engine, static files, client-to-server routing, and so on.
User: Provides a database model for registering users and related authentication for login and registration.
Access: Manage permissions and middleware, which contains many authorization methods that rely on the user package.
Theme: About CSS and pictures and background resources.
Articles: It can be regarded as a starting point of the content of blog and CMS, and it contains complete additions and deletions (Grud) in client and server.


5. All packages have their corresponding client and server parts. The client section is in the public folder, which includes:
Asset:javascript code, CSS, images, etc.;
Controllers: The controller of the front-end frame angular.
Config: Contains the routing file.
Services:angular Service (also directives and filter folders)
Views:angular View


The server section is in the Servers folder, which includes:
Config: Configuration file
Controllers:angular Controller
Models: Database Schema Model
Routes:rest API Routing End
Views: HTML rendering based on Swig


6. Dependency Injection (Dependency injection)
Mean's dependency injection can resolve all dependencies for you by automatically parsing the packages that your system has when you declare the dependencies you need. Any registered packages will become available when you declare dependencies.
For example, in the root directory of a package, there is a app.js file, which contains the registration method, the use of dependency injection.
Here MyPackage, when registering, relies on a package called tokens.
Example of registering the Tokens Packagemypackage.register (function (app, auth, database, tokens) {  //I can make u SE of the tokens within my module  mypackage.someexamplefunction (' some parameter ');  I can override functions  mypackage.someexamplefunction = function (param) {    //my custom logic goes here  };} );

7. Angular modules and dependencies
When you register each package, a mean is created automatically. [Package_name] Such a angular module.
At the same time you can declare that your angular module needs to use the angular dependency. Let's say this:
Example of adding an angular dependency of the Ngdragdrop to Themypackage.angulardependencies ([' Ngdragdrop ']);

8. Objects and Aggregations (Assets and Aggregation)
All objects (including JavaScript scripts, CSS, pictures, and so on) are placed in the Public/assets folder.
JavaScript scripts, CSS, and pictures can be aggregated into a global aggregation file. All of the default JavaScript scripts are wrapped in anonymous functions unless {global:true} is not placed in the contained domain.
<pre name= "Code" class= "JavaScript" >//adding jquery to the mean Projectmypackage.aggregateasset (' js ', ' Jquery.min.js ');//adding another library-global by default is Falsemypackage.aggregateasset (' js ', ' jquery.min.js ', { Global:true});//adding some CSS to the mean Projectmypackage.aggregateasset (' css ', ' default.css ');
JavaScript files that are not placed in the assets folder are aggregated and injected into the mean project. If this is not the case, you should place it in the Public/assets/js folder. Aggregation operations support controlling where the aggregation code is placed. It is often necessary to add a weight and a group variable to determine if it is in the correct position.
Mypackage.aggregateasset (' js ', ' First.js ', {global:true,  Weight: -4, Group: ' Header '});

9. Settings Object
The Settings object is a persistent object that allows you to save persistent information, such as configuration options or administrative information, in each package.
You can get and save persistent information by settings this function. For example:
Mypackage.settings ({' somesetting ': ' Some value '}, function (err, settings) {    //You'll receive the Settings object on Success});//Another Save settings example this time and no callback//this writes over the last settings. Mypackage.settings ({' anothersettings ': ' Some value '});//Get settings. Retrieves latest saved settingsmypackage.settings (function (err, settings) {//Your now has the  settings object});
When the information is stored, the first parameter is the JSON format information, the second parameter is the callback function. The callback function is used to determine whether the information is stored, and the second parameter is optional. When reading the information, only one parameter is required. This parameter is the callback function.

10. Express Routing
All routes to the server-side controller are controlled by Express. The package system will be passed along the object of the package to the routing file. Usually a/server/routes/mypackages.js.
By default, the routes function has some other parameters:
Mypackage.routes (app, auth, database);
Here is an example of server/routes/mypackage.js:
The package is past automatically as first parametermodule.exports = function (MyPackage, app, auth, database) {  // Example Route  app.get ('/mypackage/example/anyone ', function (req,res,next) {    res.send (' Anyone can access This ');};  

11. Angular Routing
Angular also has a route, and its routing is usually in public/routes/mypackage.js. The latest version of Mean uses $stateprovider.
$stateProvider  . State (' mypackage example page ', {    URL: '/mypackage/example ',    templateurl: ' mypackage/ Views/index.html '  });


When you start with the package name, the angular view can be made public by Templateurl.

12. Menu system
The package can hook up the existing menu system and then add links to the mean integrated menu. Each link has a designated title, template, menu, role. If the specified menu does not exist, a new menu will be created. Using the menu angular service to query the linked information, you can make the menu object become accessible to the client.


Here's how to add a link to a menu in App.js.
We is adding a link to the main menu for all authenticated UsersMyPackage.menus.add ({  title: "MyPackage Example Pag E ",  Link:" mypackage example Page ",  roles: [" Authenticated "],  menu:" Main "});


You can see how the menu service is implemented by looking at the Public/system/controllers/header.js directory.


13. HTML View Rendering
The package can be rendered in HTML using the built-in rendering function. The default render function is swig. The view survival is in the Server/views folder in the package and ends with. html.
Here is an example of a simple rendering of HTML.
App.get ('/mypackage/example/render ', function (req,res,next) {  mypackage.render (' index ', {packagename: ') MyPackage '}, function (err, HTML) {    //rendering a view from the package server/views    res.send (HTML);});  

14. Override the default layout
With a custom package, you can override the default layout.
Here is an example that overrides the default system layout instead of using the local layout within the package:
Mypackage.register (function (System, APP) {  app.set (' views ', __dirname + '/server/views ');  // ...

Note, however, that the package must rely on system packages to ensure that it is evaluated after the system package so that the view folder can be overwritten.


15. Overlay View
You can override the default public view used by the core package. To create a home page, you must create a package and modify the script in the public folder, like this:
Angular.module (' Mean.mycustompackage ', [' Mean.system ']). config ([' $viewPathProvider ', function ($viewPathProvider) {  $viewPathProvider. Override (' system/views/index.html ', ' mycustompackage/views/myhomepage.html ');}]);

This renders the mycustompackage/views/myhomepage.html as the home page.

16. Create your own package
$ mean Package <packageName>

It will create the package under/packages/custom/packagename.

17. Delete Package
$ mean Uninstall MyPackage

18. Contribute your own package
If your package is set up and nothing goes wrong, you can upload your package to the package code base. The method is:
$ mean Register # Register to the mean network (see below) $ cd <packages/custom/pkgname>$ mean publish

Copyright NOTICE: This article for Bo Master original article, without Bo Master permission not reproduced.

Mean Framework Learning Notes

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.