A follow along React application from Stephen Grider's Modern React with Redux (2019) Udemy course, which can be found here
Pics app is mainly a searchbar demonstration app, where we learned how to implement a search feature, retrieve data from an API and to render the returned data on the screen using a modern layout. In this case the API was Unsplash API, the data was Unsplash images based on our search term, and the layout was CSS Grid to give the images a great repsonsive appearance.
- We looked further at application Component Design, including standard ways to create project folders and when to decide another component is required.
- Second look at how to use APIs in React in this course (first was the Geolocation API), in this case image data from the Unsplash API which can be found here: Unsplash API.
- Introduced to the 'this' issue in React, shown how to bind this within functions, and then walked through as to why arrow functions are suggested in React.
- Used the CSS Grid layout for a responsive image grid, and learned how to dynamically set some properties of the grid using React.
- An introduction to Axios as a preferred package to work with API's.
- And finally a very good introduction to the difficult topic of Ref or References in React, which we used to pull image data from the DOM then dynamically set grid row spans for the images to improve the layout.
- We used Semantic UI for the user interface and styling of the app.
- All my coding is done in the wonderful VS Code.
- If curious here is the Axios Package.
I may have passed the final Udacity Front End Developer NanoDegree project in time if I had taken this Stephen Grider course earlier. Many students in my cohort had done just that, and made easy work of the final React projects. But in hindsight, Udacity seems to no longer require that really messy React project any longer as a passing requirement, so I may have passed the new version of the NanoDegree. An interesting challenge would be to now take what I have learned here and maybe finish the Neighborhood Map React project after all?