Introduction

KianKit is an open-source starter kit designed to simplify rapid application development. Built on top of SvelteKit, it provides an efficient way to kickstart your project by eliminating repetitive setup tasks, allowing developers to focus on building impactful features. With a range of integrated technologies, KianKit aims to make web development quick, fun, and accessible.

Tech Stack

KianKit leverages the following technologies to provide a solid foundation for your application:

  • SvelteKit: A modern, file-based framework for building web applications with Svelte.
  • Supabase: An open-source backend-as-a-service alternative to Firebase.
  • Shadcn/ui: A library of customizable UI components.
  • Tailwind CSS: A utility-first CSS framework for rapid UI development.
  • Lucide Icons: A collection of open-source icons for your application.
  • Fortawesome: Popular icon library for additional graphical elements.

Getting Started

Ready to jump in? Let's go!

Prerequisites

Before starting, ensure you have the following tools ready:

  • npm installed on your machine.
  • A Supabase project created.

Installation Steps

  1. Clone the repository: 
    git clone <repository-url>
  2. Install dependencies: 
    npm install
  3. Setup environment variables:
    • Rename .env.example to .env and fill in the necessary Supabase credentials.

Running the Project

With everything set up, you can run the project locally:

pnpm run dev

KianKit is now running, and you're ready to start building!

Development

KianKit comes with a well-structured setup to streamline the development process. Here's an overview:

Project Structure


src/lib/
├── components/    # UI components used across the application
├── layouts/       # Structures for different pages or sections
├── schemas/       # Data validation and structures
├── server/        # Server-side utilities
└── utils.js       # General helper functions

src/routes/
├── (app)/         # Main application routes
├── (auth)/        # Authentication-related pages (e.g., login, signup)
├── (landing)/     # Landing and promotional pages
└── sitemap.xml/   # Directory for generating a sitemap for SEO

static/            # Static assets like images and fonts

OAuth & Email Configuration

  • OAuth Setup: Set up OAuth with popular providers like Google and GitHub.
  • Email Authentication: Configure an SMTP server for email & password authentication. Consider using services like Resend for easy setup.

Customization

KianKit is fully customizable, with integrated technologies like Svelte, Supabase, Tailwind CSS, and Lucide Icons to help you build modern and responsive applications efficiently.

Feel free to modify the components, utilities, and routes to match your project requirements. The starter kit is built to be flexible, empowering you to bring your ideas to life quickly and effectively.