Discuss Migration to Next.js 13's /app Directory Structure

[swiiny]

Description

With Next.js 13.4 officially introducing the stable /app directory structure, we need to discuss the potential shift from our current /pages structure. Before moving forward, a comprehensive understanding of the new features, along with their implications and challenges, is essential.

Background

According to the official announcement from Next.js dated Thursday, May 4th, 2023, the /app directory offers several enhancements:

• Layouts: Provides a mechanism to share UI across different routes without expensive re-renders.
• Server Components: Introduces the React's Server Components architecture, focusing on delivering rich applications with less client-side JavaScript.
• Streaming: Enables the progressive rendering and streaming of UI components to the client.
• Data Fetching: Supports the native fetch API to streamline data fetching with built-in caching mechanisms.

The /app directory is positioned as an incremental enhancement, and the older /pages directory will continue to be supported.

Concerns

1. Developer Readiness: Are the development team members familiar with the new features and the associated paradigm shift?
2. User Experience: As an open-source project, should we push adopters towards this latest enhancement? What is the learning curve for new adopters?
3. Templates Compatibility: Will our existing templates work seamlessly with the /app directory? Are there potential breaking changes?
4. Migration Effort: While the migration is described as incremental, what are the potential pitfalls, especially for larger projects?
5. Potential Bugs: Given the new features' initial beta status, are there potential unknown bugs or issues we should anticipate?

Recommendation

Given the significant enhancements that the /app directory promises, it is worth considering its adoption. However, understanding the concerns and ensuring a smooth transition, especially for existing users, is paramount.

Action Items

1. Review existing templates and conduct testing to determine compatibility with the /app structure.
2. Engage with the community to understand their perspective and potential challenges they foresee.
3. If deemed suitable, draft a migration guide or documentation to assist users with the transition.

[swiiny]

Every templates will be updated to app directory with latest NextJs and React stable release