Awesome

Next.js Chakra UI Starter Template

Getting Started

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

    npx degit hendraaagil/next-chakra-starter "next-chakra-project"
   

2. Install all dependencies <br />

   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:

• next-seo
• nprogress
• react-icons

Some features in this template:

1. Custom breakpoints & font <br /> You can edit breakpoints & font in styles/theme.js. <br /> Import your preferred font in pages/_document.js to apply automatic webfont optimization.
2. Global style <br/> You can edit global style in styles/styles.js.
3. Page transition <br /> If you want to custom the page transition go to pages/_app.js in MotionBox component.
4. Next SEO config file <br /> 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:

• Next.js Documentation
• Chakra UI Documentation

License

This project is under MIT License

Credits

Created by Hendra Agil