Overview

Shiftwalk Starter is a Next.js boilerplate with TailwindCSS, Framer Motion, and other preconfigured features. It provides a simplified setup for developers to quickly start building Next.js projects with these frameworks.

Features

• Next 12: Utilizes the latest version of Next.js for improved performance and features.
• SWC Minification: Uses SWC to optimize JavaScript code for faster-loading pages.
• Tailwind 3.0: Preconfigured setup for TailwindCSS, a utility-first CSS framework.
• Custom PostCSS setup: Allows for easy @import and CSS nesting in the project.
• Framer Motion 4: Integrated with LazyMotion setup to reduce the bundle size.
• Preact instead of React: Uses Preact as the default rendering engine for a smaller bundle size.
• SEO preconfigured: Includes next-seo to streamline search engine optimization.
• Module Aliasing: Configured with jsconfig.json to enable module aliasing for cleaner imports.
• Feature branch with Locomotive Scroll: Smooth, lerp-based page scrolling feature included in a separate branch.
• Out-of-the-box 100 scores on Page Speed Insights: Preconfigured optimizations for achieving high scores on both mobile and desktop.
• Roadmap / Coming Soon: Planned feature branches with preconfigured setup for Sanity, DatoCMS, and GSAP.

Installation

To quickly start using Shiftwalk Starter:

1. Clone the repository.
2. Once cloned, navigate to the project’s directory.
3. Install the local dependencies by running the following command:

npm install

4. Start the development server with the following command:

npm run dev

5. Open the source code and start editing in your preferred code editor.
6. The site will be running at http://localhost:3000.

Summary

Shiftwalk Starter is a Next.js boilerplate that provides a streamlined setup for developing projects with TailwindCSS, Framer Motion, and other preconfigured features. With a focus on performance and ease of use, it offers the latest versions of Next.js and TailwindCSS, custom PostCSS setup, and out-of-the-box optimizations for SEO and page speed. The boilerplate also includes separate feature branches for additional integrations like Locomotive Scroll, Sanity, DatoCMS, and GSAP.