Finding myself with some free time (and looking into starting a new project), I thought I might catch myself up on the state of web technologies, and what might be a good stack to work with.
The details collected here are most certainly not a complete layout of the entire landscape, and there will no doubt be leanings toward my personal tastes (reactive, api-driven, etc). You should use this more as a starter into your own deeper research than as a source of ultimate truth. With that out of the way, let's get into it!
The frontend is the pretty, interactive, main part that people will be seeing. You can have the most amazingly streamlined and perfect backend code, but noone's going to notice and love it without a strong frontend to back it up.
- React (GitHub) (most likely with a flavour of Flux (GitHub))
- A frontend framework from Facebook that is taking the web by storm. Probably my personal favourite from what I've seen so far.
- It even let's you build for native devices!
- Angular (v2) (or if you like outdated for some reason AngularJS (v1))
- Also available for native devices
- I was a big fan of AngularJS (v1), and I want to like v2, but I don't think it will be my main choice.
- There are a TON of other frontend frameworks, of varying popularity and support. I won't delve into them much, but there's heaps of info out there
- From reading around the web, there's a decent amount of good stuff talking about Vue. In the end I decided against it since it's not supported by a big backer, and the skills aren't as useful on a resume. That said, for a personal project it could be a great fit!
- vue, vue-rx, vue-resource, vue-router, vuex, revuew
- Riot (v2)
As with most things, every man and his dog has their own opinion, so here are a few comparisons I found useful:
- "Comparison of Angular 2 and React" by Mark Volkmann and Lance Finney
- "Angular 2 vs. React" by Itay Herskovits
- "Angular 2 versus React: There Will Be Blood" by Cory House
- "Vue.js vs React.js" by Richard LaFranchi
- "Why doesn’t MDG just adopt Vue.js and forget about React vs Blaze?"
Even if you like to go oldschool and code your site by hand in notepad/vi, you can't deny the ease/benefits of using a frontend UI framework.
- Bootstrap (v4)
- Material Design
Can't decide? Try some comparisons:
- "The Rundown: Bootstrap vs. Google MDL vs. Foundation" by treehouse
- "State of affairs: Bootstrap 4 vs Foundation 6.2" by Danny Herran
- TypeScript (GitHub)
- If you're using Angular (v2) and like sticking to convention, this is the one for you.
- CoffeeScript (or maybe v2)
- This used to be my choice, but looking at the other options available now, I think i'll be moving on.
- As always, there are a bunch of arguments for and against..
- If you're looking for a way out, why not decaffeinate?
- Flow (GitHub)
- Taking the power of asynchronous, message based actors, and applying them to HTTP. Definite win.
- Bootzooka (GitHub)
- "Bootzooka is a simple application scaffolding project to allow quick start of development for modern, web based applications."
- While not perfect, it's a decent implementation of a starter app, tying together some useful technologies.
- Play Framework
- "Play is a high-productivity Java and Scala web application framework that integrates the components and APIs you need for modern web application development."
- "Scalatra is a simple, accessible and free web micro-framework. It combines the power of the JVM with the beauty and brevity of Scala, helping you quickly build high-performance web sites and APIs."
- Lift (GitHub)
- "Lift is the most powerful, most secure web framework available today. There are Seven Things that distinguish Lift from other web frameworks."
- http4s (GitHub)
- "A typeful, purely functional, streaming library for HTTP clients and servers in Scala."
- "Fast, testable, Scala services built on TwitterServer and Finagle."
- While not a choice unto itself, this should help speed things up and keep your site nice and search engine friendly.
- There will be a number of opinions spread throughout the net, including:
- You also have all of your other typical options
- Express: "Fast, unopinionated, minimalist web framework for Node.js"
- Meteor: "Meteor is an open source platform for web, mobile, and desktop."
- "Node.js Frameworks: The 10 Best for Web and Apps Development" by noeticsunil mobile, and desktop."
With the crazy mix of technologies and steps involved in modern web app development, it makes a ton of sense to tie it all together with some automation.
- Webpack (GitHub)
- "Webpack: When To Use And Why" by Andrew Ray
- Gulp (GitHub
- Grunt (GitHub)
- Grunt is basically the older, less streaming, less awesome version of Gulp.
While a little different in purpose to the things mentioned above, getting everything nicely tested and deployed is always good:
- Bitbucket Pipelines: "Build, test and deploy from Bitbucket"
Hopefully this has given you a decent starting point for figuring out what combination of technologies is going to work best for your next project. If you want to see the direction I've decided to go, make sure you read on in Part 2.
Have I missed something important? Not given love to your favourite stack? Got a cool pointer? Or just want to say hi? Let me know in the comments!
- 2017-04-11 Added some more backend web frameworks, updated akka-http link, fixed some formatting