Link to the coursework

https://scrimba.com/learn/cssgrid

Why are we doing this?

CSS Grid is the best way to write modern layouts, so it’s better to start off with Grid than with older layout concepts.

Don’t just watch the videos! You won’t really learn anything that way. Interact with the code and type it out.

Skip the “Pro” level and just do the free levels.

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.

How to submit

There’s no submission step. However, if you skip this, you will struggle to complete upcoming coursework.

Anything else?

This Scrimba course on CSS Grid has a runtime of 1 hour 6 minutes. This is a good one to do in small pieces when you have a spare 5-10 minutes.

Link to the coursework

https://github.com/CodeYourFuture/Module-HTML-CSS/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

4

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.

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

4. Complete your PR template
5. Ask for review from a classmate or mentor
6. Make changes based on their feedback
7. 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.

Link to the coursework

https://curriculum.codeyourfuture.io/html-css/sprints/1/prep/

Why are we doing this?

You might be used to school environments where you attend a lecture or class and then are given homework or tests to show you heard or understood the lecture. We don’t do that at CYF as we have found it doesn’t prepare people well for a good job in tech.

As a tech professional, you won’t be told a series of answers and then asked just to demonstrate your understanding/recollection of them! That will never happen! There’s no business value there at all. As a tech professional, your job will be to ask good questions, research new ideas, and figure out solutions to unsolved problems. So let’s start this now.

The prep work here will introduce you to new concepts for the week. If you already have all these concepts, you need to identify something else in your coursework to bring because everyone is expected to come to class with questions.

Find this week’s blockers thread in your cohort channel and add your question to it.

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.

How to submit

No submission step

Link to the coursework

https://github.com/CodeYourFuture/Portfolio

Why are we doing this?

At Code Your Future, we expect everyone to graduate with a unique professional portfolio. You will begin building this portfolio as soon as you begin our Software Development Course. At first, your portfolio will be a simple HTML/CSS page deployed to Github Pages or Netlify. This is your MVP.

Every module, you will iterate on your portfolio, adding a new project and improving your design and presentation. By the time you apply to The Launch, your portfolio will help you show you are ready to be accepted on to a development team.

Maximum time in hours

1

How to get help

Share your blockers in #cyf-portfolios.

Use the opportunity to refine your skill in Asking Questions like a developer. Bring your work to class and use study time to get unstuck and get feedback on your progress.

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 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.

Link to the coursework

https://github.com/CodeYourFuture/bikes-for-refugees

Why are we doing this?

Bring this to class and work through it in groups!

Maximum time in hours

1

How to submit

1. Fork to your Github account.
2. Make regular small commits with clear messages.
3. When you are ready, open a PR to the CYF repo, 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 week

Anything else?

Why do semantics matter?

Link to the coursework

https://codepen.io/collection/rxxWQJ

Why are we doing this?

This set of puzzles and exercises focuses on CSS Grid named areas. If you can understand this layout technique, you can become incredibly fast at writing layout code in CSS.

Maximum time in hours

0

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

Link to the coursework

https://www.codewars.com/join

Why are we doing this?

When you begin JS1 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
3. Add your Codewars username to the trainee tracker, so you can start building your milestone. If you don’t add your username to the tracker, it can’t track your progress.

By the end of JS1, you need to have completed nine kata to meet your milestone. 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 has to be completed by the end of this module.

Maximum time in hours

1

How to submit

Add your username to your trainee tracker.

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?

• Create a Google calendar
• Share your Google Calendar

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.

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

Link to the coursework

https://github.com/CodeYourFuture/CYF-Workshops/tree/main/devtools

Why are we doing this?

Before you come to class, you need to make sure you are ready to participate in the workshop.

For this workshop you will need:

• Chrome with Devtools
• A ChatGPT account
• This Devtools Workshop page

Make sure you come to class with Chrome installed, a ChatGPT account, and having looked over what you will be doing.

Maximum time in hours

0.15

How to get help

Share your blockers in your class channel. Practice asking good questions, with links and context.

How to submit

no submission step

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.