SveltePak is a tool that helps you build and launch web apps quickly. It offers smaller bundle sizes and fast page loads, aiming to enhance your development experience. You can make a one-time purchase for lifetime access to unlimited projects and support.
Features
Blazing-fast web app development
Build and launch web apps quickly using Svelte's efficient framework, resulting in smaller bundle sizes and faster page loads compared to React.
Lifetime access with one-time purchase
Get access to SveltePak's repository with a one-time payment, enabling unlimited use of the code for any number of projects.
GitHub support
Customers receive support through GitHub issues, allowing them to address problems and request help directly from the platform's development community.
Unlimited projects
Allows building as many projects as you want with the provided starter kit and code.
Frameworks
Includes SvelteKit and Vite for building the frontend applications.
Database
Uses Prisma for ORM, supporting a variety of databases.
Authentication
Provides Lucia Auth for integrating user authentication.
UI Components
Offers Shadcn/UI Svelte for ready-made UI components.
Headless UI
Utilizes Headless UI for building accessible component headless libraries.
CSS Framework
Incorporates Tailwind CSS for styling applications.
Internationalization
Includes SvelteKit i18n for adding multiple languages support.
Uses SvelteKit Email for managing email functionalities.
Payments
Integrates LemonSqueezy for handling payment processes.
Linting
Employs ESLint for identifying and fixing problems in JavaScript code.
Formatting
Uses Prettier for code formatting and consistent coding style.
Frameworks
Includes support for SvelteKit and Vite for building applications.
Database Integration
Uses Prisma ORM for database management.
Authentication
Lucia Auth is supported for handling user authentication.
User Interface
Built with SUI-Components and Tailwind CSS for styling.
Email Integration
Supports SvelteKit Email for sending emails.
Payments
LemonSqueezy is integrated for payment processing.
Internationalization
SvelteKit I18n is used for internationalizing applications.
Linting and Formatting
ESLint and Prettier are included for code linting and formatting.
Visual Studio Code Extensions
Recommended extensions for VSCode include Svelte for VSCode, Tailwind CSS IntelliSense, Prettier, ESLint, and i18n-ally. Additional recommended extensions are indent-rainbow and Pretty TypeScript Errors.
WebStorm/IntelliJ IDEA Extensions
Recommended extensions for WebStorm/IntelliJ IDEA include Svelte, Tailwind CSS, Prettier, ESLint, and i18n-ally.
Code Repository Updates
Guides users on updating their code base by performing a rebase of their code onto the latest version. Commands provided include `git pull` to update the code and `git rebase --continue` for resolving conflicts.
Update Dependencies
Instructs users to update dependencies by running the command `pnpm install`, which installs the latest versions of all dependencies.
Update Your Database
Explains how to update the database schema after code updates using the command `pnpm db-migrate`, ensuring the database is in sync with the latest code base.
Prisma ORM Integration
SveltePak uses Prisma ORM for database access, supporting a variety of databases such as PostgreSQL, MySQL, SQLite, and SQL Server. This allows easy integration within your application by providing an auto-generated query builder for TypeScript & Node.js.
Schema Updating
You can update your database schema by editing the file `./db/schema.prisma`. This feature helps in maintaining and evolving the database structure.
Generate Prisma Client
After updating your schema, generate the Prisma client with the command `pnpm db:generate`. This creates a client that allows easy database interaction.
Database Migration
After generating the Prisma client, you can migrate your database with the command `pnpm db:migrate` to apply schema changes.
Prisma Commands
A set of predefined commands such as `pnpm db:studio` for opening the Prisma Studio, `pnpm db:reset` for resetting the database, and `pnpm db:deploy` for deploying migrations. These commands help in managing and maintaining the database efficiently.
Endpoints
Defines API endpoints in the `src/trpc/routes` folder. New endpoints can be added by creating a corresponding file and importing it into `src/trpc/index.ts`.
Schemas
Allows definition of API schemas in separate files for type safety. Schemas are imported and used in endpoints to enforce data structure.
Context
A `ctx` object provides information about the request and can be extended using middleware in the `src/trpc/context` folder. Useful for handling authentication and logging.
Client-side Usage
Provides guidelines to access tRPC endpoints from a frontend application by calling endpoints and handling responses.
Auth Middleware
Checks if the user is authenticated and returns an error if not. Useful for ensuring that only authorized users can access certain endpoints.
Role Middleware
Checks if the user has the required role and returns an error if not. This ensures that only users with specific roles can perform certain actions.
Logger Middleware
Logs the request and response to the console. This is helpful for debugging and keeping track of the API interactions.
Lucia Auth Integration
Lucia Auth provides a simple and secure API for handling user authentication, including sign up, sign in, sign out, and password reset.
hooks.server.ts
A server-side file for authentication hooks, adding a layer of automation for user authentication, database transactions, and API requests.
auth.server.ts
Allows configuration of Lucia Auth, letting you define extra attributes to retrieve from users by modifying the `getSessionUser` function.
Two-factor authentication (2FA)
Enhances security by requiring a second factor, such as a mobile device, for authentication.
One-time passwords (OTP)
Supports OTPs for login and password reset via email or SMS.
OAuth
Built-in support for OAuth authentication, allowing integration with platforms like GitHub. Configuration is done in the oauth.clients.+ file.
User Roles
The application provides predefined user roles such as ADMIN and USER, each with differing access levels to manage parts of the application. Additional roles can be added by modifying the Role enum in the src/db/schema.prisma file.
Team Roles
The application includes predefined team roles like MEMBER, BILLING, ADMIN, and OWNER, offering different access levels to the application. They are defined in the TeamMemberRole enum.
SuperAdmin
The SuperAdmin role grants the highest level of access in the application, allowing management of all users and roles.
User Store
Provides the current user data, including user, team, role, personal team status, team memberships, admin status, and subscription details.
Team Membership Validation
Allows checking if a user is a member of a specific team.
Admin Check
A helper to determine if the current user has admin privileges.
Role Validation
Checks if the current user has a specified role.
User ID Matching
Verifies if the current user is the same as a provided user ID.
Additional Middlewares
Includes middlewares for protecting routes and includes examples of using auth and role middlewares in bRPC.
Multi-tenancy & Teams
Enables multiple users to form teams and manage data within their respective entities. Personal teams are automatically created for each user, similar to platforms like Vercel.
Opt-out of Multi-tenancy
Offers the ability to easily deactivate teams feature. Users can remove team-related UI and server-side logic without altering the database schema.
AI
Integrate AI capabilities into your SaaS application for enhanced features.
Storage
Provides options for managing and storing data securely.
Billing
Allows integration of billing services to handle transactions and payments.
Facilitates the sending and management of emails within the application.
Notifications
Enables sending of various notifications to users.