The Toolkit of a Full-Stack JavaScript Developer
Update (19 Sep, 2020)
I finally have my own website! I’ve moved all my articles over to ajmalsiddiqui.me/blog and in the process of doing so, I realised that I have grown tremendously since I wrote these articles. Hence I’ll be updating the articles to reflect what I’ve learned, fix any mistakes, and improve quality as much as I can. But all these updates will primarily be on my website, so please read this article there. Ciao!
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.
A full-stack JavaScript developer is exactly what it sounds like — a full stack dev who uses JavaScript. Duh.
Most of you may know how JavaScript is used at the client-side. A slightly smaller number may be aware of NodeJS, a server-side framework in JavaScript. While being comfortable with client-side JS and NodeJS for the server-side is enough to be called a full-stack developer, there is a lot more that goes into being a truly capable full-stack dev armed to the teeth with the latest technologies and tools to make stunning applications and deploy them online.
Before we go any further, note that the frameworks and technologies I have enumerated upon here are a few of many options available to you. Take your time to explore the limitless world of possibilities that JavaScript has to offer.
Without further ado, let’s dive in and take a look at what a full-stack developer may use to achieve the incredible.
Front-end Technologies
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 surprise 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.
Lets look at a couple of CSS frameworks you can use to quickly make good-looking responsive websites:
Once you’re comfortable with JavaScript, you should definitely invest time in learning jQuery. Also, you should be comfortable with using AJAX for making API calls.
Moving on to the fun stuff. Consider learning at least one of these JavaScript frameworks thoroughly:
Backend Technologies
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.
You may be aware of many technologies and frameworks used for backend dev, but since this article relates to JavaScript, lets talk about the bad boy for backend in the JS world — NodeJS.
The popularity of NodeJS is certainly not a surprise given it’s sheer versatility and community support. Add to this the huge amount of frameworks built on top of Node, and you can see why JavaScript technologies have created a complete ecosystem of their own in this area.
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?
You’ve made it quite far, and you sure can call yourself a full-stack developer. But is the journey over? Nah. It only gets more exciting from here as you learn about the full extent of the power of JavaScript.
For starters, consider ElectronJS, a framework to build desktop applications using JavaScript. Bet you didn’t see that coming, did you?
Next, let’s talk about hybrid and cross-platform apps.
Imagine an ideal universe where you could plug in your JavaScript skills into everything — websites, desktop apps, and even apps for smartphones. Crazy right? When I first learned about these mysterious JavaScript frameworks that could make Android or iOS apps, I was beyond excited. Turns out these mysterious frameworks aren’t very mysterious after all. In fact, they are quite intuitive and use JavaScript in more or less the same way that you’re used to.
Without further ado, here’s a list of such technologies:
- PhoneGap
- Cordova
- React Native (thanks to Madhav Bahl for adding this)
- MeteorJS
As I’ve mentioned in the Getting Started with Backend article, I personally love MeteorJS and its capabilities. I would definitely recommend this to any developer enthusiastic about JavaScript.
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.
But there’s another aspect of being a developer designed to make your life and the lives of people you work with easier. A set of tools and technologies that can potentially save you hours of frustration and hair pulling.
I’ll go over some of these real quick.
Version Control
This is almost synonymous with Git and 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:
Package Managers
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.
Other Tools
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:
- Babel — a “transpiler” for JavaScript that lets you compile code into a format compatible with your target browsers
- Webpack — a bundler for your applications that has gained a lot of popularity in recent times
Deployment Options
One final topic that I’d like to briefly go over here is how to get your applications online. Again, lets make this quick. These are some of the popular server-as-a-service options that you will want to use in order to get a your app out in the open:
Concluding Words
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.
One last thing: check out this excellent article on the top JS trends to watch out for. I personally found this to be a good complement to the article you just read.
