My Development Stack
Apr 16, 2016 · 8 min read
This post is still a work in progress.
I am always looking to improve and keep my development stack up to date, over the last few years it has changed a lot! I started with a Microsoft based stack of ASP.NET MVC and jQuery, to ASP.NET Web Api and Angular, to my current stack of Node and React.
I thought I would detail my current stack and any helpful resources I have found along the way for those interested. I would also love to hear from you on what you use or if you have any suggested improvements. I also thought that I would include some of the things I will be looking at in the future.
I do use a mac for development so some of these might not be available to you, but most of them should be.
Font-end
react
react-router
alt
Alt is a flux implementation and is in fact built on top of flux.
There are a lot of flux implementations out there, a quick google will find 10+ alternatives.
The general principle are to remove a lot of the boilerplate code surrounding using vanilla flux, so that you are free to get on with more important things.
I choose alt as it was recommended on a few blog posts that I had read. The only other implementation I have used is vanilla flux and I can say that alt is nicer to use and involves a lot less boilerplate.
angular 1.x
stylus
Stylus is a css preprocessor, similar to less and sass.
Before migrating to stylus, I almost exclusively wrote vanilla css. I reached one of my many points when I decided I wanted to learn something new, so I thought I would look into learning one of the css preprocessors. I decided to look at less, sass and stylus and I really liked the stripped down, significant whitespace that stylus had to offer, I thought this made it really clean and easy to read and saved on a lot of typing (I mean who really wants to have to put loads of colons, semi-colons and braces everywhere)!
I have been using it for almost a year now and would really recommend it to anyone looking to learn a css preprocessor.
BEM naming
CSS modules
es6/es7
Back-end
Node
nvm
Express
Mongoose
sequelize
Nodemailer
Jade
Developer Tools
WebStorm
Android Studio
Chrome
Build Tools
npm
webpack
babel
Testing
jest
mocha
istanbul
eslint
airbnb config
travis ci
circle ci
coveralls
Code Climate
David
David describes itself pretty well, so why reinvent the wheel!
David gets you an overview of your project dependencies, the version you use and the latest available, so you can quickly see what’s drifting. Then it’s all boiled down into a badge showing the current status, which you can embed on your site.
I use it on all of my (latest) open source projects (see my github page) and with a glance of the README see if the project dependencies are up to date.
If I need to update my npm packages I use a little utility called npm-check-updates. It is really useful as it checks for the latest stable version and updates my package.json with the new version.