I have followed this site for years, but only recently joined this forum. I hope I can contribute at least a small percentage.
I am in my second year of teaching middle school students (6-8) coding. Instead of code.org or codehs.com I opted to go a different direction by providing web server space for each student, teach them codeanywhere, and develop lesson plans as I go. At the beginning of the each semester students have zero knowledge, so I did alot of experimenting the past two years on best ways to convey basic concepts. I am now seeking feedback and different viewpoints on what’s really important and not so important. For example I have a lesson plan in which students create a face or character builder. Here is one of the results: a fish builder!
As you can see in the code, students learned CSS, how create functions, call them with buttons, and basic DOM. They are only using what they have been taught.
My questions are: are they learning the right things? What should be changed? The students enjoy this so much more than the some of the guided online resources, but that shouldn’t be the only validation.
At this age, the biggest question I think really is this: are they having fun?
Them understanding web development or anything programming related is a bonus, and it looks like you hit it out of the park with your curriculum. I wouldn’t change a thing if they are able to follow along and create something in the end.
It’s an exploratory class, so I try to do things in a way so that there is something for everyone. For example, after having been exposed to the basics kids are given a choice to explore further CSS(with animation) or JavaScript, or both.
This is really cool, and something that would give me a lot of anxiety if I were to attempt. I’ve had plenty of trouble trying to teach similar things (of less breadth) to college students. It seems like whatever you’re doing is working pretty well though!
How are they handling codeanywhere? Are there hurdles to overcome with that or is it pretty easy if you keep things focused? I’m not sure if there’s any live preview or not (I haven’t used and their feature list isn’t showing something like that) but I would that thought that to be helpful for something like this. If no live preview, is it a separate browser + refresh kind of thing? Also do you take advantage of collaboration at all?
There have been very little issues with the use of codeanywhere. I use a webserver so that I can provide a folder with a username and password for each student.
During the first two days of class, the students use scratchpad.io for real time coding to learn input-output, in-between coding(how to use smart editor), tags and attributes. Then they transition to codeanywhere to learn the process of creating files, learn about file extensions, enter code, and then how to view their output(individual websites.) Yep, separate browser and refresh! And keeping things focused(and simple) with a process makes it easy to use.
There is a shared programming feature in codeanywhere but have not used it. So far, collaboration has been limited to classroom group settings. It would be great if I they would be able to partner-program nationally or internationally, so I should look into that.
I was unsure myself how far middle school kids can take themselves and sometimes worry if it’s too hard, but as long as I allow room for self pacing, individual benchmarks and opportunity, the kids learn coding and make things surprisingly well.
Within the school district there is none at this time and I am advocating for something at the high school level.
One of things I try to do is teach autonomy so that they can continue on own, which is one of things that shape the coding curriculum with an emphasis on understanding all the “moving parts”. They are also given resources with tutorials, (including kirupa.com of course.)
I wonder if setting up collaboration with other coders would help. Except, here are not many, if any, other middle schools that offer coding in this manner…as far as i know.
Excellent idea, Kvapster! (I flash back to first learning BASIC my Junior year in high school; I’ve been hooked on software development ever since …)
Not sure if my view will help as during my school education my middle school grades were somewhat experimental. I still learn in the same way today.
I believe that the simplest foundation is all that should be taught. HTML, CSS, and JavaScript all have a basic expected logic to their respective language. Similarly when an artist’s painting is created. The initial work is in the preparation of the support, and gathering the complimentary tools to be able to carry out the final vision. The structure and approach should be sound. What happens within the creation of the artwork is only limited by the artist’s creativity, problem solving and repetitive learned skills.
Coding is very similar. A strong understanding of the basic support structure will present the student with a blank application that is full of potential. Coding then becomes a question of “can this be done?” This builds on self teaching so when a student can see that what they wanted can be built their confidence and skills will build. This is true for design, UI, UX, frontend, and backend.
As with art, coding is not for everyone, but if the spark is there it will continue.
In reading this thread, your students probably already know more than many professional designers using drag & drop / wysiwyg apps and web platforms - while calling themselves web designers or even developers (gasp). I applaud you for your efforts and approach.
