[TECH ED] Cakes Co

[MarcusZagorski]

From Module-HTML-CSS created by SallyMcGrath: CodeYourFuture/Module-HTML-CSS#13

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.

How to submit

1. Fork to your Github account.
2. Make a branch for this project.
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.

gitGraph
    commit id: "start"
    branch feature/cakes-co
    commit id: "skeleton page code"
    commit id: "Fonts and colours"
    commit id: "mobile layout"
    commit id: "lighthouse audit revisions mobile"
    commit id: "desktop layout"
    commit id: "lighthouse audit revisions desktop"
    checkout main
    merge feature/cakes-co

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.