#Twin Cities Web CoderDojo
Welcome! This area is for students and mentors that are participating in the Twin Cities CoderDojo sessions. Please let one of the mentors know if you have feedback that you think will help others.
This page is intended to serve as a introduction and reference for the web mentors.
#Setup
Students are encouraged to bring their own workstations but workstations are available if this is not possible. It's requested that mentors arrive early to assist in setting up the workstations. Info sheets are handed out at the beginning of each session indicating how many workstations are required and what wi-fi passwords are to be used.
No special programs are required for the web team; however if you have a personal preference like Chrome Dev Tools or Sublime Text you may want to make sure it's installed.
#Welcoming the students
When the kids begin funneling in it's important to be welcoming and guide them to their correct stations. If they didn't bring a computer make sure they find one and they feel empowered to use it.
Mentors will often match up with students randomly; there is no formal assignment process. Please be sure that no student is left without a mentor and that no fellow mentor is left managing too many students.
#Working with the students
The web team does not have a structured learning program for students but this is not an issue due to the bountiful online resources, tools available. Here are a few important things to keep in mind:
-
Each student will have a different experience level
-
Many will be working with code for the first time
-
In the past, we have used tools like Codepen to provide scaffolding for getting right into
the code. -
"Breaking the ice" with each student is helpful. Often, I will ask about a student's favorite activity, video game character, etc. We'll use that information in a simple starter exercise.
-
The quick win - It's important to show students a little of what they can learn quickly, before they lose interest.
#Exercise ideas Below are some exercise ideas that have worked in the past. This section is a work in progress. Please feel free to contribute.
- Use http://codepen.io to quickly get into the code
- Show how to use
<h1>headline tag to name the restaurant - Find an image to add as a logo
- Use CSS to add style to the logo (border, size, position)
- Use
<p>tags to describe the restaurant. - Use
<h2>to denote the menu section - Use
<ul>and<li>tags to create a food menu - Add pictures of the food
http://adriann.github.io/programming_problems.html
The W3 school pages have good examples with tryit code that you can also copy/paste for use in CodePen. Note that if you're using jquery in a blank CodePen, be sure to add jquery in the settings.
- http://www.w3schools.com/jquery/jquery_fade.asp
- http://www.w3schools.com/jquery/jquery_animate.asp
- CodePen with sample animations
- CodePen with a sample weather widget in jquery - uses json weather data from [openweathermap.org]{http://openweathermap.org/current}
#Resources Here are a list of resources that may prove useful to mentors and students.