💻 PROJECT NAME ✨ => 💻 SpaceX Data App : Capsules dataGrid search & Authentication System

Welcome to my SpaceX Data React App! This application allows users to explore SpaceX rockets or capsule data in a user-friendly interface.

---

🔗 Profile Links✨

Resume	Github	Linkedin	Portfolio	Blogger	Medium

---

💫Tech-Stack->

• For Frontend:-

  • HTML5
  • CSS3  - JavaScript 
  • ReactJS
  • Redux

• For Backend:-

  • NodeJS
  • ExpressJS - MongoDB 

• For deploy database:-

  • Vercel  

• For Styling:-

  • TailwindCss

• For live Project: -

  • Vercel

---

⭕Steps to run our project:

✨Clone the repository.

✨Run the command npm install in both the frontend and backend folders.

✨Run the command npm run dev in the backend folder.

✨Run the command npm start in the frontend folder on localhost:3000.

---

⭕ Description

The SpaceX Data React App is a front-end application built using React. It fetches and displays data from SpaceX through a RESTful API. The backend is implemented with Nodejs for authorization.

Features✨:-

• Modern landing page with three main sections: Banner, search form, and data grid.
• Fully functional search form with three search filters.
• Elegant and responsive design for all screen sizes and browsers.
• Optimized queries for quick data retrieval.
• Pagination for the data grid.
• Popup to display detailed item data on item click.
• Authentication - signup, login, logout, private route for landing page
• good UI with animated CSS

---

Package.json(Dependency)✨:-

Serial No	Backend	Frontend
1	nodemon ,bcrypt	tailwindcss
2	mongoose ,swagger-jsdoc	React Router dom
3	cors , swagger-ui-express	redux , react-icons
4	dotenv,express	react-redux , react-thunk
6	body-parser	react-toastify , react
7	jsonwebtoken	react-hot-toast , axios

---

⭕ Usage

Explore the SpaceX data by interacting with the search form and viewing the data grid. Click on items in the grid to see detailed information in the popup.

⭕ Swagger Documentation

Explore the Swagger documentation for the backend REST API here.

⭕ Testing

For backend testing, you can use tools like Postman. Ensure that the backend is running and test the API endpoints.23

Contributing

 💻 Contributions are welcome! Please follow the standard guidelines for contributing.

---

✨Thank You✨