https://github.com/arpitnath/spacex

A personal project built with ReactJs, Typescript and Scss || deployed to netlify
https://github.com/arpitnath/spacex

create-react-app javascript netlify-deployment react react-hooks react-router scss typescript

Last synced: about 1 month ago
JSON representation

A personal project built with ReactJs, Typescript and Scss || deployed to netlify

• Host: GitHub
• URL: https://github.com/arpitnath/spacex
• Owner: arpitnath
• Created: 2021-04-19T13:40:18.000Z (over 3 years ago)
• Default Branch: staging
• Last Pushed: 2021-06-07T21:26:51.000Z (over 3 years ago)
• Last Synced: 2023-07-26T12:53:34.565Z (over 1 year ago)
• Topics: create-react-app, javascript, netlify-deployment, react, react-hooks, react-router, scss, typescript
• Language: TypeScript
• Homepage: https://projectspacex.netlify.app/
• Size: 3.73 MB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        


  



SpaceX Dash🚀


### About

It is a personal project inspired from [SpaceX Go!](https://github.com/jesusrp98/spacex-go)

It uses the data from the open-source r/SpaceX REST API, which can be found [here](https://github.com/r-spacex/SpaceX-API).

This Project was bootstrapped with [create-react-app](https://create-react-app.dev/docs/getting-started/).



  

  

  

  

  



## Features

- **Launch tracking & details**: detailed list of past & upcoming launches.

- **Company details**: general company details & achievements.

- **Data can be retained in url**: able to filter with launches, and date, and can combine multiple filters. The current page with pagination and filters applied are retained via the URL.

## Run the app locally

```

$ git clone [email protected]:arpitnath/spacex.git

```

> env variable: `REACT_APP_SPACEX_BASE_API=https://api.spacexdata.com/v3/`

```

$ npm install

```

`$ npm start` - This will start the application and run on port 3000

## Folder Structure

```

src

└───index.tsx              # Application entry point

└───App.tsx                # Application routes

└───pages/                 # Views of the App

└───components/            # All the components live here

└───styles/scss            # StyleSheets

    └───components/        # component styles

    └───pages/             # pages styles

    └───_mixins.scss       # all mixins

    └───_variables.scss    # scss/sass variables

    └───styles.module.scss # common styles & all styles endpoint

    └───global.scss        # global styles

└───assets/                # images / logo

└───helpers

    └───History.ts         # history object

    └───Hooks.ts           # Custom Hooks

    └───icons.ts           # all icons used

    └───tableheadData.ts   # table head titles

    └───types.ts           # Types

    └───utils.ts           # Shared Logic

```

> There you go, run & edit the project. Enjoy 🚀

## Contributing

If you want to take the time to make this project better, please go ahead.

Then, you can open an new [issue](https://github.com/arpitnath/spacex/issues) and create a [PR](https://github.com/arpitnath/spacex/pulls)

> > Feel free to reach out to me @arpitnath if you have any questions or feedback or any suggestion for improvements!