Business in a Box: The Complete Setup Guide
Codeco Tech
Codeco.tech sells ready-to-launch websites and full-stack business applications. Instead of starting with an empty project, you receive a working platform with sign-in, a database, bookings, payments, an AI chat feature, a blog, contact forms, and an admin dashboard.
Codeco.tech's products are downloadable, production-ready websites that you own and can host yourself, without being locked into a website builder. The wider service focuses on modern applications built with React, TypeScript, Next.js, databases, and AI integrations.
This guide explains how to set up the Business in a Box — Coaching & Booking Platform from your downloaded ZIP file.
How long this takes: roughly 30-45 minutes if every account (Neon, Google, Cal.com, Anthropic) is created ahead of time. Most of that is waiting on account signups, not the actual setup — the commands themselves take a few minutes total.
The platform is designed for coaches, consultants, trainers, agencies, and other service businesses.
It includes a professional business website, client registration and Google sign-in, and a PostgreSQL database hosted with Neon.
It includes a booking page connected to Cal.com, Stripe-ready payment functionality, and an AI chat widget powered by an API key.
It includes contact and newsletter forms, a blog and built-in content system, and an admin dashboard.
It includes contact downloads in CSV format, legal and compliance pages, and responsive pages for phones, tablets, and computers.
It includes support videos and lifetime support from Codeco.tech, plus the option to develop the website into a mobile PWA application.
The website itself is built with Next.js, NextAuth, Neon PostgreSQL, and Cal.com. Codeco.tech also provides downloadable full-stack websites with backend functionality, forms, databases, and optional AI features.
You need the downloaded Codeco.tech ZIP file, and a computer running macOS, Windows, or Linux.
You need Node.js LTS, and a code editor such as Visual Studio Code.
You need a Google account, a Neon account, and a Cal.com account.
You need an Anthropic API key for the AI chat widget, and a hosting account such as Vercel when you're ready to publish.
Create these accounts before starting: Node.js, Visual Studio Code, Neon, Google Cloud Console, Cal.com, Anthropic Console.
The easiest setup is to complete the local installation first. Only publish the website after the local version works correctly.
The setup below is designed to be repeatable. You can run the harmless steps again without creating duplicate users, duplicate folders, or duplicate database tables.
The important rules: use one project folder, and keep one .env.local file.
Do not create a new database every time you try the setup. Sign in before running the admin command.
Check each page before moving to deployment. Never share .env.local.
Find the ZIP file you downloaded from Codeco.tech.
On macOS, double-click the ZIP file. On Windows, right-click it and choose Extract All.
Open the extracted project folder.
Do not rename individual project files. The commands in this guide must run from the main project folder — the folder containing package.json.
Node.js is the software that runs the project on your computer.
Open nodejs.org and download the version marked LTS. Follow the installation instructions.
After installation, close your terminal and open a new terminal window. Check that Node.js is installed:
node --version
npm --versionYou should see a version number for both commands.
Open the extracted folder in Visual Studio Code. You can also open it from a terminal:
cd /path/to/your/project
code .Replace /path/to/your/project with the location of your project folder.
In Visual Studio Code, open the terminal using View → Terminal, or Cmd + `` on macOS, `Ctrl + ` `` on Windows.
The project includes a file called .env.example. Make a copy of this file and name the copy .env.local.
The .env.local file contains passwords and private service keys. It must stay on your computer and must never be uploaded publicly.
Next.js loads .env.local automatically during local development. Variables without the NEXT_PUBLIC_ prefix remain available only to the server, while variables beginning with NEXT_PUBLIC_ can be included in the browser application.
Add your values to .env.local:
DATABASE_URL="your-neon-connection-string"
AUTH_SECRET="your-long-random-secret"
AUTH_URL="http://localhost:3000"
AUTH_GOOGLE_ID="your-google-client-id"
AUTH_GOOGLE_SECRET="your-google-client-secret"
ANTHROPIC_API_KEY="your-anthropic-api-key"
NEXT_PUBLIC_APP_URL="http://localhost:3000"
CALCOM_API_KEY="your-cal-com-api-key"
CALCOM_API_URL="https://api.cal.com/v1"
CALCOM_EVENT_TYPE_ID="your-event-type-id"
CALCOM_WEBHOOK_SECRET="your-webhook-secret"Do not paste the example values above unless they are your real credentials.
Create the database connection. In Neon: create a project, open the project dashboard, select Connect, and copy the PostgreSQL connection string.
Paste it after DATABASE_URL= in .env.local. Neon recommends storing the connection string as an environment variable — its pooled connection is suitable for web applications and high-concurrency use.
Watch for this: Neon gives you two connection strings — pooled and direct. Use the pooled one (it usually has -pooler in the hostname) for the app itself. Using the wrong one is a common source of intermittent "too many connections" errors under real traffic.
Create the authentication secret. Generate a long random value for AUTH_SECRET:
openssl rand -base64 32Copy the result into .env.local. If the command doesn't work on your computer, use the secret generator linked in the original README. Do not use a short or easily guessed password.
From the project folder, run:
npm installThis downloads the packages required by the website.
It's safe to run this command again if the installation stops or reports an error — it brings the project back into the required state without creating a second copy of the application.
Once DATABASE_URL is complete, run:
npm run db:pushThis creates or updates the database structure required by the application.
The platform uses tables for users, accounts, sessions, contacts, newsletters, and chat records. Run this command against the database connected to the current .env.local file.
Do not run this against a production database until you've checked that the connection string is correct.
Run:
npm run devOpen http://localhost:3000 in your browser. You should see the website homepage.
Keep the terminal open while testing. To stop the website, press Ctrl + C. Starting the development server again is safe — it doesn't create a second website or database.
This step must happen in the correct order.
Open http://localhost:3000/login. Choose Sign in with Google and use the email address you want to make the administrator.
The sign-in must complete successfully before you run the admin command. The first sign-in creates your user record in the database.
Return to the terminal and run:
npx tsx scripts/make-admin.ts your-email@example.comReplace your-email@example.com with the exact email address used during Google sign-in. Real example — if you signed in as sarah@gmail.com, you'd type npx tsx scripts/make-admin.ts sarah@gmail.com.
Now open http://localhost:3000/admin. You should see the admin dashboard.
This command updates the existing user — it does not create another account. If the admin area doesn't open, sign out, sign in again with Google, and check that the email in the command matches exactly.
Cal.com provides the availability and booking calendar shown on the /book page.
Sign in at Cal.com. Create an Event Type — give it a name such as "30 Minute Consultation."
Set your availability and meeting location, then save the event. An event type is the appointment customers can book.
In Cal.com, open Settings → Developer → API Keys → New API Key. Copy the key into CALCOM_API_KEY="your-api-key".
Find the event type ID in the event page address — for example, cal.com/event-types/12345 means the event type ID is 12345. Add it to CALCOM_EVENT_TYPE_ID="12345".
Cal.com uses an event type ID to identify the appointment being booked.
Open lib/business-config.ts. This is where you update services, prices, service descriptions, coaches or staff, booking links, and staff images.
The calLink value must use this format: your-username/your-event-slug — for example, janedoe/30min.
Do not enter the complete URL. Do not write https://cal.com/janedoe/30min.
Place staff and service images inside public/.
Keep each service id stable if the existing application uses it elsewhere. Change the displayed name and description without changing the ID unless you understand the code that references it.
Before publishing, check each feature in order: home page loads, /book shows services and coaches, the booking flow lets you select a real Cal.com time.
Check /contact submits, the newsletter accepts a test subscription, and the chat widget responds to a test message.
Check /blog posts load correctly, /login works with Google sign-in, /profile shows the signed-in account, /admin opens the dashboard, and contact export downloads as a CSV file.
Test with a normal client account as well as the admin account — this confirms visitors cannot see admin functions.
If the project includes the quality-control command from the README, run npm run tt and fix every reported issue before deployment.
The blog uses folders and a central post list.
To add a post: copy an existing post folder, such as app/blog/day-after-genius/, and rename the copy — for example, app/blog/my-new-post/.
Open the copied page.mdx file, remove the old article, and add the new one.
Open posts.ts in the project root, copy an existing post entry, and paste it near the top. Change the title, slug, date, and thumbnail.
The slug in posts.ts must match the folder name — for example, my-new-post.
If you use ChatGPT or Claude to draft the article, keep the heading, excerpt, and paragraph lengths close to an existing post. This helps the new article fit the existing design without extra layout work.
Vercel is the recommended hosting option for this Next.js application.
Install the Vercel command-line tool if needed:
npm install -g vercelFrom the project folder, sign in and deploy:
vercelWhen the project is ready for production, run:
vercel --prodAdd the environment variables in Vercel → Project → Settings → Environment Variables. Copy the values from your local .env.local file, then change these two values to your actual production domain:
AUTH_URL="https://your-domain.com"
NEXT_PUBLIC_APP_URL="https://your-domain.com"Return to Google Cloud Console and add this production redirect address: https://your-domain.com/api/auth/callback/google.
The most common thing that breaks here: the redirect URI has to match your production URL exactly — same protocol, same domain, no trailing slash difference. A mismatch here is the single most common reason Google sign-in works locally but fails after deploying.
Redeploy after changing environment variables with vercel --prod again.
Always test the live website after deployment. A local environment and a production environment use separate settings, so Google sign-in, the database, and Cal.com must all be checked again.
The supplied product description mentions ChatGPT and Claude, Stripe payments, and a mobile app. The supplied README documents the Anthropic chat key, Cal.com bookings, and the setup process, but does not provide separate Stripe environment variables or Stripe setup instructions.
Before publishing this guide as final customer documentation, confirm whether the chat widget supports Claude only or both ChatGPT and Claude.
Confirm whether Stripe is already configured in the downloaded version, and which Stripe variables must be added.
Confirm whether payment testing uses Stripe test mode, and whether the PWA files are already included.
Confirm whether mobile app store publishing is included or requires additional development.
Confirm whether the site contains five, eight, or ten SEO pages, since the supplied marketing copy uses different figures.
The README also says the PWA requires a manifest.json and service worker to become installable. Treat the mobile app feature as an extension unless those files are already present in the downloaded project.
Codeco.tech includes setup guides, "Unstuck" videos, and lifetime support with the product.
For help: website codeco.tech, book a support call at cal.codeco.tech/admin/unstuck, or contact Codeco.tech on WhatsApp.
The complete setup is simple: configure the private settings, install the project, create the database tables, sign in once, promote the account to admin, connect Cal.com, and test every page. After that, the platform is ready to customise for the business.
Ready to build yours?