parcel-static-template icon indicating copy to clipboard operation
parcel-static-template copied to clipboard

Start a simple static site with components and hot reloading.

parcel-static-template

Start a simple static site with components.

Note: This is an opinionated basic template to save some time for future projects.

  • ✨️ Zero-config bundler for HTML/SCSS/JS using Parcel.
  • πŸ”₯ Hot Module Reloading
  • 😎️ Supports ES6 out of the box.
  • 🧱️ Render simple HTML components.
  • πŸ’―οΈ Render inline SVGs from files using a special <icon> element.
  • πŸ“ΈοΈ Automatic image optimization.
  • πŸš€οΈ Images are converted to WEBP for better performance with <img> elements transformed into <picture> elements that display WEBP in supported browsers and fallback to original image.
  • πŸ•΅οΈ Obfuscate mailto links to prevent scraper spam.
  • πŸ”οΈ Easily repeat blocks for prototyping.
  • πŸ”’οΈ Automatically add noopener noreferrer to links to prevent this vulnerability.

Quick start for your own site

Deploy to Netlify & fork to a new repo πŸ‘‰οΈ Deploy to Netlify

Running it locally

  1. Install required packages with yarn install
  2. Start your local development server with yarn start

Deploying

Run yarn build to create an optimized production build in /dist which can be deployed as a website.


To-do

  • [ ] Automatically set loading="lazy" for image elements.