ChatGPT解决这个技术问题 Extra ChatGPT

Difference between MEAN.js and MEAN.io

I wanted to use the MEAN JavaScript Stack, but I noticed that there are two different stacks with either their own website and installation methods: mean.js and mean.io. So I came up asking myself this question: "Which one do I use?".

So in order to answer this question I ask the community if you could explain what are the differences between these two? And if possible pros and cons? Because they look very similar to me.

Choosing between MEAN.io and MEAN.js may be a moot point now that Meteor has released 1.0 and offers so much more out of the box.

s
sdude

They're essentially the same... They both use swig for templating, they both use karma and mocha for tests, passport integration, nodemon, etc.

Why so similar? Mean.js is a fork of Mean.io and both initiatives were started by the same guy... Mean.io is now under the umbrella of the company Linnovate and looks like the guy (Amos Haviv) stopped his collaboration with this company and started Mean.js. You can read more about the reasons here.

Now... main (or little) differences you can see right now are:

SCAFFOLDING AND BOILERPLATE GENERATION

Mean.io uses a custom cli tool named 'mean' Mean.js uses Yeoman Generators

MODULARITY

Mean.io uses a more self-contained node packages modularity with client and server files inside the modules. Mean.js uses modules just in the front-end (for angular), and connects them with Express. Although they were working on vertical modules as well...

BUILD SYSTEM

Mean.io has recently moved to gulp Mean.js uses grunt

DEPLOYMENT

Both have Dockerfiles in their respective repos, and Mean.io has one-click install on Google Compute Engine, while Mean.js can also be deployed with one-click install on Digital Ocean.

DOCUMENTATION

Mean.io has ok docs Mean.js has AWESOME docs

COMMUNITY

Mean.io has a bigger community since it was the original boilerplate Mean.js has less momentum but steady growth

On a personal level, I like more the philosophy and openness of MeanJS and more the traction and modules/packages approach of MeanIO. Both are nice, and you'll end probably modifying them, so you can't really go wrong picking one or the other. Just take them as starting point and as a learning exercise.

ALTERNATIVE “MEAN” SOLUTIONS

MEAN is a generic way (coined by Valeri Karpov) to describe a boilerplate/framework that takes "Mongo + Express + Angular + Node" as the base of the stack. You can find frameworks with this stack that use other denomination, some of them really good for RAD (Rapid Application Development) and building SPAs. Eg:

Meteor. Now with official Angular support, represents a great MEAN stack

StrongLoop Loopback (main Node.js core contributors and Express maintainers)

Generator Angular Fullstack

Sails.js

Cleverstack

Deployd, etc (there are more)

You also have Hackathon Starter. It doesn't have A of MEAN (it is 'MEN'), but it rocks..

Have fun!


Hey thank you for the response! hackathon-starter looks awesome! It looks more for what I'm looking for. It's also mostly JS and has the authentications already implemented and that was what I thought would be the hardest part... All thought I still feel like I don't know all my options... :-/ Also it came up later, does hackathon-starter have a Scaffolding and Boilerplate Generator? But still Thank you very much for your awesome response!
You're welcome. Yeah, what I also like about hackathon-starter is the complete account management and workflow (forgot password, confirmation email,etc) and the integration with sendgrid, paypal, etc... Things that MEAN.js and MEAN.io both lack. It is a cool starter for certain kind projects.
It is certainly a nice starting point for projects if you don't need angular. Don't worry about the other parts of the platform. Most likely you'll find plug&play node packages that do just that.. I.e: gist.github.com/facultymatt/6370903 for roles
A good situation would be to use it with SOA's where you consume a REST API. If you are on a tight schedule, then drop angular. The learning curve is quite steep... It is a "nice to have" for front-end, but not a critical component. You can always learn it in parallel and use it in your next project or plug it later to this one.
Hey guys! I found something that derived from hackathon-starter but very nice as well: Skeleton! ;-)
C
Chuck Le Butt

First of all, MEAN is an acronym for MongoDB, Express, Angular and Node.js.

It generically identifies the combined used of these technologies in a "stack". There is no such a thing as "The MEAN framework".

Lior Kesos at Linnovate took advantage of this confusion. He bought the domain MEAN.io and put some code at https://github.com/linnovate/mean

They luckily received a lot of publicity, and theree are more and more articles and video about MEAN. When you Google "mean framework", mean.io is the first in the list.

Unfortunately the code at https://github.com/linnovate/mean seems poorly engineered.

In February I fell in the trap myself. The site mean.io had a catchy design and the Github repo had 1000+ stars. The idea of questioning the quality did not even pass through my mind. I started experimenting with it but it did not take too long to stumble upon things that were not working, and puzzling pieces of code.

The commit history was also pretty concerning. They re-engineered the code and directory structure multiple times, and merging the new changes is too time consuming.

The nice things about both mean.io and mean.js code is that they come with Bootstrap integration. They also come with Facebook, Github, Linkedin etc authentication through PassportJs and an example of a model (Article) on the backend on MongoDB that sync with the frontend model with AngularJS.

According to Linnovate's website:

Linnovate is the leading Open Source company in Israel, with the most experienced team in the country, dedicated to the creation of high-end open source solutions. Linnovate is the only company in Israel which gives an A-Z services for enterprises for building and maintaining their next web project.

From the website it looks like that their core skill set is Drupal (a PHP content management system) and only lately they started using Node.js and AngularJS.

Lately I was reading the Mean.js Blog and things became clearer. My understanding is that the main Javascript developer (Amos Haviv) left Linnovate to work on Mean.js leaving MEAN.io project with people that are novice Node.js developers that are slowing understanding how things are supposed to work.

In the future things may change but for now I would avoid to use mean.io. If you are looking for a boilerplate for a quickstart Mean.js seems a better option than mean.io.


Hi Chris, Linnovate has been doing node.js/mongo work for over 3 years, We accept pull requests and ideas if you feel something is poorly architected and you have a constructive idea of how to improve it. I suspect that you experienced the shift we did in the core project to support dependency injection, package support and the mean cli, we have been moving the project from a boilerplate to a framework and had some "growing pains".
I invite you to revisit the project and review the new package system which lets you extend your project through mean packages. The feature has been accepted very well by the community and is one of the first examples of full stack packages (providing both server and clients side functionality through a package while extending the core project).
After comparing the MEAN.io VS MEAN.js, by pure growth . mean.js received 93 contributor in 1 year with 700 commits while mean.io received 130 for 3 years and surprising low, 1200 commits. (by just statistics, take it with a grain of salt) Obviously, MEAN.js is catching up real quick. Hey, I am not yet looking into the code. but basically, MEAN.io sounds like the Apple which lost its Steve Jobs.
D
Dan Cancro

Here is a side-by-side comparison of several application starters/generators and other technologies including MEAN.js, MEAN.io, and cleverstack. I keep adding alternatives as I find time and as that happens, the list of potentially provided benefits keeps growing too. Today it's up to around 1600. If anyone wants to help improve its accuracy or completeness, click the next link and do a questionnaire about something you know.

Compare app technologies project

From this database, the system generates reports like the following:

MeanJS vs MeanIO trade-off report


I added individual pages to the document with head to head comparisons. There's one comparing MEAN.js and MEAN.io
"You need permission" - it is not accessible.
It's now a knowledge co-op. Just fill out a questionnaire here about some technology you know and I'll grant you access to the doc dancancro.com/technology-questionnaires
D
Dan Cancro

The Starter Trade-offs sheet of my comparison spreadsheet has comprehensive one-on-one comparisons between each generator. So no more need to distortedly cherry-pick great things to say about your favorite.

Here is the one between generator-angular-fullstack and MEAN.js. The percentages are values for each benefit based on my personal weightings, where a perfect generator would be 100%

generator- angular- fullstack offers 8% that MEANJS.org doesn't

1.9% Client-side end-to-end tests

0.6% factory

0.5% provider

0.4% SASS

0.4% LESS

0.4% Compass

0.4% decorator

0.4% Endpoint subgenerator

0.4% Comments

0.3% FontAwesome

0.3% Run server in debug mode

0.3% Save generator answers to a file

0.2% constant

0.2% Development build script: ...... replace 3rd party deps with CDN versions

0.2% Authentication - Cookie

0.2% Authentication - JSON Web Token (JWT)

0.2% Server-side logging

0.1% Development build script: run tasks in parallel to speed it up

0.1% Development build script: Renames asset files to prevent browser caching

0.1% Development build script: run end to end tests

0.1% Production build script: safe pre-minification

0.1% Production build script: add CSS vendor prefixes

0.1% Heroku deployment automation

0.1% value

0.1% Jade

0.1% Coffeescript

0.1% Serverside authenticated route restriction

0.1% SASS version of Twitter Bootstrap

0.1% Production build script: compress images

0.1% OpenShift deployment automation

MeanJS.org. offers 9% that generator-angular-fullstack doesn't

3.7% Dedicated/searchable user group: response time mostly under a day

0.4% Generate routes

0.4% Authentication - Oauth

0.4% config

0.4% i18n, localization

0.4% Input application profile

0.3% FEATURE (a.k.a. module, entity, crud-mock)

0.3% Menus system

0.3% Options for making subcomponents

0.3% test - client side

0.3% Javascript performance thing

0.3% Production build script: make static pages for SEO

0.2% Quick install?

0.2% Dedicated/searchable user group

0.1% Development build script: reload build file upon change

0.1% Development build script: coffee files compiled to JS

0.1% controller - server side

0.1% model - server side

0.1% route - server side

0.1% test - server side

0.1% Swig

0.1% Safe from IP Spoofing

0.1% Production build script: uglification

0.0% Approach to views: URLs start with "#!"

0.0% Approach to frontend services and ajax calls: uses $resource

Here is the one between MEAN.io and MEAN.js in a more readable format



MeanJS.org. provides these benefits that MEAN.io. doesn't



Help:
    * Dedicated/searchable user group for questions, using github issues
    * There's a book about it
File Organization:
    * Basic sourcecode organization, module(->submodule)->side
    * Module directories hold directives
Code Modularization:
    * Approach to AngularJS modules, Only one module definition per file
    * Approach to AngularJS modules, Don’t alter a module other than where it is defined
Model:
    * Object-relational mapping
    * Server-side validation, server-side example
    * Client side validation, using Angular 1.3
View:
    * Approach to AngularJS views, Directives start with "data-"
    * Approach to data readiness, Use ng-init
Control:
    * Approach to frontend routing or state changing, URLs start with '#!'
    * Approach to frontend routing or state changing, Use query parameters to store route state
Support for things:
    * Languages, LESS
    * Languages, SASS
Syntax, language and coding:
    * JavaScript 5 best practices, Don't use "new"
Testing:
    * Testing, using Mocha
    * End-to-end tests
    * End-to-end tests, using Protractor
    * Continuous integration (CI), using Travis
Development and debugging:
    * Command line interface (CLI), using Yeoman
Build:
    * Build configurations file(s)
    * Deployment automation, using Azure
    * Deployment automation, using Digital Ocean, screencast of it
    * Deployment automation, using Heroku, screencast of it
Code Generation:
    * Input application profile
    * Quick install?
    * Options for making subcomponents
    * config generator
    * controller (client side) generator
    * directive generator
    * filter generator
    * route (client side) generator
    * service (client side) generator
    * test - client side
    * view or view partial generator
    * controller (server side) generator
    * model (server side) generator
    * route (server side) generator
    * test (server side) generator
Implemented Functionality:
    * Account Management, Forgotten Password with Resetting
    * Chat
    * CSV processing
    * E-mail sending system
    * E-mail sending system, using Nodemailer
    * E-mail sending system, using its own e-mail implementation
    * Menus system, state-based
    * Paypal integration
    * Responsive design
    * Social connections management page
Performance:
    * Creates a favicon
Security:
    * Safe from IP Spoofing
    * Authorization, Access Contol List (ACL)
    * Authentication, Cookie
    * Websocket and RESTful http share security policies




MEAN.io. provides these benefits that MeanJS.org. doesn't



Quality:
    * Sponsoring company
Help:
    * Docs with flatdoc
Code Modularization:
    * Share code between projects
    * Module manager
View:
    * Approach to data readiness, Use state.resolve()
Control:
    * Approach to frontend code loading, Use AMD with Require.js
    * Approach to frontend code loading, using wiredep
    * Approach to error handling, Server-side logging
Client/Server Communication:
    * Centralized event handling
    * Approach to XHR calls, using $http and $q
Syntax, language and coding:
    * JavaScript 5 best practices, Wrap code in an IIFE (SEAF, SIAF)
Development and debugging:
    * API introspection report and testing interface, using Swagger
    * Command line interface (CLI), using Independent command line interface
Build:
    * Development build, add IIFEs (SEAF, SIAF) to executable copies of code
    * Deployment automation
    * Deployment automation, using Heroku
Code Generation:
    * Scaffolding undo    (mean package -d <name>)
    * FEATURE (a.k.a. module, entity) generator, Menu items added for new features
Implemented Functionality:
    * Admin page for users and roles
    * Content Management System    (Use special data-bound directives in your templates.
Switch to edit mode and you can edit the values right where you see them)
    * File Upload
    * i18n, localization
    * Menus system, submenus
    * Search
    * Search, actually works with backend API
    * Search, using Elastic Search
    * Styles, using Bootstrap, using UI Bootstrap AngularJS directives
    * Text (WYSIWYG) Editor
    * Text (WYSIWYG) Editor, using medium-editor
Performance:
    * Instrumentation, server-side
Security:
    * Serverside authenticated route restriction
    * Authentication, using Oauth, Link multiple Oauth strategies to one account
    * Authentication, JSON Web Token (JWT)




MEAN.io. and MeanJS.org. both provide these benefits



Quality:
    * Version Control, using git
Platforms:
    * Client-side JS Framework, using AngularJS
    * Frontend Server/ Framework, using Node.JS
    * Frontend Server/ Framework, using Node.JS, using Express
    * API Server/ Framework, using NodeJS
    * API Server/ Framework, using NodeJS, using Express
Help:
    * Dedicated/searchable user group for questions
    * Dedicated/searchable user group for questions, using Google Groups
    * Dedicated/searchable user group for questions, using Facebook
    * Dedicated/searchable user group for questions, response time mostly under a day
    * Example application
    * Tutorial screencast in English
    * Tutorial screencast in English, using Youtube
    * Dedicated chatroom
File Organization:
    * Basic sourcecode organization, module(->submodule)->side, with type subfolders
    * Module directories hold controllers
    * Module directories hold services
    * Module directories hold templates
    * Module directories hold unit tests
    * Separate route configuration files for each module
Code Modularization:
    * Modularized Functionality
    * Approach to AngularJS modules, No global 'app' module variable
    * Approach to AngularJS modules, No global 'app' module variable without an IIFE
Model:
    * Setup of persistent storage
    * Setup of persistent storage, using NoSQL db
    * Setup of persistent storage, using NoSQL db, using MongoDB
View:
    * No XHR calls in controllers
    * Templates, using Angular directives
    * Approach to data readiness, prevents Flash of Unstyled/compiled Content (FOUC)
Control:
    * Approach to frontend routing or state changing, example of it
    * Approach to frontend routing or state changing, State-based routing
    * Approach to frontend routing or state changing, State-based routing, using ui-router
    * Approach to frontend routing or state changing, HTML5 Mode
    * Approach to frontend code loading, using angular.bootstrap()
Client/Server Communication:
    * Serve status codes only as responses
    * Accept nested, JSON parameters
    * Add timer header to requests
    * Support for signed and encrypted cookies
    * Serve URLs based on the route definitions
    * Can serve headers only
    * Approach to XHR calls, using JSON
    * Approach to XHR calls, using $resource (angular-resource)
Support for things:
    * Languages, JavaScript (server side)
    * Languages, Swig
Syntax, language and coding:
    * JavaScript 5 best practices, Use 'use strict'
Tool Configuration/customization:
    * Separate runtime configuration profiles
Testing:
    * Testing, using Jasmine
    * Testing, using Karma
    * Client-side unit tests
    * Continuous integration (CI)
    * Automated device testing, using Live Reload
    * Server-side integration & unit tests
    * Server-side integration & unit tests, using Mocha
Development and debugging:
    * Command line interface (CLI)
Build:
    * Build-time Dependency Management, using npm
    * Build-time Dependency Management, using bower
    * Build tool / Task runner, using Grunt
    * Build tool / Task runner, using gulp
    * Development build, script
    * Development build, reload build script file upon change
    * Development build, copy assets to build or dist or target folder
    * Development build, html page processing
    * Development build, html page processing, inject references by searching directories
    * Development build, html page processing, inject references by searching directories, injects js references
    * Development build, html page processing, inject references by searching directories, injects css references
    * Development build, LESS/SASS/etc files are linted, compiled
    * Development build, JavaScript style checking
    * Development build, JavaScript style checking, using jshint or jslint
    * Development build, run unit tests
    * Production build, script
    * Production build, concatenation (aggregation, globbing, bundling)    (If you add debug:true to your config/env/development.js the will not be
uglified)
    * Production build, minification
    * Production build, safe pre-minification, using ng-annotate
    * Production build, uglification
    * Production build, make static pages for SEO
Code Generation:
    * FEATURE (a.k.a. module, entity) generator    (README.md
feature css
routes
controller
view
additional menu item)
Implemented Functionality:
    * 404 Page
    * 500 Page
    * Account Management
    * Account Management, register/login/logout
    * Account Management, is password manager friendly
    * Front-end CRUD
    * Full-stack CRUD
    * Full-stack CRUD, with Read
    * Full-stack CRUD, with Create, Update and Delete
    * Google Analytics
    * Menus system
    * Realtime data sync
    * Realtime data sync, using socket.io
    * Styles, using Bootstrap
Performance:
    * Javascript performance thing
    * Javascript performance thing, using lodash
    * One event-loop thread handles all requests
    * Configurable response caching    (Express plugin
https://www.npmjs.org/package/apicache)
    * Clustered HTTP sessions
Security:
    * JavaScript obfuscation
    * https
    * Authentication, using Oauth
    * Authentication, Basic    (With Passport or others)
    * Authentication, Digest    (With Passport or others)
    * Authentication, Token    (With Passport or others)


I suggest you merge the two answers you've posted.
h
hughc

I'm surprised nobody has mentioned the Yeoman generator angular-fullstack. It is the number one Yeoman community generator, with currently 1490 stars on the generator page vs Mean.js' 81 stars (admittedly not a fair comparison given how new MEANJS is). It is appears to be actively maintained and is in version 2.05 as I write this. Unlike MEANJS, it doesn't use Swig for templating. It can be scaffolded with passport built in.


@SDude's answer mentioned it.
Where? I don't see it anywhere in his answer or comments.
Maybe I misunderstood your answer... But SDude mentioned that "Mean.js uses Yeoman Generators" for scaffolding.
I totally forgot about this. I actually learned about MEAN.js in the github comments of generator-angular-fullstack long ago... I've added it to the answer.
@CMPSoares... There are multiple Yeoman generators that scaffold out MEAN stacks. Angular-Fullstack and Mean.js are just two of many (arguably the most fleshed out two?). You can look at all the Yeoman community generators here... Yeoman Generators