In this exercise, the goal is to learn routing and forms in react:
- routing,
- forms
- Fork this repo
- Clone this repo
Whenever you create a first significant change, you should make your first commit.
- Follow these guidelines to add, commit and push changes.
In the end of this document, you will find guidelines on how to submit the exercise.
In this lab we will try to work with routing in react and also try to use basic forms. The main idea of this lab is to store down the trip details of the form and display it. We have three components
- HomeComponent
- AddTripComponent
- ListComponent
Path to Components
- / -> HomeComponent
- /add -> AddComponent
- /list -> ListComponent
s3://facenow/l5-homecomponent.png
The entire application looks like this
Create a home component and design it as per the screenshot shown below. The home button should display the home component and and also the total trips.
When you click the add trip button, You should display a form with with the following fields
- date
- place
- type
- trek
- tropic
- club
The data can be stored in an array
Render the list of all the places with time and date
Based on the selection filter out the particular type of trips.
If you didn't add, commit and push the changes you made, this is the last call. 😄
please share your github links with your Mentors. Your Mentor's will check up your work and provide feedback.
If you managed to do it, good job! 🏆
We are proud of you!
Happy Coding ProGrad ❤️!