Skip to content

🪐My solution for the famous frontend-mentor challenge "Space tourism", made with React, JS and CSS in NextJS

License

Notifications You must be signed in to change notification settings

cosmoart/Space-tourism

Repository files navigation

Email Instagram Discord Twitter

Space tourism website

🪐My solution for the famous frontend-mentor challenge "Space tourism", made with react, JS and CSS in NextJS. This is a solution to the Space tourism website challenge on Frontend Mentor.

Solution . Live Page

Table of contents

Overview

The challenge

Users should be able to:

  • View the optimal layout for each of the website's pages depending on their device's screen size
  • See hover states for all interactive elements on the page
  • View each page and be able to toggle between the tabs to see new information

Screenshots

Links

My process

Built with

  • Mobile-first workflow
  • Semantic HTML5 markup
  • React - JS library
  • Nextjs - React framework

⬆️ Back to top

What I learned

It was the perfect opportunity to play around with NextJS for the first time. Making the css was more difficult than I imagined since NextJS makes some changes to the HTML and CSS (such as images and css module files) but I was able to solve those problems by reading the documentation and doing some research.

Another complication when making the styles was the slider animations of the cards that needed all the cards to be in the HTML and not just one that changed with a state, which would have been much simpler but without cool animations.

⬆️ Back to top

Author

⬆️ Back to top

About

🪐My solution for the famous frontend-mentor challenge "Space tourism", made with React, JS and CSS in NextJS

Topics

Resources

License

Stars

Watchers

Forks