Skip to content
Avatar of makeswiftmakeswift/makeswift

Makeswift Next.js Starter

A Next.js application configured out of the box to work with the Makeswift builder.

Framework
Use Case
Makeswift thumbnail

Makeswift Next.js Starter

Demo

https://makeswift-examples-basic-typescript.vercel.app/

Getting Started

This template contains a simple Next.js app integrated with Makeswift so you can visually edit your Next.js pages.

Automatic Setup

Use the Makeswift CLI to clone this repo and set everything up with a single command:

npx makeswift@latest init --example=basic-typescript

Manual Setup

Alternatively, you can set things up manually without using the CLI.

Once you've cloned the repository, install the dependencies:

yarn install

Then, find your Makeswift's site API key in our site's setting and add it to your .env.local file:

MAKESWIFT_SITE_API_KEY=<your_makeswift_site_api_key>

Next, start your Next.js development server:

yarn dev

Finally, update your Makeswift site's host URL in to your local development server (e.g., http://localhost:3000). Your site's host URL is found in your Makeswift site's settings.

Learn More

To learn more about Next.js or Makeswift, take a look at the following resources:

Makeswift thumbnail
Avatar of makeswiftmakeswift/makeswift

Makeswift Next.js Starter

A Next.js application configured out of the box to work with the Makeswift builder.

Framework
Use Case

Makeswift Next.js Starter

Demo

https://makeswift-examples-basic-typescript.vercel.app/

Getting Started

This template contains a simple Next.js app integrated with Makeswift so you can visually edit your Next.js pages.

Automatic Setup

Use the Makeswift CLI to clone this repo and set everything up with a single command:

npx makeswift@latest init --example=basic-typescript

Manual Setup

Alternatively, you can set things up manually without using the CLI.

Once you've cloned the repository, install the dependencies:

yarn install

Then, find your Makeswift's site API key in our site's setting and add it to your .env.local file:

MAKESWIFT_SITE_API_KEY=<your_makeswift_site_api_key>

Next, start your Next.js development server:

yarn dev

Finally, update your Makeswift site's host URL in to your local development server (e.g., http://localhost:3000). Your site's host URL is found in your Makeswift site's settings.

Learn More

To learn more about Next.js or Makeswift, take a look at the following resources:

Unleash New Possibilities

Deploy your app on Vercel and unlock its full potential