History

Miguel Oller 1f5da04dad Update cms-makeswift example (#39834 ) Upgrade @makeswift/runtime to the latest version. This removes the need for the MAKESWIFT_API_HOST environment variable and improves error messages when integrating Next.js with Makeswift. ## Documentation / Examples - [x] Make sure the linting passes by running `pnpm lint` - [x] The examples guidelines are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing.md#adding-examples)		2022-08-22 16:02:19 -05:00
..
lib/makeswift	Add a Makeswift example (#38018 )	2022-06-29 13:25:51 -05:00
pages	Add a Makeswift example (#38018 )	2022-06-29 13:25:51 -05:00
.env.local.example	Update cms-makeswift example (#39834 )	2022-08-22 16:02:19 -05:00
.gitignore	Update default gitignore templates (#39051 )	2022-07-26 20:08:40 -05:00
next-env.d.ts	Add a Makeswift example (#38018 )	2022-06-29 13:25:51 -05:00
next.config.js	docs(example): Update Makeswift example (#39070 )	2022-07-27 09:00:28 -05:00
package.json	Update cms-makeswift example (#39834 )	2022-08-22 16:02:19 -05:00
README.md	Add a Makeswift example (#38018 )	2022-06-29 13:25:51 -05:00
tsconfig.json	Add a Makeswift example (#38018 )	2022-06-29 13:25:51 -05:00

README.md

A statically generated landing page with Next.js and Makeswift

This example showcases how you can use Makeswift to visually build statically generated pages in Next.js.

Deploy your own

Deploy the example using Vercel:

Demo

https://nextjs-makeswift-example.vercel.app/

How to use

Download the example:

Execute create-next-app with npm, Yarn, or pnpm to bootstrap the example:

npx create-next-app --example cms-makeswift cms-makeswift-app
# or
yarn create next-app --example cms-makeswift cms-makeswift-app
# or
pnpm create next-app --example cms-makeswift cms-makeswift-app

Install dependencies:

yarn install
# or
npm install
# or
pnpm install

Rename the .env.local.example file to .env.local and include your Makeswift site's API key:

-- MAKESWIFT_API_HOST=
-- MAKESWIFT_SITE_API_KEY=
++ MAKESWIFT_API_HOST=https://api.makeswift.com
++ MAKESWIFT_SITE_API_KEY=<YOUR_MAKESWIFT_SITE_API_KEY>

Run the local dev script:
```
yarn dev
# or
npm run dev
```
Your host should be up and running on http://localhost:3000.
Finally, go to your Makeswift site settings and add http://localhost:3000/makeswift as the host URL and you're all set!

Deploy it

When you're ready to go live, deploy it to the cloud with Vercel (Documentation). All you'll need to do is update your host inside of Makeswift to your Vercel deployment.

Next steps

With Makeswift, you can give your marketing team custom building blocks to create high quality Next.js pages.

To learn more about Makeswift, take a look at the following resources:

You can check out the Makeswift GitHub repository - your feedback and contributions are welcome!