Skip to content

๐Ÿ“˜ The goal of this project is to investigate and experiment with the newest functionalities of NextJS. It is a web application that comprises several sections, each focused on a specific NextJS 13 feature

Notifications You must be signed in to change notification settings

focusreactive/MVP-NextJS13-New-Features

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

MVP-Next13-Readme

This repository contains a MVP project for testing new features in NextJS v13.

Project Description

The purpose of this project is to explore and test the latest features of NextJS. It is a web application consisting of different sections, each dedicated to a specific NextJS 13 feature. The menu navigation allows easy switching between sections, and each section includes detailed descriptions and documentation related to the implemented feature.

image

Getting Started

To run the development server, follow these steps:

  1. Install dependencies by running the command:
npm install

  1. Start the development server:
npm run dev

Open http://localhost:3000 in your browser to see the application.

Features Explored

The project explores the following features:

App Router Overview

https://nextjs13-mvp.vercel.app/overview

Learn about the new app router in NextJS 13, including its key points and advantages.

Layout

https://nextjs13-mvp.vercel.app/layout

Understand how layouts are used to define shared user interfaces for nested routes. Learn about layout nesting, state preservation, and avoiding unnecessary re-renders.

Data Fetching

https://nextjs13-mvp.vercel.app/data-fetching

Explore the new data fetching model being developed by the React team. Note that this feature is still in development and may not be stable yet.

Static and Dynamic Rendering

https://nextjs13-mvp.vercel.app/static

Learn about the differences between static and dynamic rendering in Next.js. Understand when to use each approach and their implications.

Metadata

https://nextjs13-mvp.vercel.app/metadata

Discover how to define metadata in layouts and pages. Explore advanced features such as generating robots.txt, sitemap.xml, and dynamic images.

Preview URL (Draft Mode)

https://nextjs13-mvp.vercel.app/preview

Learn how to enable draft mode for previewing URLs before they are published.

Server Actions

https://nextjs13-mvp.vercel.app/rsc

Understand how server actions work in NextJS 13. Learn about calling server functions, implementing optimistic updates, and revalidating pages.

Intercepting Routes

https://nextjs13-mvp.vercel.app/intercepting-routes/posts

Explore how to intercept routes in NextJS 13 and handle different HTTP methods. Learn about dynamic API routes and their configuration.

API Routes

https://nextjs13-mvp.vercel.app/api-routes

Fonts

https://nextjs13-mvp.vercel.app/fonts

Learn how to use custom fonts in your NextJS 13 project.

Credits

This project was created at FocusReactive - the expert consultancy for the modern web. We specialize in helping clients beat the competition and accelerate business growth. With a deep expertise in headless CMS, NextJS, and eCommerce, we deliver cutting-edge solutions that prioritize your business goals.

Our Expertise

  • Content-Centric Websites: We have a deep experience building extendable, SEO optimized content and marketing websites with advanced CMS integrations and analytics.
  • Headless eCommerce: Our next-generation, content-rich, and performant online eCommerce websites come with end-to-end integrations to power your digital business.
  • Headless CMS Consulting: We offer multi-channel CMS development, modeling, customization, and support to help you manage your content seamlessly across various platforms.
  • Web Performance: Our experts can audit, transform the architecture, and optimize your website to meet the 100 SCORE Core Web Vitals for exceptional web performance.

If you're looking for expertise in headless CMS, NextJS, or eCommerce, get in touch with FocusReactive today. Visit our website at focusreactive.com to learn more about how we can help you accelerate your business growth.


This project is licensed under the MIT License. ยฉ 2023 FocusReactive.

About

๐Ÿ“˜ The goal of this project is to investigate and experiment with the newest functionalities of NextJS. It is a web application that comprises several sections, each focused on a specific NextJS 13 feature

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published