✏ ABL - always be learning
It's that time of year again. Resolutions are made - and broken before the first week is out. I never need motivation to open my editor and just code away, coding keeps me sane and healthy (although I often feel that I'm constantly on the brink of burnout), but I struggle with keeping focus on one topic. To minimise the chances of that happening, I've decided to commit to a #100DaysOf... challenge:
I want to learn the MERN stack.
This is no tutorial or guide, it's a documentation of my personal learning process and will serve as my notebook in the future, when I need to look things up again.
Where I'm starting from
I used the holidays to dive into the course. It started off with building the front end, and the pace was perfect. I confidently coded along, understanding every single line I wrote. When it came to the back end, stuff got a little bumpier. It's not that you don't get any explanations along with the code, the course just isn't aimed at complete beginners like me.
I had made GET requests before and know how to fetch data from a server, but to be entirely honest, it always feels a bit like an accident when I make it work. And I certainly have never set up a server, so I was more and more just copying the code from the tutorial video. By the time we included the database and installed Postman, I wasn't even 100% sure what I'm installing that for, so I thought that it makes no sense to continue unless I catch up with the tools involved.
Why I want to learn this
I recently wrote a short tutorial series on " How to build a Guitar with React", but couldn't include all the functionality that I wanted. I'd like a user to have access to a chord database, and give them the possibility to save custom chords. I've formerly half-"solved" that by throwing the entire chord data JSON file at the client, but that's probably not how you want to do it. I've also no clue how to build a back end that allows user registration.
By the end of this challenge, I want to be able to
- set up and configure a server
- include user registration
- build/connect to a database
- deploy a full-stack app
"Being able to..." means that I know what I'm doing when I'm doing it. That I don't have to look up every step, and that I understand what each step is for. It does not mean that I can showcase one project where I "prove" that I'm proficient in the above.
Well, the very first thing I'll have to do to achieve that goal is... start 🚀
✏ What is the MERN stack?
In (very) short - the MERN stack is a combination of four technologies to deploy full-stack web applications:
- M: MongoDB - a noSQL (non-relational) database, where the data is stored in documents as key-value pairs (JSON format)
- E: Express - a Node.js framework that simplifies writing server code
Some articles I found helpful, with further information:
I'm going to start with Node.js, as that seems to be the most basic. Why is it even called MERN, when the order of importance implies that it should be called NERM? There's no Express without Node. You rarely need a database in a web application if you don't have a front end.
My guess is that it's because MERN is "the stack formerly/still known as MEAN", and MEAN sounds more badass than NEAM. But anyway.
I think I have those covered (love that they included "semicolons" in the list, but I'm not sure yet why that should be so important). What else?
The following concepts are also key to understand asynchronous programming, which is one fundamental part of Node.js:
The air already gets thinner. I'll have to read up again on some of those along the way.
Installation & getting started
Download from https://nodejs.org/en/ and installation are pretty straightforward. It's been a while since I installed it, but I think I just clicked through the dialogue and left everything on default.
node myscript.js // alternatively, leave out the file extension: node myscript
You can also just type
document or a
window object, Node.js has a
global object with a lot of familiar methods like
setTimeout, which you can inspect by typing
global. followed by a
To exit, type
.exit (or press
- what technologies are involved in the MERN stack
- how to install Node.js
- how to use Node.js in the terminal
- how to run a .js file from the terminal
- what is npm?
- what is a package.json?
✏ Thanks for reading!
I do my best to thoroughly research the things I learn, but if you find any errors or have additions, please leave a comment below, or @ me on Twitter. If you liked this post, I invite you to subsribe to my newsletter. Until next time 👋