Front end developer test
Don't work more than four hours on this assignment
Use the Star Wars API as a data source to complete the below assignments:
You can also use the GraphQL version if you prefer:
https://swapi-graphql.netlify.com
Choose one or both assignments
Focus on JS
- See the wireframe (Design files/wireframes/js-assignment.jpg) to get started. Create new pages if needed.
- Be able to search for Star Wars characters and show details about the results.
- Show search suggestions as you type.
- Show a search history with timestamps.
- Be able to delete individual search history entries.
- Be able to clear the search history.
Focus on CSS
- Get started by looking at Design Files/wireframes/css-startpage-wireframe.jpg
- Show film overview based on the data
- Show detail page when clicking on a film
- Use the desktop design to code your own appropriate mobile design equivalent
What we look at
- Responsive design. Should look good at all common screen widths.
- Clean code. Should be easy to understand.
- Semantic HTML. The HTML should be accessible and good for SEO.
- Performance. The app should not make unnecessary API calls or re-renders.
Start the app
- npm install
- npm run start