A template for quickly building Next.js apps.
Get started by following the setup.
(A preview of the template will be added soon)
Caution
Payments and Subscriptions are not yet supported - they will be supported in v1.0.0
This template uses Supabase, Stripe, Resend, Next Auth, OpenAI, and Next.js. It is a full stack template that can be used to build a SaaS application.
This template has support for these payment types:
- One-time payments
- Subscriptions
- Usage-based billing
- Donations
- Authentication via Next Auth
- Custom Themes (Only colours for now)
- Themes for Accessibility (Colour blindness, font size, etc.)
- Google Analytics & Tag Manager
- Hotjar Support
- Meta Pixel Tracking
- Stripe Payments:
- One-time
- Subscriptions
- Usage-based billing
- Donations
- Supabase Database (slowly getting there)
- Resend Email Sending
- Logging
- Betterstack Logging
- useTrace (Custom Logging)
- OpenAI
- Sample Email Templates
- The app is not as efficient as it could be. I need to work on that.
- I need to add better responsiveness to the Navigation Sidebar
To get started with using Make Next App, you need to do the following:
-
Download the latest release (or clone this repo if you want to contribute).
-
Extract and open the folder in your favourite code editor.
-
Run
npm install
to install all the dependencies.
Alternatively, you can use any other package manager like
yarn
orpnpm
.
-
You’ll need to create a
.env.local
file in the root of the project and set some environment variables. -
Run
npm run dev
to start the development server. -
Open http://localhost:3000 with your browser to see the result.
-
To deploy your project to Vercel or Netlify, follow the deployment instructions.
This template uses OpenAI for a Support feature that allows a user to search for help using documentation available in your app.
Generally, it’s really useful for many use-cases so it was added as a default feature to showcase how you can implement it.
-
Create a new Supabase project
-
Create the
next_auth
using this command:
--
-- Name: next_auth; Type: SCHEMA;
--
CREATE SCHEMA next_auth;
GRANT USAGE ON SCHEMA next_auth TO service_role;
GRANT ALL ON SCHEMA next_auth TO postgres;
--
-- Create users table
--
CREATE TABLE IF NOT EXISTS next_auth.users
(
id uuid NOT NULL DEFAULT uuid_generate_v4(),
name text,
email text,
"emailVerified" timestamp with time zone,
image text,
CONSTRAINT users_pkey PRIMARY KEY (id),
CONSTRAINT email_unique UNIQUE (email)
);
GRANT ALL ON TABLE next_auth.users TO postgres;
GRANT ALL ON TABLE next_auth.users TO service_role;
--- uid() function to be used in RLS policies
CREATE FUNCTION next_auth.uid() RETURNS uuid
LANGUAGE sql STABLE
AS $$
select
coalesce(
nullif(current_setting('request.jwt.claim.sub', true), ''),
(nullif(current_setting('request.jwt.claims', true), '')::jsonb ->> 'sub')
)::uuid
$$;
--
-- Create sessions table
--
CREATE TABLE IF NOT EXISTS next_auth.sessions
(
id uuid NOT NULL DEFAULT uuid_generate_v4(),
expires timestamp with time zone NOT NULL,
"sessionToken" text NOT NULL,
"userId" uuid,
CONSTRAINT sessions_pkey PRIMARY KEY (id),
CONSTRAINT sessionToken_unique UNIQUE ("sessionToken"),
CONSTRAINT "sessions_userId_fkey" FOREIGN KEY ("userId")
REFERENCES next_auth.users (id) MATCH SIMPLE
ON UPDATE NO ACTION
ON DELETE CASCADE
);
GRANT ALL ON TABLE next_auth.sessions TO postgres;
GRANT ALL ON TABLE next_auth.sessions TO service_role;
--
-- Create accounts table
--
CREATE TABLE IF NOT EXISTS next_auth.accounts
(
id uuid NOT NULL DEFAULT uuid_generate_v4(),
type text NOT NULL,
provider text NOT NULL,
"providerAccountId" text NOT NULL,
refresh_token text,
access_token text,
expires_at bigint,
token_type text,
scope text,
id_token text,
session_state text,
oauth_token_secret text,
oauth_token text,
"userId" uuid,
CONSTRAINT accounts_pkey PRIMARY KEY (id),
CONSTRAINT provider_unique UNIQUE (provider, "providerAccountId"),
CONSTRAINT "accounts_userId_fkey" FOREIGN KEY ("userId")
REFERENCES next_auth.users (id) MATCH SIMPLE
ON UPDATE NO ACTION
ON DELETE CASCADE
);
GRANT ALL ON TABLE next_auth.accounts TO postgres;
GRANT ALL ON TABLE next_auth.accounts TO service_role;
--
-- Create verification_tokens table
--
CREATE TABLE IF NOT EXISTS next_auth.verification_tokens
(
identifier text,
token text,
expires timestamp with time zone NOT NULL,
CONSTRAINT verification_tokens_pkey PRIMARY KEY (token),
CONSTRAINT token_unique UNIQUE (token),
CONSTRAINT token_identifier_unique UNIQUE (token, identifier)
);
GRANT ALL ON TABLE next_auth.verification_tokens TO postgres;
GRANT ALL ON TABLE next_auth.verification_tokens TO service_role;
- Expose the
next_auth
schema by addingnext_auth
to the "Exposed schemas" found here. Or, when developing locally addnext_auth
to theschemas
array in theconfig.toml
file in thesupabase
folder that was generated by the Supabase CLI.
First of all, I favour using Stripe Payment Intents over Stripe Checkout as it gives you more control.
- For large products, it’s best to keep your marketing/landing pages separate from your app, but for a small solution, use the same app. This will save you time!