Skip to content

Instantly share code, notes, and snippets.

@jparciga
Last active July 16, 2021 14:17
Show Gist options
  • Save jparciga/8840555a3e7d4d6170c135ef07d65a9c to your computer and use it in GitHub Desktop.
Save jparciga/8840555a3e7d4d6170c135ef07d65a9c to your computer and use it in GitHub Desktop.
Mini-Challenge 1: Core Concepts and Styling

Mini-Challenge 1: Core Concepts and Styling

Before you start:

  1. Read carefully the instructions for the project, please make sure that you clearly understand all the requirements.
  2. Fork this repo. Please make sure that your new repo is publicly accesible.

NOTE: You should use the provided codebase only as a guide for structuring your application. Feel free to add, remove, or change anything if you consider it necessary.

The challenge:

  1. Create the UI layout for your app, it should include the following elements:
  • 1.1 Header: Similar to the one in our demo app. For now, the search field, theme toggle, login button, and other navigation links should be disabled, i.e., you only need to create the corresponding UI elements without the functionality.
  • 1.2 Content: The content view corresponding to the section that will be renderered (in this case, the Home View).
  1. Create the Home View and display the list of items from this mock file.
  2. Apply css styles to your components using the styled-components approach.

Acceptance Criteria

  • The header is rendered correctly.
  • A list of videos obtained from a mock file is displayed in the Home View.
  • CSS styles are applied correctly using the styled-components approach.

Bonus Points

  • No warnings or errors are logged in the browser console.
  • The UI is responsive
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment