Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

How to understand the full Javascript Web development architecture MEAN

2025-03-29 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)06/02 Report--

How to understand the full Javascript Web development architecture MEAN, many novices are not very clear about this, in order to help you solve this problem, the following small series will explain in detail for everyone, there are people who need this to learn, I hope you can gain something.

introduction

MEAN, an all-Javascript development architecture, is suddenly gaining popularity among prototype developers in the Angular community. The initials stand for: (M)ongoDB--a document database for NoSQL that uses JSON style to store data and even JS for SQL queries;(E)xpress--a Node-based Web development framework;(A)agular--a front-end development framework for JS that provides declarative bi-directional data binding; and (N)ode--a V8-based runtime environment (JS language development) for building responsive, scalable Web applications.

Schematic diagram of MEAN architecture

MEAN proponents claim that if JS is used throughout the development stack, it will definitely increase efficiency greatly, which is undoubtedly a big selling point. This way, developers (both front-end and back-end) can not only use a consistent data model, but also have a consistent programming experience in other ways.

For example, in Mongo, you can store data in a JSON-like format (BSON, binary JSON), then call JSON queries in Express/Node, and pass the results to the Angular display on the front end in JSON format, which naturally makes debugging a lot easier.

Note: In fact, in MEAN architecture, Angular frontend is not necessary, you can replace it with other frontend frameworks such as Backbone, Ember or Polymer.

Why MongoDB?

As mentioned above, the most important advantage of this architecture is its ability to use a single language, which is the primary reason for choosing Mongo. I don't want to talk about noSQL here. The criticism of MEAN architecture is that MongoDB works well for small and medium-sized applications, but may be inadequate for large-scale applications (*** users). I mean, it all depends on how you use it.

SQL databases themselves are strongly typed, so there is a high degree of consistency to ensure that many types of dirty data do not make it into the database in the first place. NoSQL, on the other hand, is a weakly typed database, which makes it difficult to validate data and can only be implemented by developers, and because of this, it is especially suitable for storing non-canonical data, especially during prototyping, when the data model is undergoing rapid change.

The technical difference between SQL and noSQL comes down to balancing performance and stability. In some cases, the transaction processing of the data will not change easily once it is set, so Mongo is very suitable at this time; however, sometimes it will involve more complex transactions, involving many independent business logic, because Mongo does not provide a simple data model to support a certain level of atomic operations, SQL can come in handy at this time.

But regardless of whether you choose M in MEAN or not, you ultimately need to choose the right tool to do the right thing according to your own needs.

Why Express?

Express can simply be thought of as a toolkit for building Web applications on the Node platform. On top of Node, it provides many simple interfaces to create request nodes, handle cookies, etc., and many features to help you set up your own server. Overall, Express has advantages in the following areas:

Setting REST routing is simple ***:

app.get(/account/:id,function(req, res){/* req.params('id') is available */});

Support template engines such as Jade or Mustache

Automatic HTTP header processing:

app.get('/',function(req,res){ res.json({object:'foo'}); });

Connect middleware is supported and additional request or response processing can be inserted, such as user authentication

Provides helper functions to parse POST requests

Protection against XSS

Elegant error handling

How to get started MEAN quickly

If you want to get started with MEAN quickly, mean.io is a great choice. The project aims to solve some common integration problems in MEAN architecture, it is well maintained, the documentation is clear, and it is easy to add third-party libraries by yourself, and it can be used with Yeoman (via generator-mean by James Cryer).

Before reading any further, let's assume that we agree with the following: (a) Mongo is at least perfectly suited for prototyping full Javascript stacks; and (b) acknowledge that even Angular's popularity will one day be superseded by other JS frameworks that help us build the architecture quickly and easily.

Yeoman consists of three tools you know:

Grunt: Used to generate, preview and automate your projects, thanks in particular to the many grunt tasks created by Yeoman and the grin t-contrib team.

Bower: A dependency management tool on the front end that eliminates the need to manually download and manage third party JS libraries.

YO: Quickly build a new app, including configuring your Grunt tasks and Bower dependencies that you will most likely use.

A year ago, I co-founded ExpressStack, a project with a few other people, with the simple idea of providing tools to quickly generate everything you need to build an all-JS Web application. But the project died, though many similar projects have sprung up.

These projects are described below:

Note: You may need to install Yeomam(npm install -g yo) and some of the following generators (npm install -g).

1. generator-angular-fullstack

This is an AngularJS generator, integrated with Express, optional MongoDB. The main functions are as follows:

Liveload support for client and server.

Express Server integrates grunt tasks.

Easy deployment process built in.

Support Jade.

Reference: http://tylerhenkel.com/creating-apps-with-angular-and-node-using-yeoman/

2. generator-meanstack

Another MEAN architecture generator, integrated with grunt-express, functions as follows:

On the basis of generator-angular, express replaces Connect.

Liveload support for client and server.

Use the app_grunt.js file to launch the app, and define routes in app.js.

The directory structure follows the generator-angular style, with only minor changes.

Reference: github.com/Grievoushead/generator-express-angular

3. generator-mean-seed

Integrated Mongo, Express, Angular, Yeoman, Karma and Protractor (for automatic testing).

4. generator-klei

Similar to the others, but using Mongoose and Stylus, some other features include:

Its directory structure is very easy to expand (includes an example of TODO List)

A fully configured Gruntfile that integrates liverload, linting, concatenation, minification, etc.

Use exctrl to mount APIs automatically.

Grunt-injector is used, so that newly added js and css can be automatically loaded without manually modifying the Html layout file.

Use Karma, Mocha and Chai for front-end unit testing.

5. ultimate-seed-generator

The generator is very comprehensive, adding many third-party libraries, including Passport for user login, Browserify for loading js.

Integrated AngularUI, Barbeque (for task queue management) and BootStrap

Integration of Bower, Browserify, Express and Font Awesome

Integration of Grunt, Handlebars, jQuery, JSHint and Karma/Mocha

Supports LESS/LessHat, Liveload and Lodash/Underscore

Integration with Modernizr, MongoDB/Mongoose and Passport

How do you make choices?

After looking at so many generators, it is natural to ask, which one should I choose? In fact, the above list is sequential, based on compatibility with the *** version of Yeoman and maintenance activity.

Is an all-Javascript architecture suitable for production-level applications?

Admittedly, it would be great if every layer of the development stack could use JavaScript (at least for prototyping), but be careful not to tie yourself down in pursuit of this goal. While it's true that a growing number of large-scale apps are adopting similar architectures, such as Walmart and LinkedIn, that doesn't mean copying them will necessarily succeed.

Another thing to note is that it is much more difficult to build a backend on Node than in other languages such as Ruby, Python or Java. You may have to deal with memory leaks yourself, avoid time-consuming calculations in event loops, and be very careful with exception handling, which if not handled properly can cause the entire application server to crash, but these problems are handled well on other platforms. However, this is not to say that Node cannot be used in a production environment, of course, but with extra care.

To be honest, it is difficult to "package" a large, comprehensive solution for Web applications, and MEAN architecture certainly has its limitations. There is a lot of evolution in front-end and back-end design patterns, principles, and styles, so if you think PHP or Rails is the wiser choice, keep using it, otherwise, try MEAN, at least for now.

Did reading the above help you? If you still want to have further understanding of related knowledge or read more related articles, please pay attention to the industry information channel, thank you for your support.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report