info

info is a personal website built using webpack, webpack-dashboard, and jest. It is automatically deployed to GitHub Pages via GitHub Actions.

1. Clone the repository: git clone git@github.com:zkm/info.git

2. Navigate to the project directory: cd info

3. Ensure Corepack is enabled (for Yarn 4):

   corepack enable

4. Install the dependencies:

   yarn

Requirements

• Node.js 22+
• Yarn 4 (Berry) via Corepack

Install dependencies and start the dev server with HMR:

yarn
yarn start

Build a production bundle to dist:

yarn build

The dev server opens in your default browser and serves at:

• http://localhost:8888

To run the app in development mode with webpack-dashboard: yarn start

This will start the development server and open the app in your default browser. Any changes you make to the source code will automatically trigger a hot reload.

To build the app for production: yarn build

This will generate optimized and minified assets in the dist directory.

To run the tests: yarn test

This will execute the test suite and provide feedback on the test results.

• Format: yarn format
• Lint: yarn lint (check) or yarn lint:fix (auto-fix)

yarn check runs format:check, lint and test without modifying files, and yarn build runs it before bundling (CI does the same). Use yarn format and yarn lint:fix locally to apply fixes.

Note: yarn format (Prettier) intentionally does not include src/index.hbs. Prettier has no dedicated parser for classic Handlebars documents and falls back to its Glimmer (Ember template) parser for .hbs files, which doesn't recognize a full HTML document and silently drops content it doesn't understand — including the <!DOCTYPE html> declaration. If you need to reformat index.hbs, do it by hand rather than adding it back to the format script's glob.

Deployments are automated. On every push to main:

• GitHub Actions builds the app (yarn build).
• The dist folder is published to GitHub Pages (Source: GitHub Actions).

View your live site at: https://zkm.github.io/info/

Manual deploy: You can trigger the workflow from the Actions tab using “Run workflow”.

Notes

• Build output directory: dist (see webpack.config.prod.js).
• The workflow file is at .github/workflows/gh-pages.yml and uses the official Pages actions (upload-pages-artifact and deploy-pages).

• If the site looks outdated, check the latest runs of the deploy workflow and confirm the "Deploy to GitHub Pages" job succeeded. A page URL is shown on success.
• Ensure dist contains index.html and assets after yarn build.
• Pages source should be set to "GitHub Actions" in repo Settings → Pages.

This project uses webpack-dashboard both via the CLI wrapper in the start script and the plugin in webpack.config.dev.js. It works out of the box; no extra configuration is required. To customize the theme or layout, adjust the new DashboardPlugin({ ... }) options in webpack.config.dev.js and refer to the webpack-dashboard documentation.

• Webpack Documentation
• Webpack Dashboard Documentation
• Jest Documentation

This project is licensed under the MIT License.