SaaSHub helps you find the best software and product alternatives Learn more →
Top 23 JavaScript Static Site Generator Projects
-
SurveyJS
Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
-
eleventy 🕚⚡️
A simpler site generator. Transforms a directory of templates (of varying types) into HTML.
-
InfluxDB
Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.
-
gatsby-garden
A Digital Garden Theme for Gatsby. Gatsby Garden lets you create a static HTML version of your markdown notes
-
SaaSHub
SaaSHub - Software Alternatives and Reviews. SaaSHub helps you find the best software and product alternatives
Let's take Next.js for example. How it introduces routing to the users is far from how the actual routing works under the hood. Just to grasp what I am saying, the Next npm package is 86MB compared to the base React repo which is just over 300kB. For most projects, the only thing you do is have 10-15 pages, maybe have Stripe and a few charts, some side effects, basic state management, and that's it. Why do you need 86MB of code, all that learning curve, and the poor documentation of Next.js for your next project?
The first time I started building static websites is when I discovered Gatsby. I built several projects using Gatsby and hosted it on Netlify free tier. It felt like a really robust architecture and I loved that it was free.
Following one of the comments in this thread I reviewed two other products in this space - https://www.staticcms.org/ and https://decapcms.org/ - and it looks like the webpages are almost a direct copy of one another, one in dark mode and one in light mode.
I'm a technical product marketer, and I find these type of landing page copying amusing to no end.
Now that you're familiar with why Eleventy + Storyblok is my ideal combination and how to seamlessly query data from Storyblok for use in an Eleventy project, it's time for the next exciting step: let's embark on creating a complete blog site using these two phenomenal technologies!
Thanks for reading!
The web tech stack is actually one of my biggest regrets. It's a static site generator called Gridsome[0] that the maintainers abandoned about three months after I used it to launch the TinyPilot website.
At the time I made the TinyPilot site, I was very excited about Vue, so a Vue-based SSG seemed great. Since then, I've come to find SPAs and most frontend frameworks to be way too much complexity, so I've moved away from Vue, but the TinyPilot website is still stuck on Vue 2.x and bootstrap-vue (which is tied to Vue 2 and Bootstrap 4).
So, it keeps creaking along, but building the 100ish pages on the site takes about five minutes, whereas I think something like Hugo could probably do it in a few seconds. Plus, we get random runtime errors[1] that are pretty hard to debug.
[0] https://gridsome.org/
[1] https://github.com/nuxt/nuxt/issues/5800
Project mention: Why You Should Write Your Own Static Site Generator | news.ycombinator.com | 2023-11-03
Project mention: Thumbsup: Static web galleries for all your photos and videos | news.ycombinator.com | 2024-02-15
JavaScript Static Site Generator related posts
-
Create a Blog with Eleventy and Storyblok
-
Composable architecture example: Go headless (best practices)
-
Converting BlogCFC blog to Eleventy
-
Ask HN: What's the simplest static website generator?
-
How to Integrate Astro With ApostropheCMS pt. 1
-
Building a High-Performance Website with Next.js and WordPress
-
Creating excerpts in Astro
-
A note from our sponsor - SaaSHub
www.saashub.com | 22 May 2024
Index
What are some of the best open-source Static Site Generator projects in JavaScript? This list will help you:
Project | Stars | |
---|---|---|
1 | Next.js | 121,256 |
2 | Gatsby | 55,049 |
3 | VuePress | 22,371 |
4 | decap-cms | 17,538 |
5 | eleventy 🕚⚡️ | 16,319 |
6 | react-static | 10,293 |
7 | Gridsome | 8,525 |
8 | Metalsmith | 7,819 |
9 | react-snap | 5,033 |
10 | cms.js | 3,043 |
11 | staticman | 2,375 |
12 | saber | 2,148 |
13 | gatsby-starter-decap-cms | 2,057 |
14 | gatsby-starter-ghost | 1,051 |
15 | sigal | 856 |
16 | thumbsup | 749 |
17 | Charge | 423 |
18 | rocket | 363 |
19 | presskit.html | 288 |
20 | dot-hugo | 254 |
21 | nanogen | 199 |
22 | tinyjam | 148 |
23 | gatsby-garden | 143 |
Sponsored