Simple React Blog
Simple Next.js Blog
NOTE: this repo is now a mirror of theView Demo
React + Next.js + Cosmic
This blog uses Next.js to create a React blog. It uses Next.js 13 and the new app
organization structure which takes advantage of React Server Components. It connects to the Cosmic API via the Cosmic JavaScript SDK.
Getting Started
- Log in to Cosmic and install the Simple Next.js Blog template.
- Run the following commands to install the code locally.
git clone https://github.com/cosmicjs/simple-nextjs-blog
cd simple-nextjs-blog
Environment Variables
- Create an
.env.local
file to gain API access to your Cosmic Bucket. To do this, run:
cp .env.example .env.local
- Find your API access keys at Bucket Settings > API Access after logging into your Cosmic dashboard and add them to the
.env.local
file. It should look something like this:
NEXT_PUBLIC_COSMIC_BUCKET_SLUG=your-bucket-slug
NEXT_PUBLIC_COSMIC_READ_KEY=your-bucket-read-key
Run in development
Install all dependencies and run in development mode.
yarn
yarn dev
Open http://localhost:3000.
Deploy to Vercel
Use the following button to deploy to Vercel. You will need to add API accesss keys as environment variables. Find these in Bucket Settings > API Access.