beepboopquack Comments - Answer Overflow

beepboopquack

•Created by beepboopquack on 4/25/2023 in #questions

Need Help Implementing Builder.io

Huh. it actually works now! It must have been something weird I did on Builder.io since my code was exactly the same and it still was not working. Anyways, I greatly appreciate your help on this, thank you!

23 replies

TTCTheo's Typesafe Cult

•Created by beepboopquack on 4/25/2023 in #questions

Need Help Implementing Builder.io

I included all the relevant keys in the .env.example file, but blocked out the private key!

23 replies

TTCTheo's Typesafe Cult

•Created by beepboopquack on 4/25/2023 in #questions

Need Help Implementing Builder.io

https://github.com/npinedajr/T3BuilderInteg/tree/main/frontend Here is a repo! Thank you again for your help!

23 replies

TTCTheo's Typesafe Cult

•Created by beepboopquack on 4/25/2023 in #questions

Need Help Implementing Builder.io

I also made sure to run the following

npm install "@builder.io/react"

npm install "@builder.io/react"

23 replies

TTCTheo's Typesafe Cult

•Created by beepboopquack on 4/25/2023 in #questions

Need Help Implementing Builder.io

Thank you so much for helping! Hmm, there still appears to be some issue with the code that is causing the 404 to appear. My .env file has the following (secret key hidden with *):

DATABASE_URL="file:./db.sqlite"

NEXT_PUBLIC_BUILDER_IO_KEY=615d9ca18922400a9882696727a79c7f

NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_test_bGliZXJhbC1zcGFuaWVsLTY5LmNsZXJrLmFjY291bnRzLmRldiQ

CLERK_SECRET_KEY=******

DATABASE_URL="file:./db.sqlite"

NEXT_PUBLIC_BUILDER_IO_KEY=615d9ca18922400a9882696727a79c7f

NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_test_bGliZXJhbC1zcGFuaWVsLTY5LmNsZXJrLmFjY291bnRzLmRldiQ

CLERK_SECRET_KEY=******

The catch-all route ([[...page]].tsx) has everything that the example page linked on Github does, aside from the top section:

import { env } from '~/env.mjs';

builder.init(env.NEXT_PUBLIC_BUILDER_IO_KEY);

import { env } from '~/env.mjs';

builder.init(env.NEXT_PUBLIC_BUILDER_IO_KEY);

Finally, the env.mjs file has the same changes as suggested:

const client = z.object({
  NEXT_PUBLIC_ENV: z.enum(['development', 'test', 'production']),
  NEXT_PUBLIC_BUILDER_IO_KEY: z.string().min(1),
});

const processEnv = {
  DATABASE_URL: process.env.DATABASE_URL,
  NODE_ENV: process.env.NODE_ENV,
  NEXT_PUBLIC_ENV: process.env.NODE_ENV,
  NEXT_PUBLIC_BUILDER_IO_KEY: process.env.NEXT_PUBLIC_BUILDER_IO_KEY,
};

const client = z.object({
  NEXT_PUBLIC_ENV: z.enum(['development', 'test', 'production']),
  NEXT_PUBLIC_BUILDER_IO_KEY: z.string().min(1),
});

const processEnv = {
  DATABASE_URL: process.env.DATABASE_URL,
  NODE_ENV: process.env.NODE_ENV,
  NEXT_PUBLIC_ENV: process.env.NODE_ENV,
  NEXT_PUBLIC_BUILDER_IO_KEY: process.env.NEXT_PUBLIC_BUILDER_IO_KEY,
};

Is something wrong with how I currently have my .env file? Or would I have to do something with routing? Sorry for all this trouble!

23 replies

Gaming

Programming