Space-Travelers-Hub

In this project, we will be working with the real live data from the SpaceX API. Our task is to build a web application for a company that provides commercial and scientific space travel services. The application will allow users to book rockets and join selected space missions.

MIT License

Stars
23

Space Travelers' Hub

Desktop View Representation

📗 Table of Contents

📖 [Space-Travelers-Hub]

[Space Travelers' Hub] In this project, we will work with actual live data from the SpaceX API. our task is to build a web application for a company that provides commercial and scientific space travel services. The application will allow users to book rockets and join selected space missions.

🛠 Built With

Tech Stack

Key Features

  • [Responsive layout]
  • [UX/UI accessibility]
  • [Dynamic data]

🚀 Live Demo

💻 Getting Started

To get a local copy up and running, follow these steps:

Prerequisites

In order to run this project you need:

  • A browser of you choice.
  • A text editor of your choice.
  • An installed node.js on your local system

Setup

Clone this repository to your desired folder:

  • Use the following Commands:

    cd your-desired-folder
    git clone [email protected]:ab-noori/Space-Travelers-Hub.git
    

Install

  • Install this project with:

     npx create-react-app my-app
     cd my-app
     npm start
    

Usage

  • Use the following commands to run the project on your local system:

    npm run build
    npm run deploy
    

Run tests

  • Run the following script and style test:

    npx eslint "**/*.{js,jsx}"
    npx eslint "**/*.{js,jsx}" --fix
    
    npx stylelint "**/*.{css,scss}"
    npx stylelint "**/*.{css,scss}" --fix
    

Deployment

  • 1- install gh-pages with following command:

    npm i -D gh-pages
    
  • 2- Add homepage to project's jason file:

    "homepage": "https://ab-noori.github.io/Space-Travelers-Hub",
    
  • 3- Add the following scripts to the package.jason file:

    "predeploy": "npm run build",
    "deploy": "gh-pages -d build ",
    
  • 4- Finally run the following command:

    npm run deploy
    

👥 Authors

👤 Abdul Ali Noori

👤 Dennis Owusu Prahi

🔭 Future Features

  • [fetched data from api into redux store]
  • [Used redux toolkit]
  • [Applied conditional rendering of component]

🤝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

⭐️ Show your support

If you like this project, give it a star.

🙏 Acknowledgments

I would like to thank Microverse and my coding partners. Also, I want to give credit to Nerd's lesson YouTub Channel, its react tutorial is really helpful.

❓ FAQ (OPTIONAL)

  • How to make it mobile friendly?

    • Put a viewport tag in the header
  • How to design the site?

    • Draw a mockup before starting to code

📝 License

This project is MIT licensed.

Related Projects