🧑🏽‍🤝‍🧑🏽 day-plan

🔖
  1. Energiser
  2. MWT Workshop
  3. lunch
  4. Get Forms Workshop
  5. Afternoon break
  6. Study Group
  7. Retro

✍🏽 Register

Energiser

Every session begins with an energiser. Usually there’s a rota showing who will lead the energiser. We have some favourite games you can play if you are stuck.

  1. Traffic Jam: re-order the cars to unblock yourself
  2. Telephone: draw the words and write the pictures
  3. Popcorn show and tell: popcorn around the room and show one nearby object or something in your pocket or bag and explain what it means to you.

MWT Workshop

Most Wanted Topics 🔥

Great news! After gathering your feedback from past retros and experimenting last week, we’re officially incorporating a new element into the curriculum!

Your instructor will soon share a link to the RetroTool board. There, you can post stickers on topics you’re finding challenging. The topic with the most votes will be the focus of our workshop! If time allows, we’ll dive into the 2nd, 3rd and even more voted topics.

Don’t forget to take short break 🧘‍♂️ during the session happy coding!

Use this time wisely 🎯

To make the most out of this workshop and ensure you’re getting the best value, here are a few tips to keep in mind that will help you stay focused, collaborate effectively, and leave with actionable insights:

  • Come Prepared: Come Prepared beforehand and gather your thoughts on the specific areas where you need clarification or support. This ensures you ask targeted questions during the workshop.

  • Engage Actively: Don’t just observe ask questions, share your experiences, and participate in discussions. Workshops are most valuable when everyone collaborates.

  • Collaborate with Peers: If you see a fellow participant struggling with a topic you’re comfortable with, offer your help. Peer learning enhances the overall experience for everyone.

  • Apply Immediately: After the workshop, try to implement what you’ve learned in your course work or personal projects. Practical application reinforces your learning.

  • Follow-Up: If a topic wasn’t fully covered or you still have doubts, follow up with your instructor or peers after the session. This ensures no questions are left unanswered.

Lunch

Take your lunch break and be back in an hour!

Get Forms Workshop 🔗

Get Forms

This workshop is about writing forms in HTML.

Note: this workshop is deployed to Netlify at https://cyf-workshop.netlify.app/get-forms and branch previews are turned on. Any PRs opened to main will be deployed automatically and can be looked at via the bot link on that PR.

Learning Objectives

Requirements

Before you start, make sure you’ve done your prep work on forms and worked through some of the examples in the HTML forms section of MDN.

Today we’re going to build a form that interacts with GitHub Search. It’s a bit unusual for a form as we are writing a GET method, where the form requests, or gets data, instead of a POST method, which sends data.

Next, we’re going to swap our forms with another group and test the form we made.

Last, we’re going to make changes based on the test feedback. Because it’s important that software works and that people can use it.

But first, everybody needs to be ready to participate.

🧰 1. Setup

activity

  1. Set a timer for 10 minutes.
  2. Fork this repository to your own GitHub account.
  3. Clone the repository to your machine.
  4. Checkout a new branch called cohort/your-name.
  5. Open get-forms/index.html in VS Code.

📖 GitHub Search Project Briefing:

Create a form so the user can search GitHub repositories based on specific criteria.

👤 User Stories:

  • As a user, I want to search on GitHub.
  • As a user, I want to sort my results by stars, forks, or when last updated.
  • As a user, I want to sort my search results in my preferred order, ascending or descending.

✅ Acceptance Criteria:

US1: Search Field

Given I am on the GitHub search form,
When I select the search field,
Then I should be able to type in my search query.

US2: Sorting Results

Given I am on the GitHub search form,
When I choose from options of stars, forks, and updated.
Then the results are sorted by stars, forks, or last updated.

US3: Options for Sort Order

Given I am on the GitHub search form,
When I choose a sort order
Then the results should be sorted in my preferred order, ascending or descending.

Overall Acceptance Criteria

Given I am on the GitHub search form,
When I run Lighthouse
Then the Accessibility score is 100.

2. 🧱 Build the form

activity

  1. Set a timer for 45 minutes.
  2. Work in pairs.
  3. Read the project briefing carefully.
  4. Look in the resources section for help with the elements you might need.
  5. Write your HTML in get-forms/index.html. Do as much as you can, leaving time to open your PR (10 or 15 minutes).
  6. Open a pull request to this repo with your work. Your PR will show up in the list of PRs for this repo and a deploy preview will be created and linked on your PR. Explore this.

3. 🧪 Test the form

activity

  1. Set a timer for 15 minutes.
  2. Swap your form with another group by choosing the PR directly above yours in the PR list. If you are at the top of the list, choose the PR at the bottom of your group!
  3. Test your colleague’s form against the acceptance criteria.
  4. Comment on their pull request with what you have found.

4. 🫠 Review and respond

activity

  1. Set a timer for 15 minutes.
  2. Read the comments on your pull request.
  3. Make changes you need to make to your form to pass the acceptance criteria.
  4. Commit and push your changes to your branch; your pull request will update automatically.
  5. If your pair doesn’t have changes, join a team that does and help them.

Resources

Afternoon Break

Take your short afternoon break and be back in 15 minutes!

Study Group

Learning Objectives

What are we doing now?

You’re going to use this time to work through coursework. Your cohort will collectively self-organise to work through the coursework together in your own way. Sort yourselves into groups that work for you.

Use this time wisely

You will have study time in almost every class day. Don’t waste it. Use it to:

  • work through the coursework
  • ask questions and get unblocked
  • give and receive code review
  • work on your portfolio
  • develop your own projects

Retro: Start / Stop / Continue

  activity</span>

A retro is a chance to reflect. You can do this on a FigJam (make sure someone makes a copy of the template before you start) or on sticky notes on a wall.

  1. Set a timer for 5 minutes. There’s one on the FigJam too.
  2. Write down as many things as you can think of that you’d like to start, stop, and continue doing next sprint.
  3. Write one point per note and keep it short.
  4. When the timer goes off, one person should set a timer for 1 minute and group the notes into themes.
  5. Next, set a timer for 2 minutes and all vote on the most important themes by adding a dot or a +1 to the note.
  6. Finally, set a timer for 8 minutes and all discuss the top three themes.