All Projects → sanity-io → Example Frontend Next Js

sanity-io / Example Frontend Next Js

An example of a Sanity powered frontend using Next.js

Programming Languages

javascript
184084 projects - #8 most used programming language

Labels

Projects that are alternatives of or similar to Example Frontend Next Js

Notion Clone
Stars: ✭ 2,048 (+1362.86%)
Mutual labels:  nextjs
Nextjs Ts
Opinionated Next JS project boilerplate with TypeScript and Redux
Stars: ✭ 134 (-4.29%)
Mutual labels:  nextjs
Airframe Next
Free Open Source High Quality Dashboard based on Bootstrap 4 & React 16 + Next.js: http://airframe.nextjs.webkom.co
Stars: ✭ 138 (-1.43%)
Mutual labels:  nextjs
Truffle Next
🛰️ A boilerplate Truffle Box project with Next.js for rapid Ethereum Dapp development
Stars: ✭ 130 (-7.14%)
Mutual labels:  nextjs
Nextjs Pwa
Build a PWA with Next.JS
Stars: ✭ 132 (-5.71%)
Mutual labels:  nextjs
Nextjs Express
A simple app using Next.js
Stars: ✭ 136 (-2.86%)
Mutual labels:  nextjs
Giraffeql
🦒 Developer tool to visualize relational databases and export schemas for GraphQL API's.
Stars: ✭ 128 (-8.57%)
Mutual labels:  nextjs
Nextjs Docker Pm2 Nginx
Next.js with Docker, PM2 and NGINX
Stars: ✭ 139 (-0.71%)
Mutual labels:  nextjs
Nextjs Vercel Firebase
Next.js app using API routes to connect with Firestore.
Stars: ✭ 133 (-5%)
Mutual labels:  nextjs
Next Dark Mode
🌑 Enable dark mode for Next.js apps
Stars: ✭ 133 (-5%)
Mutual labels:  nextjs
Thunderhub
ThunderHub LND Lightning Node Manager in your Browser
Stars: ✭ 131 (-6.43%)
Mutual labels:  nextjs
Nitro
An Example of a PWA using Nextjs, Material-UI, Typescript and Auth0 💗
Stars: ✭ 130 (-7.14%)
Mutual labels:  nextjs
R3f Next Starter
Repo is moving to https://github.com/pmndrs/react-three-next
Stars: ✭ 137 (-2.14%)
Mutual labels:  nextjs
React Next Boilerplate
🚀 A basis for reducing the configuration of your projects with nextJS, best development practices and popular libraries in the developer community.
Stars: ✭ 129 (-7.86%)
Mutual labels:  nextjs
Next Runtime Dotenv
Expose environment variables to the runtime config of Next.js
Stars: ✭ 136 (-2.86%)
Mutual labels:  nextjs
Data Prefetch Link
Extends next.js <Link> to allow invoking getInitialProps when prefetching a page
Stars: ✭ 128 (-8.57%)
Mutual labels:  nextjs
Egg React Ssr
最小而美的Egg + React + SSR 服务端渲染应用骨架,同时支持JS和TS
Stars: ✭ 1,837 (+1212.14%)
Mutual labels:  nextjs
Next Firebase Auth
Simple Firebase authentication for all Next.js rendering strategies
Stars: ✭ 135 (-3.57%)
Mutual labels:  nextjs
Paco
personal website and blog
Stars: ✭ 136 (-2.86%)
Mutual labels:  nextjs
Next Js Blog Boilerplate
🚀 Nextjs Blog Boilerplate is starter code for your blog based on Next framework. ⚡️ Made with Nextjs, TypeScript, ESLint, Prettier, PostCSS, Tailwind CSS.
Stars: ✭ 134 (-4.29%)
Mutual labels:  nextjs

Sanity + Next.js frontend example

DEMO 👉 https://example-frontend-next-js.sanity-io.now.sh

This is an example Sanity powered frontend for the movie dataset using Next.js.

Prerequisites

You will need Node.js version 8.0 or greater installed on your system.

Setup

Get the code by either cloning this repository using git

git clone https://github.com/sanity-io/example-frontend-next-js.git

... or downloading source code code as a zip archive.

Once downloaded, open the terminal in the project directory, and install dependencies with:

npm install

If you're running your own Sanity project with the example movie dataset, go to lib/sanity.js and change the following lines:

  projectId: 'YOUR_PROJECT_ID',
  dataset: 'NAME_OF_YOUR_DATASET',

You can locate the ID of your project in the header of the management page for your project.

You also need to enable localhost:3000 in your CORS Origins settings! Either through the management page under settings or by running the below in the project folder you set up with sanity init:

sanity cors add http://localhost:3000

Then start the example app with:

npm run dev

The app should now be up and running at http://localhost:3000 🚀

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].