Search⌘ K

The All-React App

Explore how to build a React application within a Rails framework by handling JSON data fetching, managing state with Redux, using ActionCable for real-time updates, and integrating CSS without additional libraries. This lesson helps you understand practical app implementation by connecting React components to Rails backend and asynchronous data streams.

We'll cover the following...

App features

Here are the features which we’ve created in our app:

  • The initial data for the page comes from an API call to the server that returns JSON.

  • Clicking a date in the calendar filter at the top of the page makes that date visible and other dates invisible, with the same logic and the same “Show All” button as before.

  • The search bar calls the server for search results and displays them in a modal window.

  • Clicking the “Make Favorites” button adds a concert to the list of favorites, clicking “Remove Favorites” takes it out of the list, and favorites animate in and out of that list.

  • The schedule page can receive ActionCable broadcasts when the user changes favorites in a different browser or with updates to the number ...