Thanks!

[coderschoolreview]

Hello! Thank you for submitting the first homework for CoderSchool React Class 🎉! The main focus of this assignment was to introduce you to working with an API, rendering items in a collection, and dealing with state and props.

Also, thanks for creating a nice README.md with the checkboxes. It makes it a lot easier to understand the functionality of your app.

Great ✨

• Great work to keep the code clean and pretty. It is important to write code that easy to read and understand or other people, or even yourself.
• Good job fetching the data in App.js. Usually it's recommended to do this is in componentDidMount. The official Facebook React Native example does this as well. (React and React Native have the same convention here.)
• Cool job using Material UI library. It's nice to use a CSS Framework because you can build off base styles easily and quickly.
• Remember to not keep any component too long! You did a good job splitting up into MovieList | MovieCard. There may be another opportunity to split some logic code inside App.js up further into more components such as NavigationBar
• You did a great thing to reuse fetchMovies() and distinguish the url to fetch movies with different types and titles. Reusing code is very cool and important, keep it up!

Not so great yet 🚩

• Great job toggling between Now Playing and Top Rated movies by storing type in App'sstate, but it'll be better if you could store the current page of each type in the state, instead of calling this.fetchMovies(1) to get the first page every time you toggleType(). I suggest that you save the current page of each type in another key into state, something like:

  // State structure
  {
  "types": {
   "now_playing": {
     "name": "Now Playing",
     "page": 1
   },
   "top_rated": {
     "name": "Top Rated",
     "page": 1
   }
  },
  "currentType": "now_playing"
  }

  Remember to keep the level high of state tree upto 3. You should keep the state tree as flat as possible.

• You'll be able to finish the story User sees an error message when there is a network error. by using try/catch block that wrap up your async/await function. Try to read this document about Error handling with async/await

[kiendt07]

My bad. This is the restyling.

Not so great yet 🚩

• Great job toggling between Now Playing and Top Rated movies by storing type in App'sstate, but it'll be better if you could store the current page of each type in the state, instead of calling this.fetchMovies(1) to get the first page every time you toggleType(). I suggest that you save the current page of each type in another key into state, something like:

  // State structure
  {
  "types": {
   "now_playing": {
     "name": "Now Playing",
     "page": 1
   },
   "top_rated": {
     "name": "Top Rated",
     "page": 1
   }
  },
  "currentType": "now_playing"
  }

  Remember to keep the level high of state tree upto 3. You should keep the state tree as flat as possible.

• You'll be able to finish the story User sees an error message when there is a network error. by using try/catch block that wrap up your async/await function. Try to read this document about Error handling with async/await