Skip to content

A Svelte TS starter repo w/ TypeScript, TailwindCSS, Flowbite-Svelte, Svelte-Spa-Router, & sample data fetching from backend API.

Notifications You must be signed in to change notification settings

Korg666999/svelte-ts-starter

 
 

Repository files navigation

Svelte TS Starter

This Svelte TS starter template provides a foundation for developing with Svelte and Vite, including preconfigured support for Typescript, TailwindCSS, Flowbite-Svelte, and Svelte-Spa-Router. Additionally, it includes a sample implementation of fetching data from a backend API, making it easy to integrate with your own server-side infrastructure.

  • Vite
  • Svelte
  • Typescript
  • Tailwind CSS
  • Flowbite-Svelte
  • Svelte-Spa-Router

Installation

git clone [email protected]:shinokada/svelte-ts-starter.git my-app
cd my-app
pnpm i

Backend API env value

Update your backend API value in .env:

API_ENDPOINT=http://localhost:3000/api
API_SECRET=1234

Start a local server

npm run dev

How to use this for GitHub page

There is the github-page branch. Please note that it is not gh-pages. Checkout to this branch and install packages, build and deploy.

git checkout github-page
pnpm i
npm run build
npm run deploy

This will deploy your GitHub page to https://<username>.github.io/<repository name> URL. Don’t forget to change the username and repository name to your personal Github username and repository. It may take a couple of minutes. You can check the progress in GitHub Actions tab.

DIY GitHub pages

pnpm i -D gh-pages

Add the following to the package.json scripts:

 "deploy": "npx gh-pages -d dist"

Update vite.config.ts

import { defineConfig } from 'vite'
import { svelte } from '@sveltejs/vite-plugin-svelte'

// https://vitejs.dev/config/
export default defineConfig({
  base: "/svelte-ts-starter/",
  plugins: [svelte()],
})

Build and deploy:

npm run build
npm run deploy

About

A Svelte TS starter repo w/ TypeScript, TailwindCSS, Flowbite-Svelte, Svelte-Spa-Router, & sample data fetching from backend API.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • Svelte 56.9%
  • JavaScript 27.6%
  • TypeScript 13.0%
  • HTML 1.9%
  • CSS 0.6%