A few things I would have found helpful when making the switch from Django/Twisted to MEAN (Mongo, Express, Angular, Node).
How should I get started?
For me the process was:
- Write a simple RESTful service with Node/Express/Mongo
- Write a standalone, server-less Angular application
- Combine the two together
To get start with (1), I recommend this scotch.io tutorial. There's nothing conceptually new here besides perhaps Mongo being a document store, but this won't come into play; mongoose wraps that up like an ORM.
You should then follow the official Angular tutorial to get a grasp on Angular. I skipped the whole testing portion and left it for later (this is 50% of the tutorial). I wanted to get something working and get a feel for Angular before I invested effort familiarizing myself with automated testing tools. The important thing to realize here is that Angular lets you build self contained single page applications that run in your browser. While it is often very useful to consume remote service APIs, this isn't a must. You can get quite a lot of functionality without accessing a single remote server.
Once you have some feel for the above, think about something useful you'd like to build (more complex than a todo app). Define a RESTful service (that will most likely just handle authentication and object storage) and implement an Angular application that consumes it (or alternatively, follow this scotch.io tuturial. Have Node serve both the RESTful service endpoints and the Angular JS files. A user will then navigate to your server and pull the Angular application and its dependencies (possibly only after authenticating). The application, in turn, will communicate with the RESTful service and populate itself with data.
Should I use a framework like mean.io or roll my own?
I have re-invented many wheels in my day but when I dive into something new, I like to adopt widely used infrastructures - the automatic choice, the road most travelled. At first I thought mean.io is the go to framework for MEAN, but I found this not to be the case. There were two reasons why I decided to build from the ground up rather than carve my application out of mean.io:
- Mean.io experienced a bump in the road when their main guy jumped ship and forked out to Mean.js. The company maintaining Mean.io then refactored it heavily (quite a lot of people critisized mean.io for its code quality pre-refactoring). All of this it didn't add up to a healthy place to start
- The basic boilerplate mean.io project is quite large and (as its creator mentioned) seems more like a hackathon seed than a clean base with which to create focused projects, especially when learning the ropes
This may mean a bit more work and some boilerplate code but at this early stage I think this is a good thing. I prefer wiring things up to learn how they work before using infrastructures that hide all the details.
Which seed project should I use for MEAN?
If, like me, you decide not to go the mean.io route you will quickly find that it's up to you to decide how your code directory structure will look like. Django decides this for you (for better or worse) but with MEAN you are left to decide which seed project directory structure your code will follow. You may be tempted to follow Google's angular-seed as it is widely known and used in many Angular tutorials. This is a great choice to start, but is simply awful for anything more than a test project.
At first I tried looking at mean.io for inspiration but quickly found it too bloated and fragmented even for that (again, assuming we're trying to learn from the ground up rather than just making it work).
Two things eventually influenced the directory structure I used in my first MEAN project:
- This article by Cliff Meyers made a lot of sense to me regarding how to structure the Angular code. I felt he made a good point that this structure describes what the application does, and it also felt like something that could grow horizontally (more files) rather than vertically (larger files)
- Quite a few seeds I looked at (which were well received on Github) separated the client/ from the server/ and that felt like a natural thing to do
I have no doubt that the structure I chose will change (and perhaps even evolve into something similar to mean.io or mean.js) but for a small personal-yet-deployed project this held up pretty well.
What is the best development environment?
This is easy as there are no worthy alternatives - use Webstorm. It's far from perfect but it's pretty damn good. The editor may not be as good as Sublime Text but the fact that you can easily source level debug both when running tests and running a development server is a must. Do not be tempted to debug your code with the logger. The minute you write actual code that does something you need source level debugging.
More insights in part 2, here.