update readme

.env.example

@@ -1,7 +1,9 @@
 # This must be your local or Grafbase production API endpoint
+# Click "Connect" inside your Grafbase Project Dashboard to get the URL
 NEXT_PUBLIC_GRAFBASE_API_URL=http://localhost:4000/graphql
 
-# The NEXTAUTH_SECRET must match that set inside the grafbase/.env. You can generate one here: https://generate-secret.vercel.app/ 
+# The NEXTAUTH_SECRET must match that set inside the grafbase/.env. 
+# You can generate one here: https://generate-secret.vercel.app
 NEXTAUTH_SECRET=
 
 # Create a new GitHub app in your account settings to obtain these values

README.md

@@ -18,9 +18,9 @@ Realtime chat using GraphQL Live Queries, Next.js and NextAuth.js
 ## Local Development
 
 1. `npm install`
-2. Create a [GitHub App](https://docs.github.com/en/apps/oauth-apps/building-oauth-apps/creating-an-oauth-app)
-3. `cp .env.example .env`
-4. Add a secret value for `NEXTAUTH_SECRET` to `.env` (`openssl rand -base64 32`)
+2. Create a [GitHub OAuth App](https://docs.github.com/en/apps/oauth-apps/building-oauth-apps/creating-an-oauth-app) with your app details for development purposes. Make sure to set `Authorization callback URL` to `http://localhost:3000/api/auth/callback/github`
+3. `cp .env.example .env` and add values for `GITHUB_CLIENT_ID` and `GITHUB_CLIENT_SECRET` from step 2.
+4. [Generate a secret value](https://generate-secret.vercel.app) for `NEXTAUTH_SECRET` and add it to `.env`
 5. `cp grafbase/.env.example grafbase/.env`
 6. Add the same `NEXTAUTH_SECRET` to `grafbase/.env`
 7. `npx grafbase dev`
@@ -32,4 +32,7 @@ Realtime chat using GraphQL Live Queries, Next.js and NextAuth.js
 2. Push this repo to GitHub
 3. Create new project with Grafbase
 4. Add environment variable `NEXTAUTH_SECRET` to Grafbase
-5. Deploy to Vercel and add `.env` values (`NEXT_PUBLIC_GRAFBASE_API_URL`, `NEXTAUTH_SECRET`, `GITHUB_CLIENT_ID`, `GITHUB_CLIENT_SECRET`)
+5. Create a [GitHub OAuth App](https://docs.github.com/en/apps/oauth-apps/building-oauth-apps/creating-an-oauth-app) with your app details for production purposes. Make sure to set `Authorization callback URL` to `[YOUR_DESIRED_VERCEL_DOMAIN]/api/auth/callback/github`
+6. Deploy to Vercel and add `.env` values (`NEXT_PUBLIC_GRAFBASE_API_URL`\*, `NEXTAUTH_SECRET`, `GITHUB_CLIENT_ID`, `GITHUB_CLIENT_SECRET`)
+
+- \* `NEXT_PUBLIC_GRAFBASE_URL` is your production API endpoint. You can find this from the **Connect** modal in your [project dashboard](https://grafbase.com/dashboard).

grafbase/.env.example

@@ -1,2 +1,3 @@
 # This value must be the same as the root .env
+# You can generate one here: https://generate-secret.vercel.app
 NEXTAUTH_SECRET=