Skip to content

[TECH ED] Cakes Co #5

@Xinxi-Chen

Description

@Xinxi-Chen

Link to the coursework

https://github.com/CodeYourFuture/Module-HTML-CSS/tree/main/Cakes-Co

Why are we doing this?

This project is thinking about "mobile first" design. Developers build sites on computers/laptops, but most users are on phones. So we should make our designs work first on a phone, and then expand them for larger screens.

https://explodingtopics.com/blog/mobile-internet-traffic

(In some sectors this is more like 90%. Your company will track their own statistics on this with a tool like Google Analytics.)

Maximum time in hours

8

How to get help

Share your blockers in your class channel. Use the opportunity to refine your skill in Asking Questions like a developer.

Creating a Week 2 branch in Git

We previously learned about using branches in Git. To recap, branches are useful to "test" a set of commits. The branch is treated as a special branch, where it only contains commits that all of your colleagues have agreed on.

To allow us to easily understand what has changed on your branch, it should always start from the branch, not another branch. In other words, your branch should only contain commits for that one branch, not any other branches.

In your coursework, we want you to practice using Git in the way that you will when working as a developer. Because of this, when starting the Week 2 (or Week 3, Week 4, etc) coursework you should switch to the branch before creating a new branch.

To do this:

  1. Using this clip, switch to the branch 👉 https://youtube.com/clip/Ugkx2OzD279ry4XKFNpeyqJTeBqtrbGJfgRq
  2. Create a new branch as you learned previously

How to submit

  1. Fork to your Github account.
  2. Make a branch for this project. Make sure you have switched to the branch first!
  3. Make regular small commits in this branch with clear messages.
  4. When you are ready, open a PR to the CYF repo, following the instructions in the PR template.

There are several projects in this repo. Make a new branch for each project.

How to review

  1. Complete your PR template
  2. Ask for review from a classmate or mentor
  3. Make changes based on their feedback
  4. Review and refactor again next week

Anything else?

https://css-tricks.com/how-to-develop-and-test-a-mobile-first-design-in-2021/
https://codepen.io/LucyMac/pen/MWvNBLo

Stretch: If you are already familiar with media queries, try using container queries to develop your learning.

Metadata

Metadata

Assignees

Projects

Status

No status

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions