🏷️ backlog

Module-JS3 πŸ”—

[TECH ED] Watch the VSCode Debugger Video πŸ”— Clone

https://code.visualstudio.com/docs/introvideos/debugging

Why are we doing this?

For months now we have been building a toolkit to help us write great software. In our toolkit we have:

Specifications, like user stories, acceptance criteria, and Given/When/Then
Help us understand what to write and check we’ve written the right thing.

Tests, like unit tests and assertions
Help us break down our problems and check our solutions work even when we change things.

Asking questions
Help us formally reason through our problems and identify gaps in our mental models.

Playing computer
Helps us reason about code with a mental model.

Audits, like Lighthouse
Help us identify performance and quality improvements we can make to our code.

And now we can add debuggers to our toolkit.

Debuggers are tools that help us find and fix problems, or “bugs”, in our JavaScript code. They let us step through our code line-by-line while it runs to see what is happening. This helps us find the place where our mental model of the code is different from our implementation. Your browser has a debugger and so does VSCode. You have used a similar program to “step through” code in your prep work.

Key reasons we use debuggers:

  • See what’s happening inside functions
  • Check if variables have expected values
  • Pause execution and step through slowly
  • Find exactly where mistakes happen

JavaScript debuggers give control over execution flow to methodically test and fix bugs. Watch the first four minutes of the video and then explore the VSCode Debugger on your machine.

Maximum time in hours

.25

How to get help

AI can help you here. Code along with AI so it has the context and ask it when you get stuck. Use this starting prompt:

Act as a friendly, supportive, knowledgeable programming mentor. I am learning the debugger in VSCode.Talk me through the interface step by step. Provide a simple example of a Node script with a bug in it and walk me through finding the bug by setting breakpoints with the debugger. Don’t tell me what the bug is. When I get stuck, answer my questions in CEFR B2 English meant for an adult professional speaking in a second language. When I ask for hints, give me useful pointers. Say okee dokee if you understand and begin your walkthrough.

Remember to use careful prompting when you don’t understand, so you get real learning out of the exchange. Say things like:

The execution is paused and it shows me that i is undefined and this is undefined, but I don’t understand why it says that. Can you explain this to me?

I made you a bot specifically for this coursework, right here: https://poe.com/CYF_Learn_Debugger

Remember you should always ask your friendly humans in Slack when you get really stuck.

  • 🎯 Topic Communication
  • 🎯 Topic Requirements
  • πŸ• Priority Mandatory
  • πŸ¦” Size Tiny
  • 🎯 Topic Testing
  • πŸ“… Week 1
  • πŸ“… JS3
[TECH ED] Play the Bandit πŸ”— Clone

https://overthewire.org/wargames/bandit/

Why are we doing this?

Basic Linux skills are essential for roles in Cloud, DevOps, Cyber, and SRE. Junior Cloud and DevOps roles are growing in the industry. It’s a good idea to practice Linux skills to make yourself more employable. In React, you will execute commands in the terminal to create files and run scripts, so you will have many chances to practice your command line skills.

Your goal is to get to Level 20 by the end of the Databases module. You can do this by completing one level a week from JS2 onwards. You can do one level a week!

You should be at level 8 or higher this week.

Maximum time in hours

.5

How to get help

Work through the puzzles together in #cyf-over-the-wire

Don’t share solutions in this channel, or you steal from others the opportunity of learning.

How to submit

There is no submission step. However, to apply for some roles and some courses (like CYF+ ) you must demonstrate these skills, so it would be a good idea to learn them.

Anything else?

Here’s a ChatGPT prompt you can use to get the best, most helpful learning experience:

Please act as a friendly, warm, straightforward technical mentor. You are an experienced Site Reliability Engineer who uses the terminal regularly and understands all shell commands in bash. You can explain clearly, using English mostly at CEFR B2 level, how to execute shell commands and how to navigate Linux file systems. We will be playing The Bandit, Over the Wire, shell game together. I don’t want you to give me all the answers. I want you to walk me towards the answer, helping me to find out and learn Linux commands, explaining clearly what is happening as we go. Please answer my questions carefully and do not offer code solutions, just explain in English the approach I should take and then review the commands I suggest to you. Say okee dokee if you understand.

And remember: every time ChatGPT offers code you don’t recognise, you must ask “Is this valid” before you continue. ChatGPT makes up invalid code all the time.

  • πŸ• Priority Mandatory
  • 🎯 Topic Programming Fundamentals
  • 🎯 Topic Problem-Solving
  • πŸ¦” Size Tiny
  • πŸ“… Week 1
πŸ§‘πŸΎβ€βš–οΈ Check module success criteria πŸ”— Clone

https://curriculum.codeyourfuture.io/js3/success/

Why are we doing this?

πŸ”‘ The most important thing is that you are secure in your understanding.

At the end of the course, we will expect you to build novel applications using your understanding. If you cannot build things, we cannot put you forward for jobs. It is in your personal interest to make sure you have properly understood this module.

To progress to the next module you need to meet the success criteria for this module. How will you as a cohort meet the module success criteria? Discuss it in your class channel and make a plan together.

Strategies

πŸ§‘πŸΏβ€πŸŽ€ good strategies

  • asking volunteers to review your code
  • helping each other with coursework blockers
  • arranging midweek study sessions
  • using Saturday time to review code and cohort tracker

πŸ™…πŸΏ bad strategies

  • opening empty PRs
  • copying and pasting
  • breaking the Trainee Agreement
  • mistaking the measure for the target

Maximum time in hours

.5

How to get help

Discuss with your cohort. Support each other.

How to submit

In week 4 of your module you will need a representative to report to the organisation. Here’s your template, fill in your details, delete as appropriate, and post it on your cohort channel on Slack:

Progress Template

πŸ“ˆ Cohort Progress Report from @cohort-name to @programme-team

  • criterion
  • criterion
  • criterion
  • criterion

βœ… We are progressing to the next module.
β›” We are taking a consolidation week to meet our targets.

  • 🎯 Topic Communication
  • 🎯 Topic Delivery
  • 🎯 Topic Code Review
  • 🎯 Topic Requirements
  • πŸ• Priority Mandatory
  • 🎯 Topic Teamwork
  • 🎯 Topic Time Management
  • πŸ¦” Size Tiny
  • 🎯 Topic Testing
  • πŸ“… Week 1
  • πŸ“… JS3
  • πŸ“… Week 4
[TECH ED] Technical Writing One πŸ”— Clone

https://developers.google.com/tech-writing/one

Why are we doing this?

Every engineer is also a writer.

This collection of courses and learning resources aims to improve your technical documentation. Learn how to plan and author technical documents. You can also learn about the role of technical writers at Google.

Take the prep course before class and do the in-class workshop… in class!

Maximum time in hours (Tech has max 16 per week total)

2

How to get help

Arrange a mid week study session to work on this course together. Can you invite a native speaker to support you? What skills do you already have in your group? Has someone worked as a writer, teacher, translator, or journalist?

How to submit

There’s no submission step. Just use the course to improve all your technical writing, readmes, and docs as you progress.

  • 🎯 Topic Communication
  • 🎯 Topic Code Review
  • 🏝️ Priority Stretch
  • πŸ‚ Size Medium
  • πŸ“… Week 1
  • πŸ“… JS3
[PD] LinkedIn research πŸ”— Clone

Coursework content

  1. Set up a LinkedIn profile if you don’t already have one.
  2. Find 3 LinkedIn profiles that you think are good and reflect on why they are good or effective.
  3. Think about what you can use/adapt from these people’s LinkedIn profiles to yours.

Estimated time in hours (PD has max 4 per week total)

0.5

What is the purpose of this assignment?

To create a presence on LinkedIn and to get familiar with its workings.

How to submit

  • Share the link to your Linkedin profile on this issue.
  • Share the list of things you would like to use/adapt on your profile as a comment on this issue.
  • 🎯 Topic Requirements
  • 🏝️ Priority Stretch
  • πŸ‡ Size Small
  • πŸ“… Week 1
  • πŸ“… JS3
[PD] Define your product and build the project board πŸ”— Clone

Coursework content

Organise/attend another call with your team and define what fictional product you would build. Brainstorm different ideas and reach an agreement as a team.

Each team member should develop an idea for a product and pitch it to the group. All other members provide constructive feedback to improve the product idea. Each team member should give at least one positive and constructive feedback to enhance the idea with clear examples and explanations. This should take up to 30 min in total.

Build the GitHub project board for your project and begin assigning the first tasks to different team members, e.g. market research for the product, potential users, unique selling proposition, and competitor analysis.

Estimated time in hours (PD has max 4 per week total)

1

What is the purpose of this assignment?

To decide on the fictional product for the Teamwork Project and to build the project board for collaboration.

How to submit

  • Share the link to your project board on your issue. Remember to make it public so anyone reviewing this coursework can see it.
  • Share the link of the document on this issue as a comment. Make sure it can be commented on by anyone.
  • 🎯 Topic Teamwork
  • πŸ‚ Size Medium
  • πŸ”‘ Priority Key
  • πŸ“… Week 1
  • πŸ“… JS3
[PD] Discuss different aspects of teamwork πŸ”— Clone

Coursework content

Attend a call with your team. If no one has organised it yet, take leadership and organise it.

The agenda of the call is outlined below. Plan your time accordingly to discuss and agree on each item.

  • What will be your team’s rules?
  • How will you ensure that your project will remain on schedule? What is your strategy if the project falls behind schedule?
  • What is your strategy for communication within your team? How would you communicate key challenges in your team?
  • How would you hold each other accountable?
  • You should use GitHub Projects to manage the project and assign tasks. What other tools will you use?

Write down your decisions using a Google doc or another tool and ensure each team member has access to the decisions. Share relevant links (e.g., to the GitHub project board) in that document.

Estimated time in hours (PD has max 4 per week total)

1

What is the purpose of this assignment?

To decide on the team agreement.

How to submit

  • Share the link to your decisions on your project board
  • Share the document link with the decisions on this issue as a comment. Make sure anyone can comment on it.

Anything else?

  • 🎯 Topic Communication
  • πŸ• Priority Mandatory
  • 🎯 Topic Teamwork
  • πŸ‡ Size Small
  • πŸ“… Week 1
  • πŸ“… JS3
[TECH ED] Check out an API response πŸ”— Clone

http://api.tvmaze.com/shows/82/episodes

Why are we doing this?

This task will get you to really think about the response you get back from an API. Use Chrome Dev Tools to examine the response you get back from the server.

Look at a request in Chrome Dev Tools

In Google Chrome, open dev tools network tab and enter this URL into the browser: http://api.tvmaze.com/shows/82/episodes

Answer the following questions:

  1. What’s the status code the server sent back?
  2. What HTTP method did the browser use to make the request?
  3. What is the request path?
  4. What is the first line of the response body?
  5. What is the value of the response header called “Content-Type” ?
  6. What is the value of the request header called “User-Agent”

Maximum time in hours

.5

How to submit

Share your answers with the other trainees in your Buddy Group or on your Slack class channel.
Did you get different answers to other people? Ask them how they worked them out!

  • πŸ• Priority Mandatory
  • 🎯 Topic Programming Fundamentals
  • πŸ‚ Size Medium
  • πŸ“… Week 1
  • πŸ“… JS3
  • :brain: Prep work
[PD] Key learnings about difficult workplace conversations πŸ”— Clone

Coursework content

Read the following materials about difficult workplace conversations. Write a 250-word essay about your key learnings from the PD session and these two articles.

Estimated time in hours (PD has max 4 per week total)

1

What is the purpose of this assignment?

When you complete this assignment you will have developed your own opinions and be better equipped to have effective conservations in difficult situations in your professional life.

How to submit

Attach the link of your Google doc to this ticket on your board.

  • πŸ• Priority Mandatory
  • πŸ‡ Size Small
  • πŸ“… Week 1
[TECH ED] Book Library πŸ”— Clone

https://github.com/CodeYourFuture/Module-JS3/blob/main/book-library/readme.md

Why are we doing this?

Making a simpler version of the TV Show Project, that has some similar concerns, can help you design your application.

Maximum time in hours (Tech has max 16 per week total)

3

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.
gitGraph commit id: "start" branch feature/book-library 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/book-library

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.
  • πŸ• Priority Mandatory
  • 🎯 Topic Programming Fundamentals
  • πŸ‚ Size Medium
  • πŸ”‘ Priority Key
  • πŸ“… Week 1
  • πŸ“… JS3
[TECH ED] TV Show Project - Part 1/4 πŸ”— Clone

https://github.com/CodeYourFuture/JS3-Module-Project

Your goal this week is to complete level 100.

That means:

  • Deploying the website
  • Achieving level 100 yourself in your own repository

Why are we doing this?

After learning new skills and concepts, it’s important to practice using this knowledge to check if you’ve understood everything properly. The tv show project will provide you with an opportunity to use your knowledge from JS1 and JS2 to create a website from scratch.

Maximum time in hours (Tech has max 16 per week total)

8

How to get help

https://syllabus.codeyourfuture.io/guides/asking-questions

How to submit

Remember to follow the instructions here: https://github.com/CodeYourFuture/JS3-Module-Project/blob/main/levels/level-0.md

  • 🎯 Topic Requirements
  • πŸ• Priority Mandatory
  • 🎯 Topic Problem-Solving
  • πŸ‚ Size Medium
  • πŸ”‘ Priority Key
  • πŸ¦‘ Size Large
  • πŸ“… Week 1
  • πŸ“… JS3