Logo / QR code

How I’ve Built My First React Application I

Part 1: Introduction

This is the first article of my "How I’ve Built My First React Application" series, showing the steps I’ve taken, in trying to build an isomorphic voting application using React. All the code is available at my GitHub repo: question-it.


It all started about 6 months ago. I was using Free Code Camp to learn all there is to know about front-end development. That’s also where I first learned about React. Until this point, I’ve completed FCC challenges like a maniac, eager to learn more. Sadly, their curriculum for React was not complete at the time, forcing me to drive straight ahead into the projects section. I started learning by doing.

Free Code Camp Banner

I loved it. It was a bit verbose, and yet, so simple and easy to understand (unlike Angular, where I still have no clue what the difference between factories and services). The lifecycle methods felt very familiar, thanks to my Android background, and I liked the idea of writing HTML using JavaScript. The fact that React also supports server-side rendering, and can be used to create isomorphic applications (wait, what?), only made me more interested and curious.

But I still had more to learn. FCC’s React projects were great, but not complex enough to fully grasp React, they usually required a simple components tree. Questions like “How can two non-related components can pass messages?”, “How can I create Single Page Applications using React?”, and “How to integrate data fetching with React?”, didn’t even come to mind. So when I finally reached the first FCC’s full stack project, using React was the obvious choice.

Build a Voting App

That was the project’s title. The assignment was to build a voting application: every visitor can view polls created by users. You would have to register to create a poll or vote for one. That was pretty much it, basic and simple. You could choose any library or framework, and any back-end environment. The only requirement is to implement the mentioned use cases.

As I said, I decided to use React. I’ve never planned to do more than I’ve been asked for, it just happened. This simple project takes me six months to complete (not working full-time).

While working on it, I asked myself the same questions I mentioned earlier, so I explored the various “answers”. Given each question, I finally decided to answer with the “React-ive” option, and by that, I mean the answer that fits better with React or should fit better.

"Question It" app preview
Do you?

In this next series of articles, I’m going to show how I’ve created my Isomorphic “React-ive” Voting Application: Question-It.

From building through data fetching all the way to making it isomorphic. This is: How I’ve Built My First React Application.

Next: How I’ve Built My First React Application II