Web App Development

Lessons learned from running a free front-end development course

I ran a short, free front-end development course back in October. It wasn’t something I’d ever done before, so this post explains how I organized it and what I learned.

Why run a free course?

One day I’d like to do some commercial training. Unfortunately, it’s not something I have any experience with. Organizing a paid course would take a lot of work. Attracting people to come would be a bigger effort, and the expectations of those who come would be higher.

To get experience I had applied for two part-time teaching assistant jobs in the past, but neither application worked out.

Making the course free reduced the pressure of creating something commercially viable. It gave me an opportunity to gain experience without disappointing paying customers.

The course was the best (and only) course I ever ran. I doubt I would have managed to organize and run a commercial course.

Deciding what to teach

I ran the course on three Saturday mornings from 9 am to 12 pm.

To get an idea of what was realistically achievable in that time, I started by looking at the curricula of General Assembly and CodeCademy.

One of the main goals of the course was to teach what the role of each of the different front-end technologies is. While focussing on HTML and CSS, I also wanted to include a little bit of JavaScript to give a more complete picture.

To build a full website you are going to have to create several pages. Since some parts of each page (e.g. the header and footer) are going to be the same every time, you don’t want to duplicate the code for these parts. That means you need some extra software, like a PHP server or a generator like Jekyll.

I considered including one of those but decided that there wasn’t enough time. Installing software is a risky thing. It only takes a few minutes if it goes right, but if it goes wrong it has the potential to take hours to fix.

I also used CodePen throughout the class, so nobody had to install an editor like Sublime.

Watching people learn to code

Watching people learn to program is incredibly fascinating when you’ve been coding for a long time.

It’s easy to forget how difficult it is when you’re just getting started. I remember having trouble getting a switch statement to compile years ago. Now I have no idea what could possibly go wrong at such a simple task.

I had helped some friends learn to code, so I knew I needed to avoid stuffing too much content into too little time.

I also went to the Coding for Everyone meetup at Founders & Coders. Watching someone struggle with basic CSS syntax made it even clearer how difficult programming is.

In retrospect, I should have spent even more time just working with people one-on-one to be able to better explain concepts and understand what parts are difficult.

Finding a venue

Because I wasn’t charging any money I didn’t feel I needed to rent a room just to run the course. I could just talk to local community spaces (e.g. libraries) to see if they would offer some space for free.

I got a flyer for someone tutoring at the local community centre. I emailed them and they told me who I could contact to ask about the space.

After an initial phone call we sat down for 10 minutes to discuss what I was planning to do. They let me use the space, so I started looking for people who wanted to learn to about web development.

Finding participants

This was one of the toughest parts because I really didn’t have a clue how to find interested people.

Working with the community centre helped, as they let me put up a flyer there, and eventually three people signed up for the course.

I also distributed leaflets in the building I live in, but nobody signed up based on that.

Unsurprisingly, tweeting about the course from my personal account didn’t lead to any sign-ups. I don’t have many followers, and most of them are already technical and don’t live in London.

What was surprisingly effective was creating a Meetup group. Creating a group with up to 50 members only costs $10 a month. I got another three sign-ups on Meetup.

The Meetup website makes it easy for people to discover new meetups. Over the next couple of weeks, I reached the 50 member limit. I didn’t expect there to be that much interest. I considered organizing other meetups after I finished the course, but ultimately decided I didn’t have time to do that.

If I hadn’t found enough participants I would have asked if I can put up fliers in the local supermarket and library. Posting on Gumtree would have been another option.

Also, contacting people with a larger audience that is likely to be non-technical but interested in learning more would probably have been a good strategy.

Keeping it small

From the start I had decided to limit the number of participants to six. I knew I didn’t have much experience and wanted to have time to help each participant individually.

It was also likely that some participants would have a different amount of previous experience.

Before the course, I emailed all participants or messaged them on Meetup. I asked if they had any past experience and what motivated them to join the course.

One of the people I contacted didn’t reply, so I ultimately expected 5 people to show up for the course.

Expect people to be a little late

The two people who signed up on Meetup had trouble finding the venue. I had put the exact location on the map, but in retrospect I clearly should have had sent more detailed instructions and put up a sign.

Unfortunately, both participants from Meetup arrived late. I wasn’t prepared for that and felt I needed to start diving into the topic instead of waiting around. As a result, both of them missed the introduction which made everything that followed more complicated.

If I run another course I’ll expect people to be late and fill the first 15 minutes or so with fluff and conversation.

My biggest mistake: trying to teach everyone what they wanted to learn

Everyone who came to the class already had some previous experience. For example they had done a CodeCademy course our taken a class in university.

Because of that, I thought I should keep lecturing about basic concepts to a minimum. That way I wouldn’t bore anyone and I’d have time to help everyone with the thing they needed to learn next. Surely this would work if you only have 5 people in the class!

It turned out to be a big mistake.

First of all, it meant there was no clear structure . During the first class, everyone was working on something slightly different. I had created a plan for teaching basic HTML and CSS, but there were lots of distractions.

Secondly, people aren’t good at judging how much experience they have. If you’re teaching a beginner class people won’t have a deep understanding of any of the topics they said they knew about. So moving on to something more complex will mean they need lots of help.

Instead of trying to cater to everyone’s specific needs I should have set clear steps that everyone needed to reach before we move on to the next thing. If someone finishes early they can play around on their own and help other participants.

If someone already has a specific project they need to learn development for, have a Skype call with them. Then you have time to focus just on their problem.

Despite this, we made some progress trying different HTML tags, but the class could have been run much better.

Create a comfortable environment

Learning to program is a difficult and frustrating endeavor. It’s not something everyone enjoys and does purely for the fun of it.

I could have made the class more comfortable, by waiting for people to arrive, doing introductions and bringing drinks and snacks.

Combined with the lack of structure I think I did a poor job at making everyone feel comfortable and supported.

Class number two

Only two people came to the second class, although one of the previous participants credibly claimed she had forgotten to set her alarm.

Since the second class only had two people it wasn’t difficult to manage. We focussed on learning more HTML and CSS, and practiced implementing layouts.

I also showed how to use Sublime instead of CodePen. I was hoping we could host a simple website somewhere. Disappointingly, the Forge upload didn’t work. I should have looked up an alternative service beforehand in case there were problems.

Class number three

Three people came to the final class, which made it feel less lonely than the second one.

I’m happy with how the class went. I followed a fixed structure and switched between explaining and giving little tasks the participants could do on their own. During that time, I could then go around and help people individually.

My end goal for the class was to make a simple todo app. I knew it was very optimistic, so I was prepared that we probably wouldn’t be able to get it done.

I started by showing basic JavaScript in the console. Numbers, calculations, strings, string concatenation, variables, alert, prompt, …

Then I showed how to use CSS selectors and jQuery to select page elements and then hide or modify them.

I expected that the first part would be more difficult since it was entirely new. Surprisingly, the second part was more confusing.

In the end, we did manage to build a super basic todo app, which was a good way to show what the role of JavaScript is in a web page. Having something real also helped reduce the confusion around what the point of jQuery was.

Final thoughts

I learned a lot from running the course. While the first class didn’t go as well as I hoped I think the people who stayed on the course learned a lot.

For a future course, one thing I would consider is providing some written guide or using CodeCademy during the course. That would free up time for questions and make sure the explanations are higher quality. A potential downside could be that there is less shared time where everyone is thinking about the same problem.

Follow me on Twitter
I'm building monitoring tool for site speed and Core Web Vitals.
➔ Start monitoring your website or run a free site speed test