‚̧Neurotic Pumpkin Murderer

    hydrogen-cli
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.0¬†‚Äʬ†Public¬†‚Äʬ†Published

    ūüéą Hydrogen

    Voted the world's lightest static-site generator built with TypeScript ‚̧ It uses ūüĒ• lit-html inspired templating for super duper performant template generation.

    BTW Hydrogen is much faster than @11ty/eleventy ūüėú

    Netlify Status Version codecov Downloads/week License

    Features

    • ‚ö° Millisecond Builds. With the global average attention span being 8 seconds, why wait seconds for your builds when you can wait milliseconds. Read the SLA.
    • ūüĒ• JavaScript Templates. With ES6 template literals, who needs template engines like pug and handlebars. You now have access to the full-power of a JavaScript.
    • ūüĒĆ Use External APIs. Plug into your data with remote APIs.
    • ūüē∂ Powerful Metadata API. Get the best SEO for your static pages.

    Quick start

    Add Hydrogen CLI to your project

    $ yarn add hydrogen-cli

    Create a simple index.js file with below code

    const page = ({ title, data, head }) => `
      <!DOCTYPE html>
      <html>
        <head>
          <title>${title}</title>
          ${head}
        </head>
        <body>
          <h2>${data.project}</h2>
          <p>${data.description}</p>
        <body>
      </html>
    `;
     
    module.exports = {
      page,
      title: 'Welcome to Hydrogen',
      data: () => ({
        project: 'Hydrogen',
        description: 'Super fast static-site generator'
      }),
      head: ({ data }) => [
        ['meta', { name: 'description', content: data.description }]
      ]
    }

    Run the below command to generate your template to HTML

    $ npx hydrogen generate index.js

    The below HTML is outputted to an HTML file with the same name as the source index.html

      <!DOCTYPE html>
      <html>
        <head>
          <title>Welcome to Hydrogen</title>
          <meta name="description" content="Super fast static-site generator" />
        </head>
        <body>
          <h2>Hydrogen</h2>
          <p>Super fast static-site generator</p>
        <body>
      </html>

    If you want to see a more advanced setup using Hydrogen, checkout ‚öô Advanced Setup

    Development

    Pull requests are more than welcome :)

    1. Install Docker
    2. Clone repo
    3. All commands are in the package.json file

    Run the below commands:

    $ yarn docker:setup # Builds Docker image and create Docker container 
     
    $ yarn docker:start # Starts Docker image 
     
    $ yarn docker:cli:dev # Runs CLI in dev mode 

    This will run your changes to the Hydrogen CLI over the Hydrogen documentation

    Note: There are pre-commit and pre-push hooks that run tests

    Roadmap

    V1

    • Debugging - How to debug a Hydrogen build process
    • Project rewrite - To improve modularity
    • Improve documention

    Keywords

    Install

    npm i hydrogen-cli

    DownloadsWeekly Downloads

    7

    Version

    1.0.0

    License

    MIT

    Unpacked Size

    28 kB

    Total Files

    30

    Last publish

    Collaborators

    • shailen