Coursework

1) Mid-Course Feedback#

We're now over half way through the Full Stack Course!

Your feedback is really important to us. We use your feedback to improve the course for all of the hundreds of students across CodeYourFuture now and in the future.

This feedback is anonymous meaning we won't have an idea who you are after you submit.

We really appreaciate you being honest since this allows us to improve faster.

https://docs.google.com/forms/d/e/1FAIpQLSfrAtvR5HonJZiqlPXocAz7d1l-Kn57X5xp3oH_NmVUL9xTQQ/viewform

2) Review Solutions for the TV Show Project#

At the end of this week, be sure to review the solutions for last weeks coursework

https://github.com/CodeYourFuture/JavaScript-Core-3-Coursework-Week3-Solution

and

https://github.com/CodeYourFuture/TV-Show-DOM-Project-Solution

Note: This is a private repository. Please speak to your Teacher, Buddy or Class Coordinator to get access. You should ask them to invite your whole class.

3) In Class Exercises#

If you haven't already, complete the in-class exercises on your pokedex app

4) FreeCodeCamp Practice (3 hours)#

You should complete the following exercises from this website:

https://www.freecodecamp.org/learn/front-end-libraries/react/

  • Create a Simple JSX Element
  • Create a Complex JSX Element
  • Add Comments in JSX
  • Render HTML Elements to the DOM
  • Define an HTML Class in JSX
  • Learn About Self-Closing JSX Tags
  • Create a Stateless Functional Component

4) CYF Hotel (7 hours)#

4.1) Complete Challenge#

Complete all of the Lesson 1 exercises in the cyf-hotel-react project

https://github.com/CodeYourFuture/cyf-hotel-react#lesson-1

4.2) Deploy your Hotel Project#

Once you have set up your React Hotel application, we should deploy it to Netlify.

Follow the deployment instructions here:

https://syllabus.codeyourfuture.io/guides/creating-a-react-app#deployment-with-netlify

Once it is deployed, follow these instructions to change your new site's name to cyf-USERNAME-hotel-react.netlify.app (where USERNAME is YOUR Github username):

https://syllabus.codeyourfuture.io/workshops/deployment/workshop/cheatsheet#rename-your-site

Check that your site is visible at: https://cyf-[[your-github-username]]-hotel-react.netlify.app/.

5) Challenges (10 hours+)#

The key way to get better at React is to build lots of small projects and build up your knowledge.

You should complete the following project

6) Prepare for the next class (1 hour)#

In our next class we'll be exploring the difference between Props vs State.

Spend some time reading about the difference between the two.

Here are some resources to get you started

  1. Read Props vs State

7) (Optional) More Challenges#

You can see a full list of the challenges here

Suitable projects for you to work on right now are:

You should complete these challenges in the order they are in above.

7) (Optional) IronHack Labs Practice#

If you want more practice with the basics of making React components and passing props,

You should completed exercises 1-7 of https://github.com/ironhack-labs/lab-react-training

Notes:

  • Do NOT make a pull request although the repo readme says so. We don't want the staff at the other school getting your PRs!
  • Skip or simplify "Iteration 3" if you have problems with the maths.
    E.g. just pass a max number <RandomNumber max={100} /> and multiply that by Math.random().
    Or pass no props.
  • In "Iteration 6" just pass the prop as normal: <Rating rating={4.5} />.
    • To do it as specified in the exercise would require you to use something new: "props.children".
Edit this page