Skip to content

PaolaSantolloV/react-apprenticeship-capstone-2

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

2 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

React Intermediate Challenge 2 - Styles, Fetching API, Testing.

For this challenge, you will create an awesome React App which fetches the "Picture of the day" from the NASA open APOD API.

Instructions

Create an app from scratch, consider your best UX knowledge for the UI design; it is up to you. Set up eslint and prettier.

Recommendations We recommend you consider the following elements that should contain the app:

  • Title
  • Date Picker
  • Main section with the image

Requisites

  • Don't use UI Libraries. You have to build your styles. You can use styled-components such as SASS, LESS, or CSS. You are free to use the approach that makes sense to you.
  • Fetch API Calls from the NASA APOD using your API KEY.
  • Publish your app using free services such as Github pages, Netflify, or Heroku.
  • Share the URL on the PR.
  • Use the React Testing Library and Jest tools to add tests.
  • Use functional components and React Hooks as possible.

Completing the Challenge

Follow these steps to complete this challenge:

  1. Create a new branch with the name challenge-2 from this repository.
  2. Complete all the Acceptance Criteria (AC).

Resources.

Acceptance Criteria (AC) and Score

Acceptance Criteria Description Points for Completed Points for Automated
1 When the user enters the app, the app should show the Picture of the Day. 10 10
2 When the user selects a specific date with the format YYYY-MM-DD, the app should show the picture of the day for the given date. 20 n/a
3 The app should be responsive. 20 n/a
4 When the app fetches the API, and there is an unexpected error, the app should show a message: "There was an error, please try again." 20 n/a
5 When the user selects an invalid date value and clicks on the show button, the app should show a message error from the API response. 20 n/a

Bonus

The bonus is a plus that helps us know you better and increments your final score.

  • Automated Test for Second AC: 10 points.
  • Automated Test for Third AC: 10 points.
  • Automated Test for Fourth AC: 10 points.
  • Automated Test for Fifth AC: 10 points.
  • The app is responsive: 20 points.

Questions?

If you have any questions about this challenge, feel free to ask on the Slack channel ASAP.

About

React capstone project2

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 41.5%
  • HTML 38.0%
  • CSS 20.5%