INTRO TO REACT - PART 2: Building a Demo App

We will continue our ‘INTRO TO REACT’ series by building a demo app using React and Firebase.

You can find the source code for the completed project here:

https://github.com/gojutin/buzzwords

A couple notes about this project:

1. This demo is a work-in-progress and may change between now and the next Meetup. All changes will be reflected on GitHub as they occur.

2. If you have experience with React, you will probably notice that the components are a bit bloated and leave room for improvement. This was done intentionally as a segue to the next Meetup, where we will be refactoring the code and implementing Redux for state management. If you feel that any of the code is written in error or exhibits bad practices, please feel free to drop me a line or fork the project with your recommended changes.

Please feel free to bring your laptops if you would like to follow along. You will want to have Node.js installed on your computer along with the Chrome browser and your code editor of choice.

CORRECTION FROM LAST MEETUP

During the last Meetup, I mistakenly stated that React fires the render() method of all components any time any component’s state or props changes. In fact, the render() method is only fired on any components that are affected by the change along with their children. Thanks to Scott DeVito and Michael A for pointing this out.

While this may seem like a minor technical detail, there are certain optimization opportunities that could be overlooked with an assumption that all components’ render methods will fire regardless of a change.