Install Next
Or
npx create-next-app <project-name>
yarn create-next-app <project-name>
Your Next app will listen on http://localhost:3000
Terminal command to start your Next app in
development mode
A function gets called at build time and pre-
renders paths from data source.
npm run dev
getStaticPaths() C h e a t s h e e tx
SSG (Static Site Generation):
SSR (Server Side Rendering):
Content Modelling:
Pre-rendering:
Dynamic zones:
Deployment:
Headless CMS:
is the generation of a full static HTML website based on raw data and a
set of templates.
uses a server to generate HTML from JavaScript modules in response to
a URL request.
the process of creating a logical structure for the content you wish to create,
manage and publish online. In Strapi, this is possible with the Content Types Builder.
is a process of preloading all elements on the page in preparation for a web crawler to
see it.
A Strapi field that lets you create flexible space to manage content based on a user
defined component list.
A Strapi - Next full-stack deployment needs you to deploy a Strapi app on a hosting
provider like Heroku or Digital Ocean (soon Strapi Cloud) and your Next app to Vercel.
a system that consists of a database and content delivery via an API, completely
separating the backend (creation and storage) from the frontend (design and deployment).
Key Concepts
Install and Run Next.js
Deploy Next to
production on Vercel
build Next.js frontend
and fetch data from
Strapi API
setup API permissions
or create access token
create content model
and add content to
Strapi
surf the web,
blazing fast
“yarn create strapi-starter my-site next-corporate”
Strapi Vercel Deploy, Strapi SEO Plugin
Read more about Strapi and Next.js
Starters
Plugins
Integrations
App Architecture and Resources
Install Strapi
Install Strapi
Or
yarn create strapi-app my-project
npx create-strapi-app my-project
Use the option to quickly
install Strapi with SQLite database
--quickstart
Run Strapi
Start your project
Or
yarn develop
npm run develop
Your Strapi server will listen on
http://localhost:1337
Or
npx create-next-app <project-name>
yarn create-next-app <project-name>
Your Next app will listen on http://localhost:3000
Terminal command to start your Next app in
development mode
A function gets called at build time and pre-
renders paths from data source.
npm run dev
getStaticPaths() C h e a t s h e e tx
SSG (Static Site Generation):
SSR (Server Side Rendering):
Content Modelling:
Pre-rendering:
Dynamic zones:
Deployment:
Headless CMS:
is the generation of a full static HTML website based on raw data and a
set of templates.
uses a server to generate HTML from JavaScript modules in response to
a URL request.
the process of creating a logical structure for the content you wish to create,
manage and publish online. In Strapi, this is possible with the Content Types Builder.
is a process of preloading all elements on the page in preparation for a web crawler to
see it.
A Strapi field that lets you create flexible space to manage content based on a user
defined component list.
A Strapi - Next full-stack deployment needs you to deploy a Strapi app on a hosting
provider like Heroku or Digital Ocean (soon Strapi Cloud) and your Next app to Vercel.
a system that consists of a database and content delivery via an API, completely
separating the backend (creation and storage) from the frontend (design and deployment).
Key Concepts
Install and Run Next.js
Deploy Next to
production on Vercel
build Next.js frontend
and fetch data from
Strapi API
setup API permissions
or create access token
create content model
and add content to
Strapi
surf the web,
blazing fast
“yarn create strapi-starter my-site next-corporate”
Strapi Vercel Deploy, Strapi SEO Plugin
Read more about Strapi and Next.js
Starters
Plugins
Integrations
App Architecture and Resources
Install Strapi
Install Strapi
Or
yarn create strapi-app my-project
npx create-strapi-app my-project
Use the option to quickly
install Strapi with SQLite database
--quickstart
Run Strapi
Start your project
Or
yarn develop
npm run develop
Your Strapi server will listen on
http://localhost:1337