A React-based, fully responsive website that uses JSON data and combines creative design and space adventures.
This project was a lovely opportunity to follow a provided, structured Figma design and bring to life. It implements lazy loading & component/page animations, and is based on TypeScript, React Router, Styled Components and Framer Motion. For a detailed overview, please have a look at the Features & Tech section.
Important Note: All of the image assets, along with the design files were provided by Frontend Mentor, as part of the Space tourism multi-page website challenge.
As this project was bootstrapped with React, the following scripts are available:
Install the dependencies:
npm install
Run the app in development mode:
npm start
Launch the test server in the interactive watch mode:
npm test
- Dynamic website background based on path.
- JSON-fetched data with a custom hook to facilitate only essential data extraction.
- Animated page transitions and component presentation.
- Fully-responsive in both landscape & portrait mode.
- React
- TypeScript
- React Router
- Styled Components
- Framer Motion
- Lodash
- React Content Loader
- React Icons
For a more detailed overview of the development & production dependencies, please check package.json.
https://developedbygeo.github.io/Space-travel/
Contributions are certainly welcome. Please feel free to open an issue/PR if there is something you would like to be changed.
A massive thank you to The Odin Project, freeCodeCamp & Frontend Mentor for their guidance and quality material.