Install dependencies with npm install (or pnpm install or yarn), start a development server:

npm install
npm run dev

A database has been integrated to this excercise making this a full-stack app! 🚀 This would allow us to save our favorite dogs per login session. Each pair of unique name and email will reference their own saved favorite dogs.

Lets start with the environment variables. First rename .example.env to .env.

Since we are using JWT for authenticating the user's queries to our own database, we generate our own JWT secret. With node installed, run the command below and save this output to the .env variable SECRET_JWT_SECRET

node -e "console.log(require('crypto').randomBytes(32).toString('hex'))"

For deploying the production database, I used Turso which uses libSQL (a fork of SQLite) under the hood.

For development purposes, you can ignore the SECRET_DB_AUTH_TOKEN since it is only used in the production database with Turso.

To run the database locally, install the libSQL from their releases page. You can use the installation script to install libSQL below. After installing, take note of the installation path and add it to your PATH environment variables. (MacOS/Linux/WSL only). You can also install and run with the Docker Container.

curl -fsSL https://github.com/libsql/sqld/releases/download/v0.21.9/sqld-installer.sh -o sqld-installer.sh
sudo chmod +x sqld-installer.sh
./sqld-installer.sh

# NOTE: your path might be different
echo 'export PATH="$PATH:/home/kenny/.cargo/bin"' >> ~/.bashrc

# OR: You can also install with brew
brew tap libsql/sqld
brew install sqld-beta

To check if you installed the db correctly, restart your terminal and run sqld --version.

Run sqld -d ./tmp/data.db --http-listen-addr=127.0.0.1:8080 to start the database. This will store your data locally in ./tmp/data.db. Set SECRET_DB_URL=http:https://127.0.0.1:8080 in your .env file.

To interact with our database we are using Drizzle ORM which allows us to make type-safe calls to our database using TypeScript. (You can think of this as a TypeScript wrapper for SQL as it outputs SQL files which you can see in the drizzle/migrations folder). Run the npm commands to generate the schema and perform migrations to your database. Convienently, Drizzle comes with a user interface to display and interact with your SQL data.

npm run generate
npm run migrate
npm run studio # (Optional) Starts the database UI on port :3333

• 🔗 SvelteKit
• 🎨 Skeleton UI + TailwindCSS
• ⚡ SuperForms Client/Server Zod Form Validation
• 😄 Iconify Icon Library
• 🐕 Dog Pic Source Attribution: Created by Lum3n

• 🔺 Vercel: SvelteKit Server Deployment
• 📁 libSQL: SQLite Database
• 🗄️ Drizzle ORM: TypeScript SQL ORM
• 🗃 Turso: Server Deployment

Tests can be ran with npm run test. By default, SvelteKit comes with Vitest and Playwright used for unit testing. See index.test.ts and tests directory for testing.