Intro to ReactJS Course Project: Building a Photo Gallery

Intro to ReactJS Course Project: Building a Photo Gallery - student project

I implemented this project as part of Travis Arnold's "Intro to React: Building a Gallery" course. I created it on the CodePen platform, which led to a few restrictions which Travis didn't have in his demo.

First, CodePen only lets us pull libraries from a Content Delivery Network (CDN), not from NPM. I couldn't find the React-Emotions library on a CDN, unfortunately. To compensate for this, I implemented all of the component styles as simple style objects within the components themselves.

Second, a simple CodePen Pen only gives the author one JavaScript file, so I placed all of my JavaScript in this single file. Though I could have used a CodePen Project to gain additional JavaScript files, I didn't think that small gain would be worth the extra complexity.

Finally - and this wasn't a restriction from using CodePen - I found it easier to implement the thumbnail styling using CSS Flexbox instead of CSS Grid.

I enjoyed Travis's course and learning a bit more about ReactJS.

 

Brent Miller
Web Designer & Developer
Teacher