Git Product home page Git Product logo

fabulous-petunia-0d7bb's Introduction

Stackbit Next.js + TypeScript + MUI Starter

Next.js + TS + MUI Stackbit Starter

This is a minimal starting point for new Stackbit projects. It is built with Next.js, TypeScript, and MUI, and is equipped with visual editing capabilities using Stackbit. It uses markdown files as the content source. See below for other Stackbit example projects.

โšก Demo: stackbit-ts-mui-nextjs-starter.netlify.app

Features

This is meant to be a simple starting point that demonstrates the use of bringing your own component library, such as MUI.

In addition to MUI support, this project contains the following:

  • Flexible Pages: Simple and flexible page model that lets editors add new pages.
  • Basic Components: A few basic components to add to new pages.
  • Layout Elements: Header and footer elements automatically added to pages.
  • Component & Template Presets: Predefined arrangements of content and components for faster editing. Learn more.
  • TypeScript Support: Components and content are type-safe. (See types directory for definitions.)

Getting Started

The typical development process is to begin by working locally.

Create local Stackbit project from this repo:

npx create-stackbit-app@latest --starter ts-nextjs

Run the Next.js development server:

cd my-stackbit-site
npm run dev

Install the Stackbit CLI. Then open a new terminal window in the same project directory and run the Stackbit Dev server:

npm install -g @stackbit/cli
stackbit dev

This outputs your own Stackbit URL. Open this, register or sign in, and you will be directed to Stackbit's visual editor for your new project.

Next.js Dev + Stackbit Dev

Next Steps

Here are a few suggestions on what to do next if you're new to Stackbit:

Other Stackbit Projects

Stackbit has a number of examples that you can use to create a new project or evaluate Stackbit. Run the following command to see a list of available examples:

npx create-stackbit-app@latest --help

You can also visit our stackbit-themes GitHub organization

Join the Community

Join us on Discord for community support and to showcase what you build with this starter.

fabulous-petunia-0d7bb's People

Contributors

fk avatar ikristy avatar stackbit-projects avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.