More Premium Hugo Themes Premium Nextjs Themes

Nextjs Starter

A Next.js starter that includes a collection of reusable components, hooks, and utilities to build amazing projects with complex animations and page transitions using GSAP.

Nextjs Starter

A Next.js starter that includes a collection of reusable components, hooks, and utilities to build amazing projects with complex animations and page transitions using GSAP.

Author Avatar Theme by gcolombi
Github Stars Github Stars: 21
Last Commit Last Commit: Jun 27, 2023 -
First Commit Created: May 5, 2023 -
Nextjs Starter screenshot

Overview:

This Next.js starter is designed to provide developers with a collection of reusable components, hooks, and utilities for building projects with complex animations and page transitions using GSAP. It includes installation instructions and a warning for using the npm package “gsap-trial” and deploying the starter.

Features:

  • Framework: Next.js - a React framework for building performant apps
  • Hosting: Vercel - a platform for frontend developers with speed and reliability
  • UI: CSS Modules - a CSS architecture for generic and base styles, custom configuration, grid, utilities, and mixins
  • Animation: GSAP - an industry standard JavaScript animation library from GreenSock
  • Dark Mode: next-themes - enables dark mode in just 2 lines of code, supports system preference and other themes
  • Fonts: @next/font - optimizes fonts and removes external network requests for improved privacy and performance
  • Form: Client-side react-hook-form - performant and flexible form handling with easy-to-use validation
  • Notifications: react-toastify - adds notifications to your app
  • Form Validation: yup - a schema builder for runtime value parsing and validation
  • Server-side API: API Routes - manages form requests with automatic body parsing or formidable for parsing form data and file uploads
  • Email Template: Custom HTML template - includes placeholders for easy use
  • Google ReCaptcha: react-google-recaptcha-v3 - integrates Google ReCaptcha V3 to your app with a domain-specific key
  • Email Delivery: @sendgrid/mail - delivers emails through a cloud-based platform

Installation:

To install this Next.js starter, you can use either yarn or npm. Note that if you use npm, you will need to remove the ShuffleTextInOut and ImplodeExplodeInOut components as they use bonus plugins not included in the gsap package. If you want to use these components, you will need to install the corresponding package using the installation steps in the dashboard after joining the Club GreenSock.

Summary:

This Next.js starter provides developers with a range of features and tools for building projects with complex animations and page transitions using GSAP. It includes a variety of hooks, components, and utilities, as well as integration with other libraries and services such as react-google-recaptcha-v3 and @sendgrid/mail. The starter is easy to install and customize, making it a powerful choice for developers looking to build amazing projects.