Google Code-in/Workshop Materials

Workshops organized around Wikimedia and Google Code-in:

ChickTech High School Kick-off 2017

Wikimedia crew at the ChickTech's 2017 high school kick-off in San Francisco, California

Logistics

Date(s): December 9-10th, 2017

Venue: August Home Inc, San Francisco, CA

Event URL: https://www.mediawiki.org/wiki/ChickTech_High_School_Kickoff_2017

Audience

High school students of the ChickTech organization

Learning objectives

Help high school students accomplish a mix of coding and non-coding Google Code-in tasks, and get excited about contributing to Wikimedia and open source.

Workshop design

Coding tasks were around writing users scripts and non-coding ones around editing Wikipedia articles. Students of these workshops had beginner level skills in programming; as these topics required minimum pre-requisites and expert knowledge to get started, they were included in the workshop curriculum. 

• Day 1
  • Icebreaker introductions: “What is your favorite spirit animal?” to set a safe space for participants
  • Workshop sessions:
    • 1: Introduction to Wikimedia, Open Source and Google Code-in
    • 2: Web development basics: introduction to DOM, HTML, CSS, JQuery, understanding how to use developer tools in Chrome, inspecting elements, etc.
    • 3: Completing a Google Code-in task around editing Wikipedia article
• Day 2
  • Workshop sessions:
    • 1: Getting started with IRC
    • 2: Completing user scripts related tasks in Google Code-in

Pre-planning

• Shared pre-requisites with students that included: creating an account on Wikipedia, registering on the Google Code-in contest and completing the parental consent form before coming to the workshop.
• Created tasks on Phabricator and importing them on Google Code-in site with help from Wikimedia program administrators.
• Recruited volunteers to help with the workshop through the Wikimedia-SF mailing listand ChickTech organization.

Accomplishments

Students completed user scripts (ChickTech High School Kickoff 2017/Tasks) and edited Wikipedia articles on their favorite topics (task url).

Materials

• Introduction to Wikimedia, Open Source and Google Code-in (slides)
• Google Code-in non-coding task (one) around editing Wikipedia articles and coding tasks (ten) around writing user scripts created:
  • Write a user script to add a zoom toggle button on an article page that allows you to increase/decrease the font size of the text on an article
  • Pick an article about your favorite topic on English Wikipedia and make small edits to it
  • Write a user script to make sentences in an article shorter by limiting them to contain not more than 20 words
  • Write a user script to pick a random image from a category in Wikimedia Commons and choose it to replace all images in an article
  • Write a user script to show a chain-link icon next to each section heading, which on clicking copies the page URL with that section anchor to your clipboard
  • Write a user script to replace all images in an article with an image of your choice
  • Write a user script to calculate the estimated reading time of an article
  • Write a user script to count the number of images used in an article and display the number on top of the page
  • Write a user script to count the number of paragraphs in an article and display the number at the top of the page
  • Write a user script to count the number of words in an article and display the number at the top of the page
  • Custom style sheet to change change font color to red and font face to bold

If you have organized a workshop around Google Code-in and would like to document it, post a message on the talk page and let us know!