Project Structure
This is the basic structure of the boilerplate:
Lib src/lib/
The lib
folder contains all the components and scripts regarding UI components and client SDKs.
Server src/lib/server/
In the server
folder you’ll find client SDKs and scripts to be used in the server side, such as the Drizzle, OpenAI, Loops and Stripe SDks.
server
folder from being exposed to the client.In src/lib/server/database
you’ll also find the database schema file and migration scripts.
UI src/lib/ui/
In the ui
folder you’ll find all the UI components used in the project. The app
folder contains the main components of the app, the components
folder contains all the components used in the app, the icons
folder contains all the icons used in the app and the marketing
folder contains all the components used in the marketing pages.
Routes src/routes/
App src/routes/(app)/
All of the routes that are behind a login wall are inside the (app)
folder.
Auth src/routes/(auth)/
Auth pages like login are in the (auth)
folder.
Landing src/routes/(landing)/
Landing pages are in the (landing)
folder. These are public and always accessible, whether the user is logged in or not. You should optimize these pages for SEO and conversion.
API src/routes/api/
The api
folder contains all the API endpoints. These are server-side only and are not exposed to the client.
Hooks hooks.server.ts
In the hooks.server.ts
file you’ll find all the hooks used in the project. Auth is mostly handled here, as well as redirecting users to the correct pages based on their auth status.