https://github.com/magiclabs/example-nextjs-faunadb-todomvc
https://github.com/magiclabs/example-nextjs-faunadb-todomvc
Last synced: about 1 year ago
JSON representation
- Host: GitHub
- URL: https://github.com/magiclabs/example-nextjs-faunadb-todomvc
- Owner: magiclabs
- Created: 2020-10-15T02:50:25.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2023-03-05T14:16:56.000Z (over 3 years ago)
- Last Synced: 2023-03-06T02:38:18.008Z (over 3 years ago)
- Language: JavaScript
- Homepage: example-nextjs-faunadb-todomvc.vercel.app
- Size: 470 KB
- Stars: 26
- Watchers: 5
- Forks: 10
- Open Issues: 8
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# FaunaDB with Magic Authentication (featuring Next.js)
Follow along with [the official tutorial](https://docs.magic.link/guides/todomvc) to build your own FaunaDB-powered TodoMVC app with Magic passwordless login!
👉 See the [live demo](https://example-nextjs-faunadb-todomvc.vercel.app/login)
## Deploy your own
Deploy the example with [Vercel](https://vercel.com/docs):
[](https://vercel.com/new/git/external?repository-url=https%3A%2F%2Fgithub.com%2Fmagiclabs%2Fexample-nextjs-faunadb-todomvc&env=NEXT_PUBLIC_MAGIC_PUBLISHABLE_KEY,MAGIC_SECRET_KEY,FAUNADB_SECRET_KEY,ENCRYPTION_SECRET)
## Configuration
Login to the [Magic Dashboard](https://dashboard.magic.link/) to get API keys for your application.

Next, you'll create a FaunaDB database for your application [here](https://dashboard.fauna.com/db-new/). Once you've configured your database, you'll need to prepare it for the schema expected by this example code. Execute the step-by-step queries found in [`init.fql`](./init.fql) from either [FaunaDB's CLI](https://github.com/fauna/fauna-shell) or FaunaDB's Dashboard shell interface. Finally, you'll need to acquire an admin access key for your database (located in the `"Security"` page of FaunaDB's Dashboard sidebar).
Next, create a `32` random string as your encryption secret. You can create one in the terminal with openssl running `openssl rand -base64 24`
Next, copy the `.env.local.example` file in this directory to `.env.local` (this file is intentionally ignored by Git):
```bash
cp .env.local.example .env.local
```
Then, set each variable in `.env.local`:
- `NEXT_PUBLIC_MAGIC_PUBLISHABLE_KEY` should look like `pk_test_abc` or `pk_live_ABC`
- `MAGIC_SECRET_KEY` should look like `sk_test_ABC` or `sk_live_ABC`
- `FAUNADB_SECRET_KEY` should look like `fnRB4Ld...`
- `ENCRYPTION_SECRET` should look like a random string of `32` chars
To complete your deployment on Vercel, you'll need to configure some environment variables with the [Environment Variables UI](https://vercel.com/blog/environment-variables-ui) or using the [Vercel CLI](https://vercel.com/download) ([Documentation](https://vercel.com/docs/cli#commands/env)).
Install [Vercel CLI](https://vercel.com/download); log in to your account from the CLI; link your project; then run the following command to add the `NEXT_PUBLIC_MAGIC_PUBLISHABLE_KEY`, `MAGIC_SECRET_KEY`, `FAUNADB_SECRET_KEY`, and `ENCRYPTION_SECRET` environment variables.
```bash
vercel env add
```