atinux / atidone

A full-stack application with Auth, SSR and SQL, running on the edge with Nuxt.
https://todos.nuxt.dev
MIT License
690 stars 68 forks source link
cloudflare-d1 drizzle-orm esr nuxt nuxt-ui nuxthub sqlite ssr vue

Manage your Todos with Atidone ☑️

A demonstration using Nuxt with server-side rendering on the edge, authentication and database querying using Cloudflare D1.

Deploy to NuxtHub

Features

Live demo

https://todos.nuxt.dev

https://github.com/atinux/atidone/assets/904724/5f3bee55-dbae-4329-8057-7d0e16e92f81

To see an example using Passkeys (WebAuthn) for authentication, checkout todo-passkeys.

Setup

Make sure to install the dependencies using pnpm:

pnpm i

Create a GitHub Oauth Application with:

Add the variables in the .env file:

NUXT_OAUTH_GITHUB_CLIENT_ID="my-github-oauth-app-id"
NUXT_OAUTH_GITHUB_CLIENT_SECRET="my-github-oauth-app-secret"

To create sealed sessions, you also need to add NUXT_SESSION_PASSWORD in the .env with at least 32 characters:

NUXT_SESSION_PASSWORD="your-super-long-secret-for-session-encryption"

Development

Start the development server on http://localhost:3000

npm run dev

In the Nuxt DevTools, you can see your tables by clicking on the Hub Database tab:

https://github.com/atinux/atidone/assets/904724/7ece3f10-aa6f-43d8-a941-7ca549bc208b

Deploy

You can deploy this project on your Cloudflare account for free and with zero configuration using NuxtHub.

npx nuxthub deploy

It's also possible to leverage Cloudflare Pages CI for deploying, learn more about the different options on https://hub.nuxt.com/docs/getting-started/deploy

Remote Storage

Once you deployed your project, you can connect to your remote database locally running:

pnpm dev --remote

Learn more about remote storage on https://hub.nuxt.com/docs/getting-started/remote-storage

License

MIT License