Useful resources
Below is a list of reading material which can assist you during this challenge. The resources usually include official documentation, useful blog posts, basically anything that can be of a use
SpaceX API
React.js
scss
GraphQL
Apollo
Have you heard about SpaceX? And that they have been progressing tremendously in their field? Well, they, like almost every other modern company, have their website and GraphQL API!
In the SpaceX API Challenge we will be replicating, kind of, the SpaceX website, but a lighter version of it. This project includes big players like ReactJS, GraphQL and Apollo. We will work with things like Routing, Components, Hooks, Queries and some others. It's the first challenge to tackle the level up in the tech stack, so be sure to check out the video for some more in depth explanation.
What will you build?
General Info
- - The project comes with base files, enabling you to jump straight away to work with the API, without needing to deal with the setup, styling, etc.
- - Choose a way of learning/working that suits you most - whether it's building it all independently or using the base files, if it's coding along the YouTube video or just using it as guidance - there is no one right way to do it
- - Feel free to change up some things if you want to tailor the project to your liking, after all it's yours to play with and to add to your portfolio!
Should you have questions, check out the About Page for more information
Hints
Check the hints below when you feel stuck, it might be covered here! If what you're struggling with isn't covered, try to first go through the links in the useful resources section right above this one and search for an answer there. If no luck there as well - try researching on your own, or check the end result files or the YouTube video.
When unsure about which data to fetch from the API, check the prepared components and try the approach of "filling in the blanks".
If you're feeling that the components of the rocket are too complicated, don't hesitate to use 2 of them instead of making the table that I do in the code along video. Do what feels more natural to you!
Don't know where the images are in the API? I have included them in the public/assets folder, you can use those!