Falling in Love with HTML & CSS: Why We Love Project-Based Learning

In the spirit of America’s ultimate Hallmark holiday, we released a Valentine’s Day themed coding guide  — Falling in Love with HTML and CSS — that explains how to build a virtual card. Within 24 hours, we received a frantic email from someone in Switzerland who was almost done with the card but hit a roadblock.

“URGENT: Valentine’s gift card link not working!” The email said: “Can you help me ??! (Valentine’s is tomorrow!!)." We fixed the bug (a missing tag). And voila! His homemade gift was ready with time to spare.

It was clear that the man was personally invested, motivated to finish, and inspired to be creative by adding his personal touch to the card. (It probably helped that romance was on the line as well.) It shows just why we use project-based curricula in our Software Engineering courses.

When Thinkful mentor Michael Herman created this Valentine’s Day guide, he was using the “learn by doing” approach we use in our classes. He takes students through topics like HTML and CSS, and has them code a project to learn the skills.

Projects make learning (especially online learning) so much more effective for four key reasons:

1.) Relevance

2.) Motivation

3.) Feedback

4.) Creativity

1. Relevance: People care about the real world.

Ashley Gavin, one of our curriculum developers, believes early assignments in computer science courses are often off-putting — a basic Hello, World program — and turn folks away from a topic that has much more relevance than they realize.

Enter, project-based learning. At Girls Who Code, where Gavin worked, they used to spend the first few weeks building video games so that the students were engaged and excited by the work they were doing. They could envision the product they were building, because it was something they already cared about.

That's why we infuse our courses with relevant student projects. When Software Engineering students get to the API Hack, the last project in our front-end class, they’re super invested. One student who loved farmer’s markets built a tool that lets you find every farmer’s market within a mile. She continued to work on the project even after the course ended so she and her friends could use it.

2. Motivation: You’re not going to give up.

Students come to us because they’re craving accountability. Some have had early success with self-teaching resources but got frustrated simply following a tutorial and not actually building anything they can use.

Real projects with clear goals make learning more meaningful. It never feels like you’re just writing lines of code for the sake of writing them. The man building the card for his Valentine was 99% done with his work, but he couldn’t let the small malfunctioning link hold him back. It had to be done by midnight and he was motivated to finish.

3. Feedback. Feedback. Feedback.

We all love getting feedback on what we do. How does this sound? Does it look right? How many likes did that post get? Feedback is crucial for learning, too. We’re used to a grade, a certificate, a percentage score that shows us what we know.

If you’re building something no one is going to see, it’s easy to lose interest. Building something with the end user in mind helps our students stay invested.

4. There’s room for creativity!

Software Engineering students like having ownership of their projects - and getting creative.

We discovered this when we introduced a new project to teach Chrome Developer Tools. Learning dev tools isn’t that exciting, and we used to teach it through simple videos.

But in a newer version of our curriculum, we transformed teaching DevTools into an engaging project called Your First Hack! The idea — allowing students to pick a website, use the tools to make changes, and share the results — was to keep students more engaged. The feedback (and projects) were overwhelmingly positive.

Some advice for future Thinkful students

Our project-based curriculum is not only effective: it could help you discover a personal passion for software engineering. So take full advantage. When you’re designing a project, pick something that is relevant, motivating, feedback-driven, and creative. Make sure it allows you to learn the skills you want. It’s clear that if you choose projects that genuinely interest you, you'll be more successful and engaged - and much more likely to fall in love with coding.