Hey dev.to peeps - long-time lurker, first-time poster.
freeCodeCamp.org is now helping millions of people learn to code every month, and we're ...
For further actions, you may consider blocking this person and/or reporting abuse
This is great! I've been hearing "JAMstack" for a while now, but never really dove into what a real-world app would be comprised of. Thank you for your walkthrough of how your application works - I love that it gives you the freedom to focus on what your application does, rather than on common solved problems. 💯
Same with me 😁
Love this -- I always recommend JAMstack for blogs -- so much more expensive and more work to host a WordPress site!
Not to mention performance and complexity issues.
There are still plenty of valid use cases for Wordpress, but I don't think I've personally ever recommended it for anything. 😄
dev.to isn't literally JAMstack, but we use a lot of the same principles.
I love both #JAMstack and #WordPress :)
6,000+ pages sounds like it would be a pain to rebuild with each change. I've considered something like Gatsby for a large site I manage with mostly static content, but we've got 9,000+ posts and I'm concerned about the build times whenever someone realizes they made a small typo.
Is Gatsby smart enough to only build what changed, or does it build everything every time? And how long does that take?
Gatsby is pretty smart. Building has been slow in the past, but it's steadily getting faster.
Smashing Magazine switched from WordPress to a JAMstack: netlify.com/case-studies/smashing/
Try Hugo. Your 9000 page site will take a second to build. Most likely less.
I have no idea, but it really should be smart enough to build what’s changed. Seems like fairly straightforward diffing.
You can both cache the build inside of Gatsby and on Netlify. :)
This is more of a question than a statement. I thought that was what a React app was good at. Only building what had changed.
Congrats on your first post! This was a great read.
FCC is where I learned that I had a passion for coding and JavaScript even through my struggles. While I did end up going to a coding school FCC helped boost me in the right direction!
I love it,too. It's been so helpful to be able to practice and reinforce everything I've learned in the classroom.
This is awesome, I love freeCodeCamp.org! Thank you for sharing how you use the JAMstack.
Just curious what is it you use for monitoring?Those metric charts are beautiful.
The first chart is from NGINX's Amplify platform and the second one is from Azure, where our API server is hosted.
I was about to ask where your "public API - a Node.js / Loopback server" is hosted. Then I read this reply.
Thank you!
Thanks, Quincy!
The information is very valuable.
Love that you put the cost as the first benefit of JAMstack. I'm sure it applies for smaller apps/side projects, too.
Did you find infrastructure costs prohibitive when you first started freeCodeCamp?
Considering freeCodeCamp.org initially had no budget, yes - hosting a MongoDB cluster and a bunch of web servers was prohibitive. I spent $100,000 of my savings the first few years keeping freeCodeCamp.org going. We are break even now. We probably could have gotten there a bit earlier if we'd embraced the JAMstack sooner.
thank you for how much personal investment you've put into helping people all around the world
Ditto!
That's really impressive!
JAMStack is amazing. Quincy, I have almost the same setup for my course VSCode.pro it's Gatsby on top of #JAMstack and WordPress — with an API Kubernetes Cluster thanks to Go-lang.
do you have a post about that?
Sadly no. Will write about it. So much to do.
Hey Quincy! Was it difficult to transition to JAMstack? and was there a feature you had to give up or heavily modified?
It was a big endeavor and we're still in the process of transitioning some services.
The main challenge is rethinking different aspects of your application to use the JAMstack properly. There are some tradeoffs, though I think they're worth it.
I just want to personally thank you for FCC and all the work you have put in it for people like me. I have learned a ton. Thank You!
I have gone through the Front End Dev section and need to just build the Tech Doc page to finish. Looking forward to that.
(The site works very well for me it isn’t slow at all.)
Wow even FCC use gatsby 👏👏 btw Quincy, do you use the offline plugin? Last time I have some trouble with gatsby offline plugin, in which the old data will be loaded first before the new one, requiring users to refresh the page at least once before receiving update.
Thanks for the post as well 🙂
Super awesome lean architecture! Have you considered going serverless (using say AWS Lambda, GCP Cloud Functions, Azure Functions etc) for your backend API instead of a constantly running Node.js server. It feels like the next logical evolution...
Cheers for the write-up Quincy!
Also, watched your JAMstack Conf talk over lunch yesterday. It was really insightful, thanks! Love all of the consideration you're giving to working in low/no connectivity areas.
Thanks for sharing your experience. However, it's somewhat curious to see how something I have been using for years has now a name and it's presented as new and shyny.
Again, thanks for demonstrating that even a very interactive site can be built with this kind of stack, which could encourage some simpler sites go even more JAM
Thanks for the great insight. I have bookmarked this.
Thanks for sharing this Quincy and thanks for your dedication to education!
Incredibly interesting article, thanks so much for writing it!
I've never really thought of JAMstack as something that would be useful but your piece does show how many real-life applications it truly has. Might just try it out for a couple of my smaller projects. Thanks again!
Great write up and breakdown. Also freecodecamp is pretty awesome, I just started playing with it to refresh some of my knowhow. The static deployment is really smart, not sure about the one-server for the api though, isn't that a DDOS weakness or is it set to scale on Azure? [also figure azure probably has DDOS protection on it]
Have you looked into Netlify Functions feature? That could be a good fit for the API/backend in a serverless way. By the way, thanks for the post and for the great work on FCC!
Hi!
How about deployed a Nuxt as Jamstack with Strapi as CMS and MongoDB Atlas.
I dont know how cheap is to host in heroku strapi cms and mongodbatlas the database for a blog.
An amazing post from a while back, great stuff.
We also wrote a beginners guide for Jamstack - in case you want to learn more about Jamstack in 2020: ikius.com/jamstack-ebook
Hey Quincy - I really enjoyed your presentation on using the JAMstack. You seem like a humble, friendly guy.
I love freecodecamp
Nice article !
:)
Keep up !
😀