Deployed project: https://satellogic-challenge-bzidaiar4-nicocarballo21.vercel.app/
The idea is to build a simple header component but with a twist. You will find all the information bellow.
You need to provide a header component which needs to be call from a views/page component. This headers has a text as a logo, some links and a dark mode toggle. You will need to create everything from scratch.
- Make a desktop version
- Create both dark and light themes and allow to switch between them
- Use React context to manage the preference
- All of above
- Make a mobile responsive version
- Save the version the user selects so if I close the tab/window I will get my latest selection
- All of above
- By default, show the user's computer preference for the theme
- Add animations/transitions
- Accesibility (keyboard navigation, narrator, markup semantics, etc.)
- Create tests
- Deploy
- NextJS or CRA
- Typescript
- Emotion or Styled components
- Vercel or Netlify
- Jest + React Testing Library (testing)
You can use any additional library you need to carry out the challenge.
You should upload it to Github so we can review the code. If you want, you can deploy the project to a public link.
After you do this, please send the links to the hiring manager or the developer you are in touch with.
In the project directory, you can run:
Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.
Launches the test runner in the interactive watch mode.