🏷️ backlog

Module-User-Focused-Data πŸ”—

[TECH ED] Naming accounts consistently πŸ”— Clone

Your own accounts!

Why are we doing this?

Naming Accounts Consistently

πŸ’‘ Tip

Use the same name everywhere in your work with CYF.

Consistency in online account names

During the CYF course you will make accounts online. (Such as Slack, GitHub, Google, LinkedIn…)

You should always use your real name. It must always be the same name. Don’t use any other words apart from your name. Do not ever put your birth year or age in your user name. These things can harm your job prospects so start as you mean to go on.

Trainees use the same name everywhere in their work with CYF.

πŸ“ Note

CYF recognises you may need to keep your birth name private. When we say real name, we mean the name you go by. It does not have to match your birth certificate or any other legal document.

Your profile picture does not have to be a picture of you. It must be safe for work, consistent and unique, so you don’t get mixed up with other people. If you need to keep your photo private, you can use Robohash to make a unique profile picture.

Summary

Don’t use cute handles or put the year of your birth in your username.

Use the same username and picture across all CYF accounts. This also means professional profiles like Linkedin and Github.

Maximum time in hours

.1

How to get help

Swap with a classmate and check their profile. Ask yourself:

If you didn’t know them, would you know this was their Slack account? If you didn’t know them, would you know this was their LInkedIn? If you were a recruiter reading their GitHub, could you find their LinkedIn within six seconds? If you wanted to invite them to an opportunity, could you do that without asking them first?

  • 🎯 Topic Communication
  • πŸ• Priority Mandatory
  • πŸ¦” Size Tiny
  • πŸ“… Sprint 1
[TECH ED] πŸ“ Code review πŸ”— Clone

Why are we doing this?

Code review is an essential part of self-evaluation. Get a code review for a piece of work; then reply and iterate on this feedback.

You can also use any solutions to review your code independently.

Maximum time in hours

1

  • πŸ• Priority Mandatory
  • πŸ“… Sprint 1
  • :memo: Self evaluate
[TECH ED] πŸ«±πŸ½β€πŸ«²πŸΏ Pair program πŸ”— Clone

Instructions

  1. Pair up with a volunteer and work on a kata together
  2. As a trainee, you will need to explain your thought process, plan out what to do, write the code and check it works
  3. Volunteers will need to ask questions to check your understanding, provide guidance if you stuck, give honest and meaningful feedback

🧭 Guidance for volunteers

  • Don’t take over! It’s important trainees get used to figuring things out. Provide guidance and assistance but trainees need to struggle to overcome any obstacles with understanding and technical communication
  • Give honest feedback. Trainees can’t develop if they don’t receive honest feedback about their progress.
  • Ask questions. Sometimes asking a clarifying question can help learners discover errors and often promotes more thoughtful responses.
  • Encourage best practices. Reinforce good practices like reading error messages carefully sessions and checking documentation.

Why are we doing this?

Pair programming is an excellent way to develop programming and communication skills. It is often much easier to work through something when working on something 1 to 1. It is also helps our trainees to prepare for technical interviews when they’ll need to code in front of other people.

Acceptance criteria

  • You have pair programmed on a kata with a volunteer for at least one hour
  • πŸ• Priority Mandatory
  • πŸ¦” Size Tiny
  • πŸ“… Sprint 1
  • :memo: Self evaluate
[TECH ED] Wireframe to Web Code πŸ”— Clone

https://github.com/CodeYourFuture/Module-User-Focused-Data/tree/main/Wireframe

Why are we doing this?

A wireframe is a simple line diagram representing the skeleton of a website or an application’s user interface (UI) and core functionality. It shows where components should be in relationship to each other and what, roughly, they should do.

A common task for a web developer is to take a wireframe and express it in web code. Websites are made up of regular, repeating component pieces, so before you start coding, identify each component on the wireframe and write that out as your skeleton.

Maximum time in hours

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.

You can also open draft PRs and link to the actual code you are working on.

How to submit

  1. Fork to your Github account.
  2. Make a branch for this project called feature/wireframe
  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/wireframe commit id: "skeleton page code" commit id: "What is Git" commit id: "Why do developers need Git?" commit id: "What is a branch in Git?" checkout main merge feature/wireframe

There are several projects in this repo. Make a new branch for each project. This might feel challenging at first, so this is a good problem to bring to class to work on in groups with mentors.

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 once the coursework solutions are released.

Anything else?

A really good habit to get into is to look at existing web pages and turn them into wireframe sketches. You can do this with pen and paper. You don’t have to be good at drawing: it’s just lines and boxes. Start to look at the internet like a web developer: break it down and understand how it was made.

A good place to start is Youtube. What components make up those views? Can you sketch them? What about GitHub? Somebody made everything you see.

  • 🎯 Topic Problem-Solving
  • 🎯 Topic Requirements
  • 🎯 Topic Structuring Data
  • 🎯 Topic Testing
  • πŸ• Priority Mandatory
  • πŸ‚ Size Medium
  • πŸ”‘ Priority Key
  • πŸ“… HTML-CSS
  • πŸ“… Sprint 1
[TECH ED] Design Basics πŸ”— Clone

https://scrimba.com/learn/design

Why are we doing this?

Runtime 1 hour 8 minutes.

This course will help you with your Cake project, and give you some fundamentals of design to help you interpret and express design as code.

Maximum time in hours

1.5

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

No submission step

  • 🎯 Topic Problem-Solving
  • 🎯 Topic Requirements
  • 🏝️ Priority Stretch
  • πŸ‚ Size Medium
  • πŸ“… HTML-CSS
  • πŸ“… Sprint 1
[TECH ED] Portfolio πŸ”— Clone

https://github.com/CodeYourFuture/Portfolio/tree/Module-HTML-CSS

Why are we doing this?

Now you’ve built plenty of static sites, you should pick one for your portfolio, write it up, and get it deployed.

The challenge for HTML-CSS is stored in a branch. You need to checkout this branch and follow the README.

Maximum time in hours

1.5

How to get help

Share your blockers in #cyf-portfolios.

Use the opportunity to refine your skill in Asking Questions like a developer.

How to submit

  1. Fork to your Github account.
  2. Check out the branch for the module you are on.
  3. Make regular small commits with clear messages.
  4. When you are ready, open a PR to the CYF repo, to the matching branch, following the instructions in the PR template.

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 time

Anything else?

To get a job in tech you need a minimum set of tools that you need to acquire or build over the course of this year. You need:

  1. a well written CV
  2. a solid portfolio of junior level work that makes you memorable to a recruiter
  3. to be able(and show you are able) to plan, build, and ship a working product in an Agile team
  4. to be able to score reasonably well in a timed technical test
  5. to be able to do an interview in fluent English

Keep this in mind.

  • 🎯 Topic Iteration
  • πŸ• Priority Mandatory
  • πŸ‚ Size Medium
  • πŸ“… HTML-CSS
  • πŸ“… Sprint 1
[PD] Create a study schedule πŸ”— Clone

Coursework content

Over the next months you will have lots of coursework to complete! How will you manage it all? Go to the link and do the course.

Estimated time in hours

1.5

What is the purpose of this assignment?

This activity will give you practice using Google sheets to create and maintain a schedule.

How to submit

Complete the quiz at the end of the course. Share the screenshot of your results in your coursework board.

  • πŸ• Priority Mandatory
  • πŸ‚ Size Medium
  • πŸ”‘ Priority Key
  • πŸ“… HTML-CSS
  • πŸ“… Sprint 1
[TECH ED] Join Codewars πŸ”— Clone

https://www.codewars.com/join

Why are we doing this?

When you begin programming you will also begin Codewars, if you have not done so already. Prepare now by signing up to Codewars.

You will complete at least three kata a week for the rest of the course. A kata is a short coding workout and you should aim to spend twenty minutes, three times a week, doing kata.

  1. Read the CYF tutorial and code along with the example kata.
  2. Link your account with Github, and join the CodeYourFuture clan, so we can find you on the clan board here: https://www.codewars.com/users/CodeYourFuture/following

By the end of the next module, you need to have completed nine kata. Codewars is not just to practice JavaScript, it’s to practice time management and study skills.

All the CYF collections are on the CYF account. Here’s a beginner collection of kata to practice on for now: https://www.codewars.com/collections/cyf-fundamentals

This task has to be completed by the end of this module.

Maximum time in hours

1

How to submit

Add your Codewars username to your Slack profile

  • 🎯 Topic Problem-Solving
  • 🎯 Topic Programming Fundamentals
  • πŸ• Priority Mandatory
  • πŸ‡ Size Small
  • πŸ“… HTML-CSS
  • πŸ“… Sprint 1
[PD] Manage time with your calendar πŸ”— Clone

Coursework content

Set up your Google calendar to show your weekly availability for calls with your peers. Share your calendar with your pair of the week. If you prefer, you can use Calendly instead of Google calendar.

Estimated time in hours

0.5

What is the purpose of this assignment?

This assignment aims to help you start using calendar software effectively to manage your time and to collaborate with your peers and volunteers.

How to submit

Share the link of your calendar or a screenshot on the ticket on your coursework board.

Anything else?

Stretch You can also set-up a Calendly page, which you can share with people, so they can book time with you. Just make sure your calendar is up-to-date with your avaiability, or you might get invitations for times you cannot make.

  • πŸ”‘ Priority Key
  • πŸ¦” Size Tiny
  • πŸ“… HTML-CSS
  • πŸ“… Sprint 1
[PD] Use Slack huddle πŸ”— Clone

Coursework content

At Code Your Future and in the Tech industry, most communication and collaboration happen in Slack.

The Huddle function is a simple and informal way to communicate with someone on Slack for quick conversations. A lot of the time, cameras need to be turned on. This is used for pair programming, for example

Use Slack huddle to book some time to talk to your pair. During the call, share your screen and go through your coursework planner. Then you can just let your pair show theirs.

Estimated time in hours

1

What is the purpose of this assignment?

This assignment will help you start using the Slack huddle function, which is an easy way to talk to the community or team members.

How to submit

The trainee attended a Slack huddle. Share a screenshot of your huddle with your pair on the ticket on your coursework board.

Anything else?

How does Slack huddle work

  • 🎯 Topic Communication
  • 🏝️ Priority Stretch
  • πŸ‡ Size Small
  • πŸ“… HTML-CSS
  • πŸ“… Sprint 1
[PD] Create your Development Plan πŸ”— Clone

Coursework content

You should have analysed your weekly patterns and started identifying improvement areas by now. In this exercise, we’ll create a few positive areas for your performance and well-being and convert those into a plan.

Areas that matter most:

  • Time to learn: You reserve enough time and energy to learn
  • Start of the day: You start the day with a clear mind
  • Income: You create a stable financial income (if possible)
  • Boundaries: You set clear boundaries between work, study, family and other responsibilities
  • Distractions: You minimise distractions from the internet
  • Teamwork: You learn to work with others and ask for help
  • Food: You eat food that enhances energy and concentration
  • Daily Learning: you manage to concentrate and work on your training daily, even if for a short amount of time

Considering these areas, which are the 2-3 you struggle with most? Choose them and add them to your β€œDevelopment Career Plan” spreadsheet as a β€œTheme”.

Now, read this text about your area so that you can define your goals for each theme. Be as SMART as possible with your goals.

Example of learning/development needs:

  • Daily 20 min walk to reduce my anxiety
  • Make sure I finish my shift on time so I can study
  • Sleep by X so I can get up early and study
  • Make notes of the number of hours I am studying so that I can have evidence of my development
  • Practice mindfulness 5 minutes a day to enhance my focus

The next step is to define your actions to achieve that goal. Remember to challenge yourself, but at the same time, be realistic. Thinking about small steps to reach your bigger goal is also good. With every little (maybe daily, weekly) achievement, you get closer to it.

Write these actions on the same spreadsheet so you can assess them regularly.

If you have some time, share this with your pair so that you can give each other insights.

Estimated time in hours

1

What is the purpose of this assignment?

We all have to make changes and adapt our routines to achieve goals. But we cannot change everything at once and will change different things according to our reality. This exercise is for you to take the first step to planning these actions. It’s not about size but about the impact it will have in your life as a developer.

How to submit

Add the following to this ticket:

Anything else?

The Development Plan is not a one-off exercise. It is a plan you should review constantly with your new knowledge and when you have developed new skills.

  • 🎯 Topic Problem-Solving
  • 🎯 Topic Time Management
  • πŸ‚ Size Medium
  • πŸ”‘ Priority Key
  • πŸ“… HTML-CSS
  • πŸ“… Sprint 1
[PD] Reflect on your plan to live as a developer πŸ”— Clone

Coursework content

Now that you have your spreadsheet, you reviewed it, and you are confident it is a good picture of your availability and commitments on a typical week, we can reflect on it.

An important goal of this exercise is to observe your life from an external perspective.

  • Write a statement about your reflection. It should be at least 50 words long.
  • Don’t forget to check your text with a grammar tool, such as Grammarly

Read it a few times aloud and ensure you haven’t missed anything. Ask yourself if this is what you had planned or a realistic description of what happens. Make any changes and iterations to it.

Now look at the number of hours you dedicate to each activity per week.

Ensure you include your energy and concentration levels when studying or CYF training.

Read the updated sample and iterate again on it, ensuring it has the expected level of detail.

Share your reflection with your pair. Ask them to ask you questions about the accuracy of it. Get them to help you to refine it.

Estimated time in hours

1

What is the purpose of this assignment?

Observing your week and reflecting on your real availability will be key to ensure you have a clear plan to achieve your ultimate goal, which is a job as a developer.

Be transparent in all what you are writing and thinking about, to ensure you have a reliable plan. Remember: the plan doesn’t end when the CYF course ends.

How to submit

Add the following as a comment on this issue:

  • If you feel comfortable doing so, link to the updated Google Docs with your statement. Make sure anyone with this link can comment on it.
  • Add a comment about your discussion with your pair (up to 100 words). Remember to check the grammar and spelling before posting it.
  • 🎯 Topic Problem-Solving
  • πŸ• Priority Mandatory
  • πŸ‡ Size Small
  • πŸ“… HTML-CSS
  • πŸ“… Sprint 1
πŸ§‘πŸΎβ€βš–οΈ Check module success criteria πŸ”— Clone

https://curriculum.codeyourfuture.io/html-css/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.

πŸ§‘πŸΏβ€πŸŽ€ 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 and delete as appropriate:

πŸ“ˆ 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 Code Review
  • 🎯 Topic Communication
  • 🎯 Topic Delivery
  • 🎯 Topic Requirements
  • 🎯 Topic Teamwork
  • 🎯 Topic Testing
  • 🎯 Topic Time Management
  • πŸ• Priority Mandatory
  • πŸ¦” Size Tiny
  • πŸ“… HTML-CSS
  • πŸ“… Sprint 1
  • πŸ“… Sprint 3
[TECH ED] Play Can't Unsee πŸ”— Clone

https://cantunsee.space/

Why are we doing this?

To make a professional looking website, you must attend to all the small details. Play this fun game to sharpen your eye for the professional polish that will set your portfolio apart.

Maximum time in hours

.5

How to get help

Play it again!

  • 🎯 Topic Requirements
  • 🏝️ Priority Stretch
  • πŸ¦” Size Tiny
  • πŸ“… HTML-CSS
  • πŸ“… Sprint 1
[TECH ED] Complete Code in Place "Welcome" πŸ”— Clone

https://codeinplace.stanford.edu/public/studenthome

Why are we doing this?

In this module, you will be introduced to Karel the Robot and write your first program.

Then, you will learn about control flow statements in Karel the Robot, including for loops, while loops, if statements, and if-else statements. You’ll learn how to use these control structures to write more complex Karel programs. You’ll also get an introduction to your first principle of programming style and learn to write beautiful code.

Maximum time in hours

6

  • 🎯 Topic Programming Fundamentals
  • πŸ• Priority Mandatory
  • πŸ¦‘ Size Large
  • πŸ“… Sprint 1
[TECH ED] Sign up for Code in Place πŸ”— Clone

https://codeinplace.stanford.edu/

Why are we doing this?

Code in Place is a free introductory programming course using the Python language, based on material from the first half of Stanford University’s established intro course, CS106A. It assumes no prior programming experience.

Stanford offers a free, good quality programme to learn the basics of coding. It has a scheduled course, which you should sign up for if it’s open. If the scheduled course is not running, work through the course materials in your CYF study group. The videos and problems are the same either way.

You will learn Python, which we will use later for handling data.

Maximum time in hours

.10

  • 🎯 Topic Programming Fundamentals
  • πŸ• Priority Mandatory
  • πŸ¦” Size Tiny
  • πŸ“… Sprint 1