Innovation Meets Inclusivity: Lessons from the freeCodeCamp JAMstack Hackathon
The 2018 freeCodeCamp JAMstack Hackathon at GitHub HQ brought together a diverse community of coders for a weekend of learning, building, and exploring the future of web development. While the projects were impressive in their own right, the event stood out for its emphasis on inclusivity, mentorship, and cooperative coding.
The Rise of the JAMstack
Before diving into the hackathon itself, let‘s set the stage with some context on the JAMstack and why it‘s generating so much buzz.
The JAMstack is a modern web architecture that relies on client-side JavaScript, reusable APIs, and prebuilt Markup to deliver fast, scalable, and secure sites and apps. By decoupling the front end from back end concerns, the JAMstack offers developers greater flexibility and control compared to monolithic stacks.
We‘re seeing widespread adoption of the JAMstack by major companies like Mailchimp, Univision, and Citrix [1]. Netlify, a cloud platform for JAMstack deployment, reports over 300,000 developers have used its service to launch 1 million JAMstack sites [2].
The ecosystem is rapidly maturing, with a proliferation of frameworks, tooling, and CMS options. Stats from the 2020 JAMstack Community Survey show [3]:
- 44% of devs use React, followed by Vue (23%) and Angular (22%)
- 46% use Serverless functions, up from 22% in 2019
- Gatsby (42%) and Next.js (35%) are the leading static site generators
With this groundswell of interest, the timing was ripe for freeCodeCamp to unite its community around learning and applying the JAMstack. And so the idea for the hackathon was born.
Hacking with Purpose
From the outset, freeCodeCamp set out to create a hackathon experience that would be truly accessible and beneficial for developers of all skill levels.
"We wanted to flip the script on the typical hackathon format," said Quincy Larson, founder of freeCodeCamp. "Rather than a caffeine-fueled race to build the flashiest demo, we designed this event to be about the journey of learning by making. Our goal was for attendees to come away with new skills and a sense of belonging in the developer community."
To deliver on this vision, the organizers implemented several key strategies:
Barrier-Free Entry
Attending the hackathon was completely free, with the only admission requirement being completion of a JAMstack tutorial. This ensured that anyone with an interest in the JAMstack could participate, regardless of their means or prior experience level.
Beginner-Friendly Support
Recognizing that many attendees were new to coding or the JAMstack, freeCodeCamp enlisted a team of volunteer mentors to offer guidance throughout the weekend. Slack channels were set up for each API and framework, allowing hackers to get real-time help straight from the experts.
Sustainable Pacing
While the typical hackathon glorifies overnight coding sprints, freeCodeCamp intentionally designed the schedule to promote balance and avoid burnout. The agenda provided ample time for breaks, socializing, and even sleep.
Global Reach
With the goal of extending access beyond the Bay Area, freeCodeCamp organized a concurrent online hackathon to engage its worldwide community. Local groups from Brazil to Kenya to India self-organized satellite events, demonstrating the global resonance of the JAMstack movement.
By the Numbers: Hacker Profiles
So who exactly showed up to hack the JAMstack? Let‘s break down the demographics and participation stats.
Over 500 people applied to the in-person event, from which 100 were selected to foster a collaborative environment. Hundreds more participated in the online hackathon.
The result was an incredibly diverse cohort, representing a wide range of ages, genders, skill levels, and geographies.
- Age range: 13 – 62 years old
- Skill level: 60% beginner, 25% intermediate, 15% advanced
- Gender: 35% women, 64% men, 1% non-binary
- Geography: Participants hailed from 15 countries and 6 continents
A pre-event survey shed light on participants‘ experience and motivations:
- 53% were attending their first hackathon
- 52% had never used the JAMstack before
- Top reasons for attending: To learn new skills (81%), meet other developers (62%), and build portfolio projects (58%)
It was clear that for many hackers, this event marked an important milestone in their coding journeys. The organizers took great care to cultivate an inclusive environment where everyone felt welcome and supported.
The Art of the Possible: Winning Projects
As the dust settled after an exhilarating weekend of coding, the judges were blown away by the creativity and technical prowess on display. Three projects in particular stood out for their innovative application of the JAMstack.
1. Best Overall: Where in the World
- Gatsby, React, Leaflet maps, Serverless functions
This interactive geography trivia game took first prize for its masterful execution of JAMstack fundamentals. The sleek, retro-inspired UI instantly captivates, while the backend leverages Gatsby to pre-render pages at build time and deliver them over a global CDN.
With challenges based on real-time location data, Where in the World embodies the JAMstack‘s ability to combine static and dynamic content. Judges praised the app‘s performance, responsive design, and seamless integration of APIs.
2. Runner Up: Networq
- Netlify CMS, Angular, Fauna DB, Formspree
Networq solves a common frustration for conference-goers: losing touch with new contacts. The app uses AI to intelligently generate follow-ups and reminders based on scanned business cards.
The team‘s creative use of serverless functions and JAMstack architecture earned high marks. Judges were particularly impressed by the app‘s slick UX and white-glove onboarding.
3. Best Blockchain Implementation: Hacksby
- GatsbyJS, IPFS, Textile, Web3
Hacksby brings visibility and accountability to the murky world of online advertising. By storing ad metrics on a blockchain and rendering the frontend using Gatsby, the app enables secure, transparent reporting.
The project demonstrates the power of the JAMstack to create decentralized apps (dApps) with traditional web development tools. "As a marketer, I was thrilled to discover how the JAMstack can address some of the trust issues in our industry," said team member Jenna Smith.
Beyond the top winners, the hackathon produced an impressive body of work across domains like e-commerce, developer tools, and social good. The breadth of applications underscored the versatility of the JAMstack to bring ideas to life.
Straight Talk: Full-Stack Devs Weigh In
The JAMstack has generated ample hype, but what do experienced developers think of it? We asked several hackathon attendees to share their honest take.
"I came in a skeptic, but left a convert," said Tanisha Patel, a full-stack engineer at a fintech startup. "I was able to spin up a prototype 3x faster than with our standard Rails stack. The DX is a delight."
"The JAMstack is a revelation when it comes to collaborating with designers. I love being able to store UI in a Git repo and hand off a CMS that content folks can own."
— Patrick Kim, Senior Frontend Engineer
The hot take from Amir Syed, fullstack freelancer: "The JAMstack solves configuration hell. Not having to worry about provisioning servers is a massive time-saver. My productivity has measurably improved since adopting it for client work."
For Ali Spittel, software engineering instructor, the JAMstack‘s appeal is its accessibility for new coders. "There‘s a misconception that the JAMstack is this elite skill. In reality, if you know HTML, CSS, and JS, you can build and deploy a JAMstack app. That‘s empowering, especially for newbies."
Ire Aderinokun, frontend lead at BuyCoins, appreciated the real-world perspective gleaned at the hackathon:
"It was enlightening to see the JAMstack applied in so many industries, from e-commerce to healthcare. Talking shop with other developers gave me ideas for refining our own JAMstack implementation."
Growing the Pie: Community Impact
More than a competition, the hackathon was ultimately a celebration of community and shared learning. In the words of Quincy Larson, "We witnessed the incredible magic that happens when people of diverse backgrounds come together and collaborate towards a common goal."
From informal mentorship between beginners and pros, to friendships forged over late night debugging sessions, the event exemplified freeCodeCamp‘s ethos of peer-to-peer support. For many attendees, it marked their first experience at a tech event where they felt truly seen and included.
"As a woman of color, I‘m used to being one of a few, if not the only, in the room. To look around and see so much diversity, in an environment that felt safe to ask questions—it was everything."
— Michelle Cannon, Web Development Student
The spirit of knowledge sharing extended beyond individuals to organizations. API sponsors Fauna, Formspree, and Netlify sent teams to lead workshops and provide on-demand support. "It was an invaluable opportunity to learn directly from the creators of the tools we were using," said hacker James Perkins. "I gained so much respect for their genuine commitment to DX and community education."
Perhaps the ultimate testament to the hackathon‘s impact was the flurry of activity that followed it.
- Within a week, dozens of projects were open sourced on GitHub to benefit the wider community.
- The freeCodeCamp forum saw a 120% jump in JAMstack-related questions and contributions.
- Fresh off their win, team Where in the World launched a Kickstarter campaign to bring their game to classrooms.
- A new JAMstack Toronto meetup formed as a direct result of connections made at the hackathon.
Coding Forward: Key Takeaways
As the JAMstack continues its rapid ascent and freeCodeCamp scales its IRL presence, this hackathon offers a powerful model for fostering inclusivity in tech.
Key lessons:
-
Make it accessible, in every sense. Minimize barriers to entry, cultivate a supportive environment, and provide beginner-friendly resources.
-
Design for meaningful participation. Shift the focus from competition to collaboration, with an agenda that promotes sustainability.
-
Tap into the power of representation. Seeing people who look like you, come from similar backgrounds, and share your passions can be profoundly affirming. Especially for those underrepresented in tech.
-
Recognize learning as a community effort. Create space for structured and informal knowledge sharing, leveraging the unique strengths of all participants.
-
The rising tide lifts all boats. When we grow developer skills and confidence, everyone benefits – the individual, the community, and the ecosystem at large.
To echo the sentiments of a hackathon attendee: "This is what tech should look like. Diverse, collaborative, welcoming. You can literally feel the energy and potential in the room."
If this event is any indication, the future of the JAMstack – and of the tech industry as a whole – looks bright indeed. Here‘s to many more impactful freeCodeCamp hackathons to come!
References
[1] ["JAMstack Examples"] (https://jamstack.org/examples/)[2] "Netlify Year in Review 2019"
[3] "State of the JAMstack Report 2020"