Skip to content

README.md

Latest commit

 

History

History
26 lines (18 loc) · 1.72 KB

README.md

File metadata and controls

26 lines (18 loc) · 1.72 KB
Raw

Custom Components and Props Practice

Overview

This project is designed to help you practice building React components and passing props. You will create a simple app with two custom components that each accept at least 2 props.

Instructions

  1. Open up your favorite code editor (e.g., VSCode), and clone this repository: git clone https://github.com/chaser164/react-props-pset
  2. From the VSCode command line, in the root directory of the cloned repository, call npm install to ensure all dependencies are ready to go.
  3. Call npm run dev and then navigate to the displayed localhost URL to see what this project looks like so far.
  4. Using CustomButton.jsx and CustomButton.css as inspiration, make 3 additional custom components (i.e. 3 additional .jsx files and 3 additional .css files).
  5. In each custom component, accept at least 2 props and use them to influence the components' behaviors in meaningfuls ways.
  6. Import and call the 3 components inside App.jsx.
  7. Ensure everything is working accordingly by re-running npm run dev.

Submission

Please make a screen recording through Zoom or any other screen-recording application of your choice. Walk us through both the code you wrote for this project as well as the visual output. Upload this video walkthrough to a video sharing service of your choice (unlisted YouTube video, Google Drive, etc.) and submit the share link here. This is all you have to do for the submission!

Example Props Ideas:

  • Text content and background color for a card.
  • A name and age for a user profile component.
  • URL prop that embeds a link.

Happy coding!