Event Navigator

Inspiration

The Event Navigator project was inspired by the need for a simple yet effective way to organize and view events. In today's fast-paced world, people often miss out on events because of poor organization or lack of information. I wanted to create an app that allows users to easily access and view events in a clean, user-friendly interface. Additionally, the project was a great opportunity to practice full-stack development, combining my knowledge of React for the frontend and Express.js with MongoDB for the backend.

What I Learned

Throughout the development of this project, I learned several important concepts:

• React: I gained deeper knowledge of React, including how to manage state with useState and handle side effects with useEffect. I also learned how to structure components and pass data between them.
• Express.js: I became more comfortable working with Express to build RESTful APIs. I learned how to set up routes, handle HTTP requests, and interact with a MongoDB database using Mongoose.
• MongoDB: I became more comfortable working with MongoDB, and I learned how to set up a database, define schemas, and perform CRUD operations using Mongoose.
• CORS: I encountered CORS issues while connecting the frontend and backend, which helped me understand how to configure cross-origin resource sharing in a secure and efficient way.
• API Requests: I became more proficient with making HTTP requests using Axios to fetch data from the backend and display it on the frontend.

Challenges I Faced

• CORS Issues: One of the major challenges I faced was dealing with CORS issues when trying to make requests from the frontend to the backend. After some research, I resolved this by using the cors middleware in Express.

• Frontend-Backend Integration: Initially, I had trouble ensuring that the frontend was properly receiving data from the backend. This was due to a combination of CORS issues and some misconfigurations in my Axios requests.

What’s Next

-Add new events to the database via a POST request (backend functionality implemented and connecting it to the frontend is under working ) -Deploy frontend

Built With

• cors
• css
• express.js
• mongodb
• mongoose
• node.js
• react