Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Space tourism website built using React

@ansman58

Desktop design screenshot for the Space tourism multi-page website coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
3intermediate
View challenge

Design comparison


SolutionDesign

Solution retrospective


I’d appreciate corrections on what aspects of the code I should improve on

Community feedback

@fazzaamiarso

Posted

Hi @ansman58! Great job on finishing the project!

I have some suggestions for you

  • Currently you are navigating by rendering component conditionally with State. I recommend you to use a routing library instead. The most popular is React Router
  • In your Crew page, rather than using useEffect to find the selected crew, you can achieve the same result by doing it in render. Example:
// by doing this, you don't need `data` state anymore
const { crewMember, setCrewMember } = React.useContext(CurrentNavContext);

// this will be re-calculated everytime `crewMember` changes. 
const crewInfo = crew.find((item) => item.role === crewMember) ?? null;

  <Section
            subtitle={crewInfo?.role}
            title={crewInfo?.name as string}
            description={crewInfo?.bio as string}
            titleClass={style.sectionTitle}
            subtitleClass={style.sectionSubtitle}
          />

I hope it helps! Cheers!

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord