Idea: Introduction to React and JSX.
Background: https://reactjs.org/ and JSX In Depth
In this exercise you have to refactor an React App.
Step 1 (Get the Draft Movie-input-output up and running)
a) Download the file: movie-input-output.zip and unzip the file in your React folder.
b) Install the movie-input-output project (npm install).
c) Run the project (npm start).
You should see something like the following:
d) Review the project and try to understand the code!.
Step 1 (Refactor the React app)
e) the code is far from finished and it is now your job to transform the project into something similar to the following:
The following are missing:
1) A component: MoviePlot that can display the content of 'Plot' from the selected movie.
2) The Component: Poster always displays the same Poster image. See if you can make it show Poster for the selected movie from MovieList.
3) Bootstrap has been used, but no layout has been created yet. Use the Bootstrap grid to get the layout shown.
..........
Step 3 (Use theMovieDB)
f) Try to get information about movies from theMovieDB instead of the MOCK-MOVIES - the test data in the project (use axios, see pics example).
Congratulation! - React App is ... wow!
/ Henrik H
