Sveltekit Starter screenshot

Sveltekit Starter

Author Avatar Theme by Navneetsharmaui
Updated: 8 Feb 2022
624 Stars

Sveltekit starter project created with sveltekit, typescript, tailwindcss, postcss, husky, and storybook. The project has the structure set up for the scaleable web application.

Categories

Overview

Sveltekit Starter is a project template built with Sveltekit, TypeScript, Tailwindcss, Postcss, SCSS, Husky, ESLint, Prettier, Storybook, and Jest. It includes setup for Server Side Rendering (SSR) and is designed with SEO in mind. The template is easy to configure and has a scalable structure. It also has a variety of features such as PWA support, Tailwindcss and SCSS syntax support, global style and variable preconfiguration, StorybookJS integration, browser sync functionality, and optimized performance with high scores on Google Speedpage and Lighthouse reports. The project also includes preconfigured TypeScript, TSPaths for absolute imports, and tools like Prettier, ESLint, Husky, and dotfiles for easy development workflow.

Features

  • Server side rendering built with SEO in mind
  • PWA support with service worker and offline capabilities
  • Tailwindcss + Postcss + SCSS syntax support in Postcss
  • Global style and variable preconfigured for Postcss
  • StorybookJS preconfigured with postcss support
  • Browser sync for auto refresh and auto reload
  • 100% scores on Google Speedpage and Lighthouse report
  • Friendly and scalable boilerplate
  • TypeScript + TSPaths preconfigured for absolute imports in components
  • Prettiers, ESLint, and Husky preconfigured for code formatting and linting
  • GitHub and Vscode dotfiles preconfigured for easy setup and development

Installation

To use Sveltekit Starter, you can either clone the repository or use the npx degit command. Once you have the project on your local machine, follow these steps:

  1. Install the dependencies by running one of the following commands:

    • npm install
    • yarn install
    • pnpm install
  2. Start the development server by running one of the following commands:

    • npm run dev
    • yarn run dev
    • pnpm run dev
  3. To build the project for static SSR, run one of the following commands:

    • npm run build:static:ssr
    • yarn run build:static:ssr
    • pnpm run build:static:ssr
  4. To preview the production build, use one of the following commands:

    • npm run preview
    • yarn run preview
    • pnpm run preview

Summary

Sveltekit Starter is a powerful project template created with Sveltekit and several other technologies for efficient and scalable web development. It offers a wide range of features including server side rendering, PWA support, Tailwindcss integration, global style and variable configuration, StorybookJS integration, browser sync functionality, and optimized performance. The template also comes with preconfigured TypeScript support, code formatting and linting tools, and GitHub/Vscode dotfiles for easy setup and development. With its easy configuration and scalable structure, Sveltekit Starter is a valuable tool for building modern web applications.