https://github.com/drgarlic/svind

:twisted_rightwards_arrows: A boilerplate with the Svind stack (Svelte, Vite, Vercel and Tailwind)
https://github.com/drgarlic/svind

boilerplate pwa svelte svelte3 tailwind tailwindcss vercel vite

Last synced: about 1 month ago
JSON representation

:twisted_rightwards_arrows: A boilerplate with the Svind stack (Svelte, Vite, Vercel and Tailwind)

• Host: GitHub
• URL: https://github.com/drgarlic/svind
• Owner: drgarlic
• License: mit
• Archived: true
• Created: 2019-10-27T21:35:35.000Z (about 5 years ago)
• Default Branch: master
• Last Pushed: 2021-02-22T17:22:09.000Z (over 3 years ago)
• Last Synced: 2024-09-18T15:21:35.418Z (about 2 months ago)
• Topics: boilerplate, pwa, svelte, svelte3, tailwind, tailwindcss, vercel, vite
• Language: Svelte
• Homepage: https://svind.vercel.app/
• Size: 6.73 MB
• Stars: 45
• Watchers: 5
• Forks: 7
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Svind

## Description

The Svind stack (Svelte, Vite, Vercel, Tailwind) brings a whole new DX. This boilerplate aims to bring this experience to you with everything already setup with a few extras (such as full PWA support with custom service worker).

## Goals

- Vite with HMR

- PWA

  - Notification prebuilt when a new version has been downloaded by the service worker

  - Icons and `manifest.json` automatically generated from configuration files and an image when building for production

  - Automatically updates the meta tags of the `index.html` when building for production

- SEO

  - [100/100/100/100 lighthouse score by default](https://lighthouse-dot-webdotdevsite.appspot.com//lh/html?url=https%3A%2F%2Fsvind.now.sh%2F)

  - Easy meta tags thanks to built in Svelte support

  - `sitemap.xml` generated on demand via a now function

- Service worker

  - Easy to understand, no fancy library

  - Fully customizable

  - Support for all the different fetching methods

  - Precaches all the files and routes once the web app has loaded

  - Automatically updates on build via Gulp (cache name and precached files)

- CSS

  - Integrated Tailwind CSS

    - With dark/light mode support

    - and a few other things

  - Purged and nano-tized when building for production

- Router

  - Dynamic route import for code splitting

- Images

  - `webp` version of your images generated automatically

  - [Component](https://github.com/gawlk/svind/blob/master/src/components/Image.svelte) pre created to support both the original image and the `webp` version

  - Automatic image optimization when building for production

- Vercel

  - Example functions and integration

  - To make it work properly, you'll need to change the settings on your project page on https://vercel.com to

    - Build command: `yarn build`

    - Deploy folder: `dist`

    - Development command: `yarn dev --port $PORT`

- CI

  - Basic build test on push

## Setup

```bash

git clone https://github.com/gawlk/svind

cd svind

yarn

```