I created a notebook app in react a few months ago. I wrote article about it.
Create a Notebook app with React, ChakraUi, and framerMotion
Muhammad Ahmad ・ Apr 2 '21 ・ 1 min read
Now I migrated this app to Next.js smoothly.
Here are the few steps that will guide you how i did this.
Step 1
Installed next
in my project:
yarn add next
Step 2
Updated package.json
with the following scripts:
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start"
}
Step 3
Created pages folder:
src/pages/_app.tsx
src/pages/index.tsx
src/pages/projects/index.tsx
Step 4
Migrated code:
from src/index.tsx and src/app.tsx
to src/pages/index.tsx and src/pages/_app.tsx
Note: I didn't copy paste code here.
Step 5
Deleted these files:
src/index.tsx
src/app.tsx
Final step
- Used
next/router
. - Replaced
chakra links
andreact-router-dom links
withnext/link
in different files.
Top comments (1)
Looks nice