📋 Table of Contents

1. 🤖 Introduction
2. ⚙️ Tech Stack
3. 🤸 Quick Start
4. 📸 Screenshots
5. 👤 Author

🤖 Introduction

A cutting-edge, fullstack open-source flight search application, developed using the MERN stack (MongoDB, Express, React, Node.js) with TypeScript for seamless performance and scalability.

If you find it helpful, don't forget to give it a ⭐️⭐️⭐️ to show your support. Fork this repo if you want to contribute ✨ and take this project to the next level!

⚙️ Tech Stack

This project was created using the following technologies.

• React.js ➛ JavaScript library that is used for building user interfaces specifically for single-page applications
• React Query ➛ A powerful data-fetching and state management library that simplifies server state management in React applications.
• Typescript ➛ A superset of JavaScript that adds static types, enhancing code quality, maintainability, and developer productivity by catching errors during development.
• Material UI ➛ A popular React UI framework that provides pre-designed components to help create responsive and accessible web applications.
• react-hot-toast ➛ A React library for displaying customizable, lightweight toast notifications, designed to improve user experience with non-intrusive feedback.
• axios ➛ A promise-based HTTP client that simplifies making requests to APIs and handling responses, with built-in support for interceptors, automatic JSON transformation, and error handling.
• react-icons ➛ A React library that provides a collection of customizable icons from popular icon sets, making it easy to include scalable, vector icons in your React applications.
• formik ➛ A popular library used for building forms in React, which simplifies form state management, validation, and error handling.
• yup ➛ A JavaScript schema validation library often used with Formik to provide validation schemas for form data.
• nprogress ➛ A lightweight JavaScript library that provides a progress bar effect for loading states, commonly used in navigation transitions.
• @mui/x-date-pickers ➛ A set of Material UI-based date and time pickers for React applications.
• express ➛ A minimal and flexible Node.js web application framework that provides robust features for web and mobile applications.
• express-async-handler ➛ A middleware wrapper for handling exceptions inside async express routes and passing them to the express error handlers.
• mongoose ➛ An Object Data Modeling (ODM) library for MongoDB and Node.js, providing a schema-based solution to model application data.
• dotenv ➛ A zero-dependency module that loads environment variables from a .env file into process.env, enabling secure configuration management.
• MongoDB - It provides a free cloud service to store MongoDB collections.

🤸 Quick Start

Follow these steps to set up the project locally on your machine.

Prerequisites

Make sure you have the following installed on your machine:

• Git
• Node.js
• npm (Node Package Manager)

Cloning the Repository

In order to run this project locally, simply fork and clone the repository or download as zip and unzip on your machine.

• Open the project in your prefered code editor.
• Go to terminal -> New terminal (If you are using VS code)
• Split your terminal into two (run the client on one terminal and the server on the other terminal)

In the first terminal

$ cd client
$ npm install (to install client-side dependencies)
$ npm run start (to start the client)

In the second terminal

• cd server and set environment variables in config.env under ./config
• Create your mongoDB connection url, which you'll use as your MONGO_URI
• Supply the following credentials

#  ---  config.env  ---

NODE_ENV = development
PORT = 5000
URI =http://localhost:3000

MONGO_URI = 

FLIGHTS_API_URL  = https://api.schiphol.nl/public-flights
FLIGHTS_APP_ID = 
FLIGHTS_APP_KEY = 

# --- Terminal ---

$ npm install (to install server-side dependencies)
$ npm run start (to start the server)

📸 Screenshots

---

👤 Author

• Github: @Muhammet-Yildiz
• Linkedin: @muhammet-yildiz
• Email: [email protected]