Build an Instagram Post component to practice building reusable components
JavaScript HTML CSS
Switch branches/tags
Nothing to show
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.


Your challenge is to create a simple Instagram post component that can be reused to contain any photo and caption.



Working Requirements

  • Build out the components necessary to display a single Instagram post with: an image, an author, the number of likes, a description and comments.

Getting Started

This lab is an opportunity for you to practice following F.I.R.S.T. as well as building reusable components from the Reusable Components Lesson and the process outlined in Thinking In React. We suggest starting with Thinking In React, following along with the process outlined in the article while working on the mock for an Instagram post (above). Once you do that, revisit the Reusable Components lesson to see if you can refactor your Instagram post to use atoms, molecules and organisms (hint: you can).


Fork this repository and clone it down. Submit your pull request by the end of the lab block.


Take a moment to re-familiarize yourself with the plagiarism policy, specifically on using work you find online and on work you do with other students.

We give assignments like this to give you the opportunity to review the material in class in a practical manner. By building something using what you've learned in class, you'll be reviewing the material and gaining a deeper understanding of it.

These assignments are similar to those you can expect when applying for a job, either in the form of a take-home coding challenge or an in-person technical interview. So it's important that you put in your best effort now and challenge yourself to do this assignment on your own.

If you are struggling with the material, that's alright! That's why you're here. First, try reviewing the previous lessons and exercises. Go easy on yourself, you're still learning! If you're still struggling after that, come to office hours and ask an instructor for help. They're here to help you!

Don't copy and paste from another source or another student or the solution branch. That's just going to put you at a disadvantage when you're interviewing for a job.