Space Traveler's Hub

📗 Table of Contents

• 📖 About the Project
  • 🛠 Built With
    • Tech Stack
    • Key Features
  • 🚀 Live Demo
• 💻 Getting Started
  • Setup
  • Prerequisites
  • Install
  • Usage
• 👥 Authors
• 🔭 Future Features
• 🤝 Contributing
• ⭐️ Show your support
• 🙏 Acknowledgements
• 📝 License

📖 About

Space Traveler's Hub is a web application for a company that provides commercial and scientific space travel services. The application will allow users/scientists to book rockets and join selected space missions. The Space Travelers' Hub consists of Rockets, Missions, and the My Profile section.

• Rockets /Dragons Section - this section displays a list of all available SpaceX rockets. Users can book each rocket by clicking the reservation button or cancel the previously made booking. The same layout is used to form the Dragons section [added only if your team has 3 members].
• Missions Section - this section displays a list of current missions along with their brief description and participation status. There is also a button next to each mission that allows users to join the selected mission or leave the mission the user joined earlier.
• My Profile Section - The My Profile section displays all reserved rockets and space missions.

Building this application will allow to learn how to use React and Redux in the context of a real application and get hand exprience on front-end development.

🛠 Built With

• ReactJS
• Redux
• React-Boostrap
• Jest Test
• React Testing Library

Tech Stack

• JavaScript ES6 Module
• ReactJS
• Redux
• babel-Webpack
• Jest Test
• React Testing Library
• HTML&CSS and JavaScript
• VS Editor
• GitHub and Gitflow

Database

• API dependdencies

Client

• NA

Server

• N/A

Database

• N/A

Key Feature

• API enabled - fetch external API
• Joining and Leaving Missions to space
• Rocket Booking and Cancel reservation
• Filtering reserved Rockets and Joined Missions

(back to top)

🚀 Live Demo

• Space Traveler Hub

(back to top)

💻 Getting Started

To get the content of this project locally you need to run the following commands in your terminal.

Prerequisites

In order to run this project you need to install the following packages/modules

• IDE (code editor) like: VScode, Sublime, etc
• Git
• npm
• node.js
• React-dom
• React-redux
• eslinter

Setup

1. Install git if not already installed

2. Use VScode: open terminal in VScode

3. Download the Zip file or clone the repo with:

git clone https://github.com/Microverse-Fullstack-Program/space-traveler-hub-v2

4. To access cloned directory, run and navigate to the directory where you cloned the repo:

cd space-traveler

Install Depedancy and Run app

To install linters and other project's dependencies run:

npm install

Usage

To run the project, execute the following command:

npm start

Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.

The page will reload when you make changes.
You may also see any lint errors in the console.

npm run build

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

See the section about deployment for more information.

Getting Started with Create React App

• This project was bootstrapped with Create React App.

(back to top)

Run Test for Linters

For tracking linter errors locally you need to follow these steps:

1. For tracking linter errors in HTML files run:

npx hint .

2. For tracking linter errors in CSS or SASS files run:

npx stylelint "\*_/_.{css,scss}"

3. For tracking linter errors in JavaScript files run:

npx eslint .

Test Command

For unit testing of the app run:

npm test

(back to top)

👥 Authors:

The collaborators of this project are.

👤 Author 1: Zewdie Habtie

• GitHub: Zewdie Habtie
• Twitter: Zewdie Habte

👤 Author 2: Chere Lemma

• GitHub: Chere Lemma
• Twitter: Chere Lemma

(back to top)

🔭 Future Features

• Mobile version resposiveness.

(back to top)

🤝 Contributing

Contributions, issues, and feature requests are welcome!

Kindly raise issue here

(back to top)

⭐️ Show your support

If you like this project, kindly follow me on GitHub 😊

(back to top)

🙏 Acknowledgments

I would like to thank Microverseinc for.

• Readme-template
• Linter for React & Redux

Much appreciation goes to Space X for the availability of the API to practice.

• SpaceX API

(back to top)

📝 License

This project is MIT licensed.

(back to top)