Learn React: Start of a Frontend Dev Journey

Hello! Welcome to the first article in a series of tutorials that will focus on learning React.js. This is a weekly series, and after this brief introduction, will center around building a to-do list application from scratch. I chose a to-do list as it includes all the foundational application building blocks needed in a basic CRUD application.

Before getting into what React is, here are some recommended prerequisites, as defined by Google:

Programming concepts include functions, objects, arrays, and classes. Working knowledge of JavaScript. Familiarity with HTML and CSS. An understanding of the DOM. When I learned React, I was a master of exactly none of these topics. I don’t want to mislead anyone though, I was at Codesmith and learned React in the structured school environment. By this time, I studied algorithms and basic data structures for about five months and had a fledgling knowledge of the DOM and HTTP requests. My HTML was meh at best and my CSS was a disaster. Absolutely no divs were centered before this time period.

One last word from the wise(ish): The more working knowledge you have prior to exploring React, the more ease you may find with this, but no one can define what learning will look like for you. Many articles and video tutorials say “learning React is easy” but that is in comparison to heavier frontend libraries and frameworks. “Easy” was not my experience. Don’t be discouraged if it isn’t yours either. I’m happy you’re here and I hope you stay! Now, shall we?

What Is React? Facebook developer Jordan Walke created the React.js frontend JavaScript library, as a way to help developers build user interfaces with components. A library is a collection of prewritten functions and code that reduce development time and provide popular solutions for common problems.

Inspired by XHP (an HTML component library for PHP), React was first deployed on Facebook’s news feed in 2011 followed by Instagram in 2012. The library was open sourced at JSConf US in May of 2013.

React is open source, meaning it is completely free to access. Developers are encouraged to modify and enhance the library.

React adheres to the declarative programming paradigm. Developers design views for each state of an application and React updates and renders components when data changes.

Why Learn React? Read more about the blog in-depth here.