class-repository

:

Class Calendar
Study Board
Discord
People
- Learners - Randomizer
- Coaches
- Admins
Class Notes
- Vocabulary (PRs)
- Snippets (PRs)
- Cheat Sheets
- Chill Zone
Guides

Modules

Learn to plan and build web applications as a team.

0. Precourse: 1 week

Set up your accounts and prepare your development environment.

1. Workflows: 2 weeks

Learn the workflows you need to develop individually and in a group.

Week 1: Chapters 0, 1, 2
- Lesson Plan: VSCode and Git
- Deliverable: Student Bio PR
Week 2: Chapter 3
- Lesson Plan: GitHub Project Management
- Deliverable: Group Intro Repo

2. Agile Development: 4 weeks

Practice collaboratively planning and developing HTML/CSS websites.

Week 1: Chapters 0, 1 - Following Plans
- Lesson Plan: Planning and Collaborating
- Deliverable: All About Trees
Week 2: Chapter 2 - Writing Plans
- Lesson Plan: User-Centered Development
- Deliverable: Loruki Rebuild
Week 3: Chapter 3 - Adapting Plans
- Lesson Plan: Being Agile
- Deliverable: Begin HYF Redesign
Week 4: Chapter 3 - Adapting Plans
- Lesson Plan: Group Project Session
- Deliverable: Finish HYF Redesign

3. UX/UI Design: 2 weeks

Explore design thinking process and placing your users at the center of your development process.

Week 1: Chapter 1
- Lesson Plan: Design Thinking
- Deliverable: Practical Case
Week 2: Chapters 2, 3
- Lesson Plan: Gestalt Principles & Figma
- Deliverable: Co-Design your Home Page

4. Welcome to JS: 3 weeks

Learn to read small programs, and to write code that other people can understand.

Week 1: Chapters 0, 1, 2
- Lesson Plan: Computers and Developers
- Study Priorities: What is Programming? and Just Enough JS
Week 2: Chapters 2, 3
- Lesson Plan: DevTools Debugger
- Study Priorities: Just Enough JS and Understanding Programs
Week 3: Chapter 4
- Lesson Plan: Writing and Reviewing
- Study Priorities: Developing Programs

5. Inside JS: 4 weeks

Take a deep dive into JavaScript and explore some it’s trickiest features. Build your foundations now so later you can focus on the fun stuff.

6. Behavior, Strategy, Implementation: 3 weeks

Explore problem solving in JavaScript, learn how to write and review solutions to JS coding challenges.

Week 1: Chapter 1
- Lesson Plan: Solution Write-Ups
- Study Priorities: Try to write up at least 3 solutions during the week.
Week 2: Chapters 2
- Lesson Plan: Function Design
- Study Priorities: Try to solve 2-4 exercises from each section of the chapter
Week 3: Chapter 3
- Lesson Plan: Code Review
- Deliverable: Practice Code Review

7. Separation of Concerns: 3 weeks

Learn how to break down interactive web pages into clear tasks that can be shared divided across team.

8. Asynchronous Programming: 3 weeks

Learn how the JavaScript event loop works and how you can use API data in your websites.

9. Headless CMS: 3 weeks

Learn what a Content Management System is and explore how you use one to model the data for your own web applications.

10. Component Based Design: 3 weeks

Practice developing Single Page Apps built from reusable UI components, and explore your first Frontend Framework.

11. Individual Project: 2 weeks

Prepare for the final project by individually designing, planning, building and deploying your own fullstack web app.

12. Final Project: 6 weeks

Put it all together! Work in teams to identify your target users and a real-world problem they face, then deliver a web app to meet their needs.

Learners

| github-name avatar | <h3 id="github-name"></h3>
[github-name](https://github.com/github-name) \| [home page](https://github-name.github.io) \| [bio](./student-bios/github-name.md)
[check-ins](https://github.com///issues/?q=assignee%3Agithub-name+label%3Acheck-in) \| [deliverables](https://github.com///projects/1?card_filter_query=assignee%3Agithub-name+label%3Adeliverable) \| [retros](https://github.com///issues/?q=assignee%3Agithub-name+label%3Aretro+label%3Acheck-in)
[opened](https://github.com///issues?q=author%3Agithub-name) \| [assigned](https://github.com///issues?q=assignee%3Agithub-name) \| [commented](https://github.com///issues?q=commenter%3Agithub-name) \| [mentioned](https://github.com///issues?q=mentions%3Agithub-name) | | ---------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |

's github stats</summary>
![github-name github activity](https://ghchart.rshah.org/github-name) ![github-name github stats](https://github-readme-stats.vercel.app/api?username=github-name&show_icons=true&theme=default&hide_title=true&hide_rank=true) </details>

--- ## Coaches

</h3>
github-name
opened | assigned | commented | mentioned
</th></tr></table> --- ## Admins | |
</h3>
[github-name](https://github.com/github-name)
[opened](https://github.com///issues?q=author%3Agithub-name) \| [assigned](https://github.com///issues?q=assignee%3Agithub-name) \| [commented](https://github.com///issues?q=commenter%3Agithub-name) \| [mentioned](https://github.com///issues?q=mentions%3Agithub-name) | | ---------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---

This site is open source. Improve this page.