Skip to content

An opinionated simple starter / template project with Next.js and Chakra UI. Created by hendraaagil.

License

Notifications You must be signed in to change notification settings

hendraaagil/next-chakra-starter

Repository files navigation

Next.js Chakra UI Starter Template

Open Graph

Getting Started

  1. Clone this template using degit, change "next-chakra-project" with your own project name

     npx degit hendraaagil/next-chakra-starter "next-chakra-project"
  2. Install all dependencies

    Recommended using yarn

     cd next-chakra-project
     yarn

    or using npm

     cd next-chakra-project
     npm install
  3. For customizing options please see Features section.

  4. Or you can click "Use this template" button above.

Features

There is some pre-installed packages in this template:

Some features in this template:

  1. Custom breakpoints & font
    You can edit breakpoints & font in styles/theme.js.
    Import your preferred font in pages/_document.js to apply automatic webfont optimization.
  2. Global style
    You can edit global style in styles/styles.js.
  3. Page transition
    If you want to custom the page transition go to pages/_app.js in MotionBox component.
  4. Next SEO config file
    You can custom meta, favicon, open graph, etc. in next-seo.config.js.
  5. You also can customize nprogress in styles/css/nprogress.css.
  6. Using absolute path based on jsconfig.json file.

Documentation

For more guides, please read:

License

This project is under MIT License

Credits

Created by Hendra Agil