My Random Quote Machine with React

Finished until the viable condition with React, still want and will implement couple things when I’ll learn how. TODO:

  1. Loader
  2. Async function that will pre-load first few quotes when the app starts
  3. Touch swipe -up, -left, -right controls
  4. Clear up messy CSS and unnecessary dependencies

Feel free to leave your suggestions guys:
https://iiiked.github.io/quotemachine/

Cheers

Couldn’t you preload the first quotes using componentWillMount()?

I’m not sure I know how to do this right and need to research. Logic is following:

  1. Load pre-defined quote and pre-fetch couple quotes without re-rendering UI
  2. If user hits New button while pre-fetching, do not start new fetch and wait until fetched and re-render UI
  3. If user hits New button after pre-fetch and if Queue has at least 2 item, shift() Queue without fetching, otherwise shift() Queue and fetch next ones to the Queue

2 and 3 are easy, but I don’t know how to connect them with 1 in async manner

It goes in componentDidMount(). I explain how to use this lifecycle method along with fetch() here.