The All-React App

Now the React page. Here are the features I created:

  • 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 we had 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 of tickets ...

Get Modern Front-End Development for Rails now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.