Web development education with ChatGPT

For may years I’ve had an interest in teaching web development for an after-school program. With 3 years of experience in after-school media education (audio/video) I know how much impact after-school programs can have on kids. With the right approach kids view the time as voluntary and fun.

With the recent debut of ChatGPT, the likely future of my profession has begun to dramatically change. The implications are profound. But more dramatic in the short-term is how beneficial Large Language Models can be for web development education.

With that in mind I’ve been working on a lesson plan for web instruction that includes ChatGPT. I’ve been learning faster than ever with it’s help and I have a strong hunch that kids will also find that it makes learning easy and fun.

ChatGPT is Highly Disruptive

It is quickly dawning of just about everyone in the tech world that using AI will in the near future not be optional. I used ChatGPT for one weekend and then integrated it into my work flow. I told my boss that I would now be able to work faster. No going back.

The most limited expectation is that AI will be an assistant that can help me with tasks. The most lofty expectation, without succumbing to hype, is that web developers will become project managers more than they are coders. But regardless of the scope of impact in the short or long term one thing is absolute crystal clear to me; LLMs are one of the very best educational tools for learning web production.

New yet Transformative

Looking around currently you find a lot of people harping on the inaccuracy of ChatGPT. In what really is the ‘Pong stage‘ of this technology that is certainly true at times. Ask it for Javascript code longer than about 10 lines and it might give you something a bit buggy. In contrast, ask it to define and provide examples of CSS variables and you will get a fantastic summary.

At an introductory level this technology is revolutionary for education. A key barrier for entry into web development is simply the increasingly obsolete but persistent notion that learning code is difficult. But as the nature of development continues it’s long shift from deep computer science knowledge to a highly facilitated process we can see that these barriers are dropping.

Web Development Education and LLMs

I learned web development the old fashioned way. I started building a website and consulted W3Schools when I needed help. This is still a solid way to get started as one of the most compelling approaches to web development education will aways be a project orientation. We can be motivated by recognizing the feelings of accomplishment and benefits of creating something socially accessible.

Project-Oriented Education

My approach to teaching has always been based on this concept. I taught a digital music class in an after-school program in the Bronx back in the ’00s. Rather than trying to teach the kids music theory I used a simple sequencing program to make learning rhythm and melody very accessible. Key to my strategy was that the kids needed immediate feedback that sounded like music.

Get a room full of kids and hand them instruments or drums and you will have total chaos. Let kids take turns adding sounds to a looping sequence and the result can sound fully professional. The kids responded to this in dramatic ways, at times dancing or singing along.

Applying this approach to web development and I have kids work on a live website from day 1. They can put their name on a page and navigate to that page from their phone. They can show their parents or friends. No matter how basic the outcome, the result is immediately social. This accomplished many goals.

  • Students are motivated to continue working on the site to make it something they would like to share with others
  • Students are given a sense of the power of web development as they see an immediate impact for their effort.
  • Students recognize how little barrier there really is between learning a concept and applying to their website
  • Students have a sense of ownership of the outcome

The big friction in this process is any barrier to learning. While W3Schools is a great site, it wasn’t created for 12 year olds and frankly many adults are just as unfamiliar with or intimidated by related concepts. People don’t learn the same way. A good reference for one person may not be helpful to another.

Solutions for Beginners

One of my long running gripes with online web development references and educational services is that they seem to have forgotten how it felt to begin. While this was more dramatic 14 years ago when I got started, it remains the case that many resources simply assume too much about what beginners may or may not know.

This is where ChatGPT and future alternatives fill an essential role. Chat-based LLM interaction allows anyone to ask for an answer with a certain level of complexity. You can ask for a summary and then ask for a more basic summary. You can start a chat saying you are 10 years old and the outcome can be tailored to you level both technically and linguistically. Nothing like this has existed before.

Approaching a Lesson Plan with ChatGPT

ChatGPT has made it clear that LLMs can facilitate both the learning and the teaching process. One of the very first tasks I asked it to do was to take the 8 or so concepts I want to teach and provide 10 bullet point summarizing each concept. The answers were fantastic. Now, I had to have experience to know the answers we solid. But knowing they were, I immediately felt like I had a digital assistant that could make building out a curriculum a lot easier.

A Changing Landscape

Working on the curriculum I quickly realized that ChatGPT wasn’t only helping me do that but also changing what I needed to teach. Would SEO be an important topic for my class? Content strategy? While it is very early in this new phase of the tech industry, some trends are implied. And the most obvious is that using AI will be an essential skill. ChatGPT or other LLM services are not only a tool for learning, but a skill even current employers are expecting.

Many are talking about the importance of prompting, or linguistic strategies used to return the desired result. Currently this is not only an essential skill when using ChatGPT, but is also a great exercise for younger students in the use of language. And so prompting becomes a subject to be taught.

But ChatGPT also informs how other topics should be taught. A good example is debugging. In the past checking your work could be a long and involved process. You might find that your code is broken and be searching for a long time to find one missing character. That part of the process can be very frustrating particularly for beginners. And while nothing will every take away all friction in learning to build websites, AI tools can help a great deal.

Currently you can feed ChatGPT the entire code of a website and it will be able to do all of the following:

  • Find errors in the code
  • Find code that is redundant
  • Find code that may not be compatible in every browser and suggest code that would be
  • Find code that may be slowing down the performance of a site and suggest alternatives

Now some would argue that it’s beneficial to do it the old way as an educational exercise. While there is some truth to this, it’s important to keep in mind that too much unneeded friction steers away from the benefits for beginners of using LLMs.

Reducing Friction in Learning

We want new student to enjoy learning. We want new students to return for the next lesson. In fact, gaining an appreciation for the skills involved is as important as learning the skills themselves.

I compare this to my having learned to play the violin when I was 8. There was no positive outcome in that process for at least 2 years. I did not enjoy the violin until I could play something. (Neither did my parents.) Of course, I’m not saying that everything should be easy. I am saying that I should have learned to enjoy making music before I picked up an difficult instrument. The same is true for web development.

Its the job of web instructors to show new students that the process can be rewarding and enjoyable. Removing friction from that process at an introductory level ensured that more students will want to continue to learn. For that reason, the benefits of ChatGPT are essential.

New Strategies for Development Education

This is all very new. Speaking with too much confidence or certainty about the future of web development or coding education is unwise. But we are also in a period of experimentation and innovation. It’s an exciting time.

On one level I’m nervous feeling like I’m going to be fighting to have a job in 5 years. On another level this is simply the nature of the tech industry and we all have to keep up with the evolution of social and commercial platforms.

In the coming months I will be continuing to work on my approach to web education using AI. I will better formalize an approach and share it on this website. And I will be looking for a local after-school program where I can teach the class. (I had this lined up and it recently fell through.)

I look forward to discussing all of this with others in my field and to continued innovation in the field of AI based education.