build: migrate to Next.js 13, React 18, Github Action v4

[dazedbear]

Goal

#101

• migrate Next.js from 12 to 13
  • focus on migrating the new features
  • will have the following PR to migrate from page to app router.
• migrate React from 16 to 18
• migrate Github Official Action from v2 to v4
• migrate Github Community Action
• fix retrieving incorrect Vercel deployment URL from personal account instead of the team project.

Knowledge Transfer / Notes

• For the React 18 hydration known issue, there was a fix merged into Next.js currently.
  fix(next/image): detect react@19 for fetchPriority prop vercel/next.js#65235

Reference

• https://nextjs.org/docs/app/building-your-application/upgrading/app-router-migration#upgrading-new-features
• https://github.com/actions
• https://github.blog/changelog/2022-10-11-github-actions-deprecating-save-state-and-set-output-commands/

[codesandbox]

Review or Edit in CodeSandbox

Open the branch in Web Editor • VS Code • Insiders

Open Preview

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
dazedbear-github-io	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	May 27, 2024 10:14am

[github-advanced-security]

This pull request sets up GitHub code scanning for this repository. Once the scans have completed and the checks have passed, the analysis results for this pull request branch will appear on this overview. Once you merge this pull request, the 'Security' tab will show more code scanning analysis results (for example, for the default branch). Depending on your configuration and choice of analysis tool, future pull requests will be annotated with code scanning analysis results. For more information about GitHub code scanning, check out the documentation.