AlexsLemonade / AlexsLemonade/refinebio-web

Next.js App Router Migration

Open
#339 0 comments 0 reactions 1 assignee Claimed by @nozomione View on GitHub
Epic
Dominant language
JavaScript
Stars
1
Forks
0
PR merge metrics
No merged PRs in 30d

Description

--- in progress: editing ---
### Context
Next.js v13 introduced the new routing model, App Router, which supports server side components and requires a new project structure. This epic is to track the router migration process from `page` to `app`.

> [!note]
> The specifics of epic may be continuously adjusted/updated during the development as needed (e.g., encountering an unexpected errors, add, update, or remove issues)

The issues tracked by this epic as follows:
- https://github.com/AlexsLemonade/refinebio-web/issues/342
- https://github.com/AlexsLemonade/refinebio-web/issues/343
- https://github.com/AlexsLemonade/refinebio-web/issues/344
- https://github.com/AlexsLemonade/refinebio-web/issues/345
- https://github.com/AlexsLemonade/refinebio-web/issues/347
- https://github.com/AlexsLemonade/refinebio-web/issues/348
- https://github.com/AlexsLemonade/refinebio-web/issues/349
- https://github.com/AlexsLemonade/refinebio-web/issues/350
- https://github.com/AlexsLemonade/refinebio-web/issues/351
- https://github.com/AlexsLemonade/refinebio-web/issues/352
- https://github.com/AlexsLemonade/refinebio-web/issues/354
- https://github.com/AlexsLemonade/refinebio-web/issues/355
- other issues go here

### Problem or idea

This section will be filled later.

## Page Meta Tags (in progress - this section still needs to be defined)
Currently meta tags are added to pages using `components/shared/PageTitle`. However, [`next/head` has been replaced](https://nextjs.org/docs/app/building-your-application/upgrading/app-router-migration#step-3-migrating-nexthead) by the new built-in SEO [Metadata API](https://nextjs.org/docs/app/api-reference/functions/generate-metadata), and we need to adjust the way we handle metadata in each route.

- Refactor the globally shared `PageTitle` component
- Add to `app` router

## Data Fetching (in progress - this section still needs to be defined)
Resource: [Migrating Data Fetching Methods](https://nextjs.org/docs/app/building-your-application/upgrading/app-router-migration#step-6-migrating-data-fetching-methods), [Data Fetching](https://nextjs.org/docs/app/building-your-application/data-fetching)

> [!note]
> The `getServerSideProps`, `getStaticProps`, and `getInitialProps` methods have been replaced with a simpler API.

- Add Compendia page to the `app` router
- Refactor hooks, context, sub-components

## Project Reorganization (in progress - this section still needs to be defined)
[Colocation](https://nextjs.org/docs/app/building-your-application/routing/colocation), [Project Organization Features](https://nextjs.org/docs/app/building-your-application/routing/colocation#project-organization-features)

We'll restructure and organize the project's folders/files.

### Solution or next step

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.