JavaScript Static Site Generator

Open-source JavaScript projects categorized as Static Site Generator | Edit details

Top 23 JavaScript Static Site Generator Projects

  • Next.js

    The React Framework

    Project mention: How to build a user-customizable design system with CSS modules | dev.to | 2022-01-25

    We’re using React, Nextjs, and CSS Modules. React is a frontend framework great for building dynamic and stateful UI. Nextjs enables server-side rendering out of the box, which leads to faster and more performant web pages. CSS modules allow styles to be scoped to the component they apply to. This is important as a codebase scales and class name collisions are more likely. You can read more about the challenges of CSS at scale here.

  • Gatsby

    Build blazing fast, modern apps and websites with React

    Project mention: Over 90 WordPress themes, plugins backdoored in supply chain attack | news.ycombinator.com | 2022-01-22

    The CMS space is incredibly crowded. The vast majority of WordPress websites would be cheaper, faster, and more secure if they were just moved to SquareSpace, which has the WordPress features that 99% of sites would need.

    For more custom projects, I prefer the headless variety[1] because it makes sense to separate the data and presentation layers. That means you have the full ecosystem and flexibility of HTML/CSS/JS.

    Ghost[2] was the first serious competitor I saw years ago. Gatsby is among the most popular these days[3].

    But honestly, information sites should just use SquareSpace or something like it. There's no reason to maintain static site infrastructure at this point.

    1. https://jamstack.org/

    2. https://ghost.org/

    3. https://www.gatsbyjs.com/

  • SonarQube

    Static code analysis for 29 languages.. Your projects are multi-language. So is SonarQube analysis. Find Bugs, Vulnerabilities, Security Hotspots, and Code Smells so you can release quality code every time. Get started analyzing your projects today for free.

  • Hexo

    A fast, simple & powerful blog framework, powered by Node.js.

    Project mention: A personal blog with articles&videos, which tech stack do you recommend? | news.ycombinator.com | 2022-01-26

    I have personally used hexo[1] successuccessfully in th epast and would recommend it. Though any ssg, likd zola[2], should be enough.

    If youyou're comfortcomfortable writing html directly it will also suffice. Make a list of what you need (posts, kmages, videos , comments) and compare SSGs[3].

    [1]: https://hexo.io/

  • VuePress

    📝 Minimalistic Vue-powered static site generator

    Project mention: Add BootstrapVue to VuePress | dev.to | 2022-01-25

    The first thing we need to do is create a new VuePress project. It's really easy with the latest version of npm or yarn. From the VuePress docs

  • netlify-cms

    A Git-based CMS for Static Site Generators

    Project mention: SvelteKit App databases | reddit.com/r/sveltejs | 2022-01-20

    Netlify CMS + Flatbread work great together with SvelteKit. I use that combo for most of my freelance work for small businesses.

  • eleventy 🕚⚡️

    A simpler static site generator. An alternative to Jekyll. Transforms a directory of templates (of varying types) into HTML.

    Project mention: A story of how we migrated to pnpm | dev.to | 2022-01-26

    We have been using Yarn 2 for quite some time, having originally switched to it for its native workspace support which is great for monorepos as we happen to have one. Because we use a lot of different dev tools (in no particular order - Vite, Vitepress, Astro, esbuild, Webpack, Eleventy, Firebase tools, Tailwind...) and many more actual dependencies. It's easy to understand how many dependencies we're bound to have when you see all the frameworks we support, whether on WebComponents.dev or on Backlight.

  • react-static

    ⚛️ 🚀 A progressive static site generator for React.

    Project mention: [React] Busco una persona de frontend para que me ayude con un proyecto personal | reddit.com/r/CharruaDevs | 2021-12-14
  • OPS

    OPS - Build and Run Open Source Unikernels. Quickly and easily build and deploy open source unikernels in tens of seconds. Deploy in any language to any cloud.

  • Gridsome

    ⚡️ The Jamstack framework for Vue.js

    Project mention: Curated collection of best tools for Software Testing | dev.to | 2022-01-13

    This site is built with help of excellent static site generator Gridsome, Buefy and Bulma CSS and JSON file as a data source.

  • Metalsmith

    An extremely simple, pluggable static site generator.

    Project mention: Why I built my own static site generator | news.ycombinator.com | 2021-10-14

    A static site generator I've been enjoying lately (and using for my blog) is Metalsmith: https://metalsmith.io/

    It feel like it's the best of both worlds, because it's simple to learn and customize, but there are plugins for the things you don't want to spend time writing yourself.

    For example, I'm using plugins to: check for broken links, generate an RSS feed, and run a test server with automatic reloading.

    But then I was able to easily add in my own code to handle relative links, generate Graphviz diagrams, and format dates.

    One other recommendation: I hated almost every template language I ran across (Hugo's, Liquid, Nunjucks, EJS), but I'm thrilled with the simplicity of Handlebars (https://handlebarsjs.com/), although it is a bit limiting and the "block helper with parameters" syntax is strange (perhaps an indicator that I'm trying to do too much in the templating language!).

  • prerender-spa-plugin

    Prerenders static HTML in a single-page application.

    Project mention: Vue3: Render each route to an html page | reddit.com/r/vuejs | 2021-08-10

    With Vue3, its possible to pre-render each page with `https://github.com/chrisvfritz/prerender-spa-plugin` However, I would like to render each page to an actual html file, so that `vue-router` will not be used, but instead the server will take care of serving each page. Is that possible?

  • react-snap

    👻 Zero-configuration framework-agnostic static prerendering for SPAs

    Project mention: React Libraries | dev.to | 2021-12-07

    react-snap - Zero-configuration framework-agnostic static prerendering for SPAs

  • cms.js

    Client-Side JavaScript Site Generator

  • nextra

    The Next.js Static Site Generator

    Project mention: Do you know a good website builder like wordpress but in javascript or typescript ? | reddit.com/r/selfhosted | 2022-01-13

    https://nextra.vercel.app/ maybe?

  • saber

    ()==[:::::::::::::> Build static sites in Vue.js, without the hassle (by saberland)

    Project mention: If Doge hits $1 I may finally be able to fund my game! | reddit.com/r/dogecoin | 2021-04-19

    https://github.com/saberland/saber (a static website generator) I'm currently rewriting this one.

  • staticman

    💪 User-generated content for Git-powered websites

    Project mention: Add A Comment System To A Jekyll Blog Using Staticman - 1 / 2 | dev.to | 2021-10-14

    Another possible solution to add dynamic content to a GitHub website is to use staticman. On the opposite of the previous solutions using external databases, staticman creates files in your repository, updating your website statically. It is free and open-source but not as straightforward to implement as disqus. The nice thing is that it will store all your comments in your git repository, so there is no risk of losing them.

  • gatsby-starter-ghost

    A starter template to build lightning fast websites with Ghost & Gatsby

    Project mention: Switching from WordPress to GatsbyJS | reddit.com/r/javascript | 2021-03-21

    I used https://github.com/TryGhost/gatsby-starter-ghost, which isn't quite a theme, but comes with a decent amount of complexity, and some bugs.

  • sigal

    yet another simple static gallery generator

    Project mention: How to set up environment to work in a package? | reddit.com/r/learnpython | 2021-09-10

    The tool is Sigal, posted on https://github.com/saimn/sigal. I've forked it already, and cloned it down to my own machine, and have the repo open in VSCode.

  • Charge

    ⚡️ An opinionated, zero-config static site generator.

  • nanogen

    Minimalist static site generator in Node.js

    Project mention: How to create / store "complicated blog post" without plain HTML? | reddit.com/r/webdev | 2021-09-23

    Absolutely. I'm limited to nanogen ( https://github.com/doug2k1/nanogen ) as far as ejs, but maybe it does what you are looking for. It doesn't support markdown and ejs as a single file afaik,... Could be wrong. I just render my markdown with a markdown js library client side with data pulled from an API. Idk, lots of options I suppose. But anything's possible.

  • tinyjam

    A radically simple, zero-configuration static site generator in JavaScript

  • api2html

    A CLI tool to transform Swagger/OpenAPI/AsyncAPI docs to beautiful HTML pages via Shins/Widdershins.

    Project mention: Ask HN: Is OpenAPI Documentation Superior? | news.ycombinator.com | 2021-03-25
  • framework-info

    Framework detection utility

    Project mention: TIL: The way Netlify detects which framework your code uses is open source | reddit.com/r/programming | 2021-07-01
  • rocket

    The modern web setup for static sites with a sprinkle of JavaScript (by modernweb-dev)

    Project mention: A story of how we migrated to pnpm | dev.to | 2022-01-26

    Another kind of problem we ran into is some dependencies having undeclared dependencies. When using yarn it was not a problem because those undeclared dependencies are sometimes very used. For example, after the migration we realized mdjs-core had not declared its dependency on slash.

NOTE: The open source projects on this list are ordered by number of github stars. The number of mentions indicates repo mentiontions in the last 12 Months or since we started tracking (Dec 2020). The latest post mention was on 2022-01-26.

JavaScript Static Site Generator related posts

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 80,306
2 Gatsby 52,188
3 Hexo 34,083
4 VuePress 19,863
5 netlify-cms 14,879
6 eleventy 🕚⚡️ 11,243
7 react-static 10,003
8 Gridsome 8,060
9 Metalsmith 7,709
10 prerender-spa-plugin 7,064
11 react-snap 4,599
12 cms.js 3,023
13 nextra 2,782
14 saber 2,140
15 staticman 2,113
16 gatsby-starter-ghost 875
17 sigal 736
18 Charge 388
19 nanogen 183
20 tinyjam 123
21 api2html 107
22 framework-info 104
23 rocket 94
Find remote jobs at our new job board 99remotejobs.com. There are 30 new remote jobs listed recently.
Are you hiring? Post a new remote job listing for free.
Less time debugging, more time building
Scout APM allows you to find and fix performance issues with no hassle. Now with error monitoring and external services monitoring, Scout is a developer's best friend when it comes to application development.
scoutapm.com