Chabulsqu/react-challenge

A classic Contact/Appointment App made for the Codecademy Front-end Engineering Path

Codecademy - React Challenge

This is a solution to the Codecademy React Challenge Project. If you want to run it on your own computer rather than on the netlify website listed below, you must use npm start (for the development build) or npm run build (for the production build). You can also use yarn (yarn start and yarn run build) if you prefer. This project is made using the React Router 5.2 version, and will probably be updated in a later release.

Table of contents

• The challenge
• Screenshot
• Links
• My process
  • Built with
  • What I learned
  • Useful resources
• Author

Overview

The project was pretty easy to do for me, so I added a couple of features that weren't included in the original project, I list them below.

The Project

** Original Requirements ** Users should be able to:

• Save contacts
• See a warning when saving two contacts with the same name
• See Appointments
• Get different components rendered depending on the URL

** Added features *** Users should be able to:

• View saved Contacts and Appointments after closing the page thanks to LocalStorage
• Delete Contacts and Appointments

Screenshot

Links

• Live Site URL: View on Netlify

Built with

• HTML5 markup
• React - JS library
• React Router

What I learned

I had very few difficulties when using React for this project, but I liked being able to use Window.sessionStorage to save forms when changing URLs, it took me a bit of time to find the way to include state in Window.localStorage but it made me more confident using both of these features.

Useful resources

• MDN - Mozilla Developer Network

Author

• Twitter - @mateo_fain
• Dev.to - @Chabulsqu