FrontEnd Homework 02 - TheEvergreenStateCollege/upper-division-cs-23-24 GitHub Wiki

Web Front End - Homework 02

Software Setup

If needed: Continue working on getting access to FrontEndMasters via the GitHub Student Developer Pack, or setting up GitHub Codespaces / your personal laptop development environment.

Web Engineering Setup

Lap 1: Static Page

Readings and Watchings

In Week 02, we will be reading / watching

  • Section 3: Javascript
  • Section 4: Putting It All Together (HTML, CSS, Javascript)

Main Text https://btholt.github.io/complete-intro-to-web-dev-v3/

Video to Watch Accompanying Above https://frontendmasters.com/courses/web-development-v3/

To Submit:

In the class monorepo, change to your assignments directory and create a directory for week2. Read and implement the calculator project for Javascript / and Putting It All Together. Return to the readings and watchings above as needed.

https://btholt.github.io/complete-intro-to-web-dev-v3/lessons/putting-it-all-together/project

Lap 2: React + Typescript

Readings and Watchings

Read Section 4

Watch Section 4 of Complete Intro to React

  • React Capabilities

Write Code

Write and commit to the class monorepo, in your personal assignments directory.

Complete the Pet Photo Carousel project in your assignments directory, first creating this directory if necessary.

cd <repo_dir>/web-24wi/assignments/<github_username>/frontend/week2

When you are done, or at regular intervals, commit and push to GitHub.
The first time, create a Pull Request.
This is also a place where teaching staff and classmates can give you help and feedback.

git add .  
git commit -m "<describe your change>"  
git push -u origin <github_username>-week2  

Preparation for Code Interview

You will receive your feedback and evaluation for this assignment next week by Canvas and a 1:1 in-person in-person code interview with teaching staff. Don't worry, do your best.

You can practice a mock interview with your classmates by following this script (as the interview)

  • Interviewer: Tell me about your code
        * Interviewee: (if you don't know where to start, divide your code up into 4-5 sections, and describe their purpose in order)
  • Interviewer: (removes three random lines of code without showing interviewee)
    • Interviewers will give hints and narrow down the range of where the change happened.
    • Interviewee: (given time to re-run the code, understand what has happened, add it back, explain the purpose of that line, and how they came to that conclusion)

At any time, it is okay for the interviewee to say "I'm stuck, but here is what I am thinking. Can I have a hint?"

⚠️ **GitHub.com Fallback** ⚠️