Space-x is a web application the is working with the real live data from the SpaceX API

Related tags

Learning resource redux javascript jsx css3 reactjs redux-thunk
Overview

Project Name : Space-x Traveler Hub

Space-x is a web application for a company that provides commercial and scientific space travel services. The application is with the real live data from the SpaceX API and allow users to book rockets and join selected space missions.

Project view

Screen

In order to achieve this project I used some resources and technologies listed below :

Built With

  • Major languages : JavaScript , JSX and CSS
  • Promise based HTTP : axios
  • Toolchain : Babel
  • Library and Framework : React, React-redux, Jest, React-test-renderer
  • Technologies used : Github, Git, Gitflow and Linters

Live Demo (Not ava)

Click Here To open the live demo

Getting Started

To get a local copy up and running follow these simple example steps.

Prerequisites ♻️

  • A personal computer connected to the internet;
  • Have a working and updated browser.
  • Have a local version control like git installed on your computer
  • Have an account on Github, as an online/remote Version Control System
  • Code editor (Visual studio code, sublime text, notepad++, ...) installed on your computer;
  • To be okay with javaScript ES6
  • Knowledge of HTML and CSS.

Setup 🎰

  • Click the me and you'll land on the pure repository;
  • click on the green ( 🟢 ) button with Code Inscription;
  • You can choose to download the project or just clone it if you are familiar with Git and Github;
  • Follow normal step once download in your computer and use it as it's yours.

Install

  • If you are familiar with git, Run npm install to get all dependencies required to run the linters checks, otherwise use the downloaded project on your computer without testing files

Run test 🧪

Run the command bellow inside your git bash or command line interface..

  • npm run start : to run the project in your default web Browser
  • npx stylelint "**/*.{css,scss}" : for the css codebase and use of best practices. you can add
  • npx eslint . : for the JavaScript codebase and use of best practices

  • Note that you can add --fix keyword to the command for Css and/or JavaScript to make sure that you avoid all errors coming from your code editor

Author

👤 Chris Siku

👤 Grace Muthui

🤝 Contributing

Contributions, issues, and feature requests are welcome!

Comments
  • Milestone 12 : Project submission (Pair-programming)

    Milestone 12 : Project submission (Pair-programming)

    What we did ♻️

    In this project we are working with the real live data from the SpaceX API. We 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.

    We used 🧑‍💼

    • Use React documentation. ✔️
    • Use React components. ✔️
    • Use React props. ✔️
    • Use React Router. ✔️
    • Connect React and Redux. ✔️
    • Handle events in a React app. ✔️
    • Write unit tests with React Testing Library. ✔️
    • Use styles in a React app. ✔️
    • Use React life cycle methods. ✔️
    • Apply React best practices and language style guides in code. ✔️
    • Use store, actions, and reducers in React. ✔️
    • Perform a code review for a team member. ✔️

    Technology used 🧑‍💻

    • Major languages: JavaScript, JSX, and CSS
    • Promise-based HTTP: Axios
    • Toolchain: Babel
    • Library and Framework: React, React-redux, Jest, React-test-renderer, Bootstrap
    • Technologies used: Github, Git, Gitflow, and Linters

    Project Quick view

    Screen

    opened by Chrissiku 2
  • Milestone 11 : Testing and last Update (Pair-programming)

    Milestone 11 : Testing and last Update (Pair-programming)

    What we did ♻️

    In this project's milestone we :

    • [x] Set up testing libraries(React Testing Library and Jest).
    • [x] Write unit tests with React Testing Library.
    • [x] Make last changes to the project
    opened by Chrissiku 2
  • Milestone 7 : Profile reserved rocket

    Milestone 7 : Profile reserved rocket

    What I did ♻️

    In this project's milestone, I implement the my-profiles reserved rocket in the way that you (@Graycemuthui ) can also Add the missions in that bootstrap Listgroup

    opened by Chrissiku 1
  • Milestone 3: Basic structure af the app and Rockets reducer

    Milestone 3: Basic structure af the app and Rockets reducer

    What I add ♻️

    In this project's milestone I create :

    • [x] A basic structure of the Rockets reducer,
    • [x] An empty Rockets component
    • [x] An empty Missions component
    • [x] An empty Profile component
    • [x] A store configured for the app

    Technology used 🧑‍💻

    • Language : JSX, JavaScript(ES6) and CSS3
    • Framework and Library: React-bootstrap, React, Redux, React-redux
    • Technology: Git, Gitflow, GitHub
    opened by Chrissiku 1
  • Milestone 2 : Initialize the project

    Milestone 2 : Initialize the project

    What I did ♻️

    In this project's milestone I initialize the project and install some necessary dependencies that the project will need to work

    Technology used 🧑‍💻

    • Language : JavaScript, HTML5 and, CSS3
    • Framework and Libray: Reactjs, Redux, Redux-toolkit, jest
    • Technology: Git, Gitflow, Github, and Linters
    opened by Chrissiku 1
  • Milestone 1 : Setup Kanban board

    Milestone 1 : Setup Kanban board

    Space-x group project

    Project link : https://github.com/Chrissiku/Space-x/ Project board: https://github.com/Chrissiku/Space-x/projects/1

    [NOTE]: This project will be done by a team of 2 people listed below

    Team members

    opened by Chrissiku 2
  • [1pt] Create empty My profile - Setup (group task)

    [1pt] Create empty My profile - Setup (group task)

    • Create a route and a view component. Use <NavLink /> for the page navigation links and style active class to indicate which section/page the user is currently on (underline active navigation link).
    • This view should be empty - you will add content in separate tasks.
    opened by Chrissiku 0
  • [1pt] Create basic structure for Rockets - Setup

    [1pt] Create basic structure for Rockets - Setup

    • Create a route and a view component. Use <NavLink /> for the page navigation links and style active class to indicate which section/page the user is currently on (underline active navigation link).
    • Create a directory for all Redux state slice files.
    opened by Chrissiku 0
  • [1pt] Create basic structure for Missions - Setup

    [1pt] Create basic structure for Missions - Setup

    • Create a route and a view component. Use <NavLink /> for the page navigation links and style active class to indicate which section/page the user is currently on (underline active navigation link).
    • Create a directory for all Redux state slice files.
    opened by Chrissiku 0
Owner
Chris Siku
👋 Hi, I’m Chris 👀 I'm a JavaScript Software Engineer 🌱 I’m currently practicing Backend development with NodeJs but also open to new opportunities
Chris Siku
GitHub https://space-x-traveler.netlify.app/
Space-x is a web application the is working with the real live data from the SpaceX API

Project Name : Space-x Traveler Hub Space-x is a web application for a company that provides commercial and scientific space travel services. The appl

Chris Siku 12 Aug 22, 2022
In this project we built a web application that consumes an SpaceX API. It provides commercial and scientific space travel services that allows users to book rockets and join selected space missions.

Space Travelers' Hub In this project we built a web application that consumes an SpaceX API. It provides commercial and scientific space travel servic

Diego Yon 7 Sep 30, 2022
"Space-Travelers-Hub" is a website that allows users to book rockets and join selected space missions by using data from the SpaceX API.

Space-Travelers-Hub This project was bootstrapped with Create React App. Description "Space-Travelers-Hub" is a website that allows users to book rock

Tresor Sawasawa 4 Mar 13, 2022
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.

Space Travelers A web application for a company that provides commercial and scientific space travel services. The application will allow users to boo

Hector Torres 2 Apr 6, 2022
This web application provides commercial and scientific space travel services. The application allows users to book rockets and join selected space missions.

space-hub About Project "Space Traveler's Hub" is A web application that provides commercial and scientific space travelling services, We are working

Nicholas Emmanuel 7 Nov 2, 2022
This a web application for a company that provides commercial and scientific space travel services. The application will allow users to book rockets, dragons and join selected space missions.

Space Travelers' Hub In this project, we have worked with the real live data from the SpaceX API. Our task was to build a web application for a compan

Apuabi Titilope 4 Oct 31, 2022
This web application provides commercial and scientific space travel services. The application allows users to book rockets and join selected space missions.

Space Traveler's Hub This web application provides commercial and scientific space travel services. The application allows users to book rockets and j

Michael Mesfin 6 Oct 4, 2022
This web application retrieves real live data from the Financial modeling prep API

This web application retrieves real live data from the Financial modeling prep API. It provides financial information about companies listed on Nasdaq 100 and Dow Jones Market indexes. All these companies are listed on the Home page. Users can filter these companies by searching for a specific company or by choosing one from the dropdown.

Sahar Abdel Samad 7 May 31, 2022
Space Travelers' Hub - a web application that facilitates booking rockets and join selected space missions

This is a web application that facilitates booking rockets and join selected space missions. It is built for a company that offers both commercial and scientific space travel services. The application also works with real live data from the SpaceX API.

Mong'are 6 Mar 29, 2022
A Web application that showcases Rockets and Missions from the SpaceX API, you can reserve Rockets and join Missions to your profile.

Space Travelers' Hub Project that showcases Rockets and missions from the SpaceX API, the user can reserve Rockets and join Missions, and save them in

David Vergaray 9 Apr 17, 2022
The Space Traveler's Hub is an application where users can check out availble space rockets and book them or cancel the previously made booking. Also users can find a list of current missions along with their brief description and can join the selected mission or leave the mission the user joined earlier.

Space-Travelers-Hub The Space Traveler's Hub is an application where users can check out available space rockets and book them or cancel the previousl

Tiago Lelinski Marin 7 Sep 22, 2022
Welcome to Space Traveler's HUB, this web app allows the user to take a fictional tour across the space.

Welcome to Space Traveler's HUB, this web app allows the user to take a fictional tour across the space. The user can choose a rocket from our catalog interface, and reserve it. Also, the user can see recent special missions and join them. Finally, the user will be able to keep track of all your rockets and mission they are subscribed to. Build with React, Redux, React-router, and Railwindcss.

Mihreteab Misganaw 3 Jan 27, 2022
This application allows you to book missions and rockets with Elon Musk's company, SpaceX

Space Traveler's Hub This is an application built to book missions and rockets from SpaceX You can both join and leave missions, reserve and cancel re

Santiago Velosa 4 Jun 13, 2022
pjax is a jQuery plugin that uses ajax and pushState to deliver a fast browsing experience with real permalinks, page titles, and a working back button.

pjax = pushState + ajax pjax is a jQuery plugin that uses ajax and pushState to deliver a fast browsing experience with real permalinks, page titles,

Chris Wanstrath 16.8k Jan 5, 2023
A "Basic-to-Lisp" compiler. But Basic is not real Basic, and Lisp is not real Lisp.

Basic2Lisp A "Basic-to-Lisp" compiler. But Basic is not real Basic, and Lisp is not real Lisp. Syntax Print-Sth Put some-value to standard output. PRI

Hana Yabuki 5 Jul 10, 2022
This project is a web application for a company that provides commercial and scientific space travel services

Space Traveler's Hub This project is a web application for a company that provides commercial and scientific space travel services.

Selma Belhadj 5 Jun 8, 2022
Build a web application for a company that provides commercial and scientific space travel services

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

Abraha Kahsay 5 Aug 27, 2022
The Taste food web app is our JavaScript capstone project, Taste food is a web application based on an external food API, showing data about Italian foods and we used Used involvement API to record the different user interactions (likes, comments).

taste-food The Taste food web app is our JavaScript capstone project, Taste food is a web application based on an external food API TheMealDB, showing

Kyrillos Hany 14 Aug 10, 2022
LunaSec - Open Source Security Software built by Security Engineers. Scan your dependencies for Log4Shell, or add Data Tokenization to prevent data leaks. Try our live Tokenizer demo: https://app.lunasec.dev

Our Software We're a team of Security Engineers on a mission to make awesome Open Source Application Security tooling. It all lives in this repo. Here

LunaSec 1.2k Jan 7, 2023