A desktop application for creating travel plans for work or vacations with friends, registering activities, adding important links, and inviting new participants. This project was developed during Rocketseat's NLW event in the React track.
- React
- TypeScript
- Tailwind
- Zod
- React Hook Form
- Create a trip
- Add guests
- Add activities to the trip
- Add important links to the trip
- Add more guests to the trip
- Update trip destination and date
To run the Planner application locally, follow these steps.
To run the application, you need to clone the backend repository as well. You can find the backend repository at the following link:
git clone https://github.com/ssoaresleo/nlw-journey-rocketseatBefore running the application, you need to set up both the frontend and backend environments:
Download the frontend source code.
- Clone the repo
git clone https://github.com/ssoaresleo/nlw-plann-er-web
- Install NPM packages
npm install
- Start the development server to run the application in development mode.
npm run dev
Assuming you have already cloned the backend repository, follow these steps to set it up.
- Install NPM packages
npm install
- Start the backend using Docker
docker-compose up
Here are some examples of how to use the application after configuration
To create a trip, the first step is to choose the destination, start date, and end date of the trip. This information helps in organizing and planning the itinerary effectively.
In this step, you can enter multiple email addresses of people you want to invite to join the trip. They will receive invitations to collaborate and plan together.
Confirm the trip details by providing the owner's name and email address for final confirmation. The owner will receive an email to confirm the creation of the trip. After confirmation, they will be redirected to a screen displaying trip details. Confirmation emails will also be sent to participants, informing them about the trip.
Note: Confirmation emails for participants will appear in the terminal of the backend.
Here is an example of the Trip Details screen, where users can view all the information related to a specific trip. This screen typically includes details such as destination, dates, invited guests, activities planned, and important links.
Here is an example of the Participant Confirmation screen. When invited to join a trip, participants receive an email with a link to confirm their participation.
This section demonstrates how participants interact with the invitation confirmation process in your application.
Distributed under the MIT License. See LICENSE for more information.
