Menu
I'd tried to figure out how to use server side rendering (SSR) on my existing react, and I found Next.js which is a SSR framework for React.
Also, there is create-next-app to easily create Next.js app like CRA. As I already have my existing React project, I need to make it compatible with Next.js. But, they have quite different project architecutre.
I attached two architectures of create-next-app and create-react-app each with images below. As Next requires the folder pages, I feel like I need to move my components in that folder, but I'm confused about src and public folder in create-react-app.
Can anyone help me how can I apply Next.js to an existing React app?
create-next-app
create-react-app
898
When you choose Next. js, it offers the best solutions for server-side rendering and static website development. It also makes it easy to manage projects with a variety of tools and features. On the other hand, React is the best choice for developing UIs for one-page applications.
Prerequisites. In order to create React application, you will need to have a Node that is >= 14.0. 0 and npm >= 5.6. As we discussed earlier npm is a package manager that comes with Node.
To add Next.js to your project, you will not need to load the react and react-dom scripts from unpkg.com anymore. Instead, you can install these packages locally using the Node Package Manager: npm .
You can install Next js by adding 'next' package to your CRA. However, you would have to refractor part of your codebase. The src folder should contain a subfolder called 'pages', consisting of your paths.
Visit the Next JS Documentation for more
195
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
