What is a Full Stack Developer?
Simply put, a full-stack developer is a developer who is comfortable with both backend and front-end. Someone capable of making an entire functional application on his own. It is obvious why this skill has a lot of demand out there.
If you’re in a hurry, just take a look at the minimal full-stack JS dev section towards the end for… well… the bare minimum.
Without further ado, let’s dive in and take a look at what a full-stack developer may use to achieve the incredible.
Okay lets face it — you can’t be a full-stack dev without being a front-end developer first. It’s a part of the definition of the term. The bare minimum you should be able to do is to make a functional, dynamic and responsive website/web app. If you’re not very comfortable with frontend, here’s something that might help. This can be achieved with your usual ingredients — HTML, CSS, JS. No surprises there. But in order to take your game up a notch, you’ll need to spice things up a little with a few frameworks and libraries.
There are a few well known CSS frameworks that can help you make a responsive website without much trouble. Here are a couple:
But let’s not underestimate the power of modern CSS, which provides some easy yet powerful ways to make responsive websites without using a 3rd party framework. I personally feel that even if you prefer using a framework, you should be comfortable in using Grid/Flexbox, which form the crux of the CSS way of doing responsive websites without relying on an external library, to make websites.
Backend development is the other side of the coin that we call full-stack development. If you have no idea about backend development, this article may be a good place to start.
Once you’ve learned the fundamentals of NodeJS, definitely consider learning ExpressJS, a lightweight routing and middleware framework built upon Node. This combo is sufficient to be a skilled developer, however, you may consider learning other frameworks and technologies built to work with Node. I’ll list two of these to help you get started:
Am I Full-Stack Yet?
Next, let’s talk about hybrid and cross-platform apps.
Without further ado, here’s a list of such technologies:
Back when I first wrote this article, I was a big fan of MeteorJS. I don’t do much full stack dev anymore, and this landscape has changed significantly, so at this point I kinda recommend React Native a little more. As always, the choice is yours!
Are Frameworks all I Need to Know About?
Yes and no.
Yes because you can whip up a lot of crazy cool stuff with the knowledge you already have. And without doubt you are a full-stack developer at this point. So in a crude sense, you know all you need to know to make stuff.
I’ll go over some of these real quick.
This is almost synonymous with Git and services like GitHub. And without doubt you should have mastery over these technologies if you intend to continue as a developer. However, other options exist. Two of those are:
These often-overlooked tools help you quickly install and manage the packages and libraries your project needs. Most of you may know NPM — the famous Node Package Manager. However, again, other options exist.
- Yarn is a package manager that is quickly gaining traction because of its speed and a few other advantages over NPM.
- Bower is another package manager for the web.
In the JS land (and in quite a few other areas as well), package managers often do a lot more than just install dependencies. For example, NPM lets you do a security audit of the packages your project depends upon using
npm audit, and it’ll also conveniently fix any security concerns that can be fixed without introducing breaking changes if you invoke it as
npm audit fix. Another neat feature of NPM is NPM scripts, which are so cool that I wrote an entire article about them. Check it out!
Since package managers are central to your JS project, and because they come with such neat features, it is worthwhile to spend some time learning about their capabilities and identifying things that might help you.
I didn’t want to have too many of these subsections, so here’s a quick list of tools that you will eventually have to get familiar with:
- Webpack — a bundler for your applications that has gained a lot of popularity in recent times
Deploying Your Application
One final topic that I’d like to briefly go over here is how to get your applications online. Again, lets make this quick. This article isn’t a place to explain the different classifications of cloud services, but I’ll tell you that you’re probably looking for something called a “Platform-as-a-Service (PaaS)” in order to deploy your application online. PaaS offerings take care of low level things like configuring/maintaining the underlying infrastructure of your server (such as the OS, the network, services that run on it, etc) and allow you to focus on the parts that you should focus on - deploying your application with the configuration and architecture that suits your needs. There is a massive catalogue of such services available to that cover all kinds of ground - from general PaaS systems to niche systems for things like IoT to PaaS systems deployed on private clouds to a lot more. When I started, I started with Heroku, which, in addition to being an established company in this space, also lets you host 5 projects for free!
In the area of cloud technologies and deploying applications to them, you might have heard about buzzwords like AWS (Amazon Web Services) and GCP (Google Cloud Platform). These are Infrastructure-as-a-Platform offerings which place a much greater burden on you. While an application of sufficient complexity or performance requirements might benefit from being directly deployed on something like AWS, it is many levels more difficult to deploy on an IaaS than a PaaS. With PaaS offerings gaining maturity and offering an almost bloated featureset, you probably won’t need to look at IaaS systems for your apps for a long time.
However, there were situations where I found it quite difficult to deploy to Heroku (and ended up spending tens of hours refactoring the system I was working on to make it fit there). So allow me to pitch another lovely PaaS to you - Platform.sh. Not only does Platform.sh give you a lot more control over your build processes and more freedom to do things as you wish, but they also have a lovely local development experience. For me, the biggest selling point is the Git driven workflow that let’s you manage entire copies of your application via git, so you can have a git branch representing your production system, and other live applications built from your dev or staging branches. In fact, you can also build Pull Requests on Platform.sh, so you have a live copy of your system built using the codebase of the pull request, that you can happily test against before you merge it! Sweet huh?
If you think I’m a little too obsessed with Platform.sh, you’re probably correct. After all, I work here as a Cloud Engineer! :D
A Minimal But Complete Full-Stack JS Developer
I’ve name-dropped way too many frameworks and libraries and other buzzwords in this article, and you’re probably a little overwhelmed. So in this section, I’ll present to you what I consider a minimal full-stack JS dev. This may be a little opinionated, but if you’ve come this far, you already know a bunch of alternatives! ;)
So what does our minimal full stack JS dev look like? He/she can:
- Spin up a responsive, mobile friendly website that fetches content via API calls using the good ol' trio of HTML, CSS and JS (Flexbox/grid to make it responsive).
- Build a web app using ReactJS in a development environment where babel/webpack are conveniently leveraged to compile the react app.
- Write an API that uses ExpressJS over Node, with MongoDB as a database.
- Correctly use git to version control projects, and present a clean commit history and a good git workflow.
- Deploy the application on a PaaS like Heroku or Platform.sh.
Yep. That’s it. That’s all you need. Now fire up your favourite editor and start mashing the keyboard!
That was a lot of information, wasn’t it? Take your time and gradually get familiar with the tools and frameworks you like. I know there is a lot more that can be added to this article, but I tried to limit each list to 2–3 entries for the sake of brevity. I’d appreciate comments adding to the article or the lists.
Good luck and Happy Coding! :)