We hope that you have a restful break, but the truth of it is: it doesn't take long to forget how to code! During your time off we need you to be coding every week to keep your skills up. We're only a few weeks away from your civic tech challenge, it's no time for you to be rusty!
There are three different projects for this challenge, and we will work with you to select the one that's right for you! All three will be building a react project with Vite, but the complexity will vary. We want you to take the break to get comfortable with React. When we come back, we'll be adding to its complexity with an authentication system and Express.
There was one core concept that we didn't have time to teach you before you left: React Context. This is a way to pass data down to components without having to pass it through props. It's a bit more advanced, but it's a great way to manage state in your application. We'll be using it in our civic tech challenge, so we want you to be familiar with it.
Please read this article that explains how and why we use context.
You do not need to deploy these projects (though you certainly code use GitHub pages on your own if you wanted!). Simply run npm create vite, go through the options for React, and then push that code up to GitHub. You will have to submit your GitHub link for this project.
You remember the diagnostic pokemon lab we used at the beginning of the review session? Well, you're going to be remaking it in React! This is perfect for those who still aren't super comfortable with react and want to work on pure React skills without getting into too out of scope with a complicated React project
Your API projects were so fun, here's your chance to dip your toe back into that pool! Now, these were originally group projects, but you're going to tackle them alone this time. The reason this should work is that coming up with ideas and designs takes time, but now all those are already done, we only want you to remake what you had with React (for those who didn't finish, see if you can get farther on your original proposal with React).
For an extra challenge, for those of you who used modals: try to use multiple pages with React Router instead! Look over our example repo for more help and router tutorials like this one (don't forget about useParams and useNavigate).
This is the most time consuming project and is only recommended if you were already playing with React prior to our unit launch. The requirements are exactly the same as our API project. If you aren't comfortable with React yet, we do not recommend this option. Planning a project takes time, and over break we want to be respectful of yours. You do not have to write a formal proposal and wait for approval, build what you want! However, we do recommend you take some time to plan out the project on your own, as that's extremely helpful.
But don't get carried away with the planning and complexity! Remember, the goal of the break project is to be familiar with React and understand how it improves over vanilla JS.
If you have any make up work, you must use the break to complete it. We will be in touch about what past work we need to see completed over break.