Install a Next.js and a Vite.js Applications Into a Monorepo

Instructor: [0:00] Let's begin by creating an apps folder. All right. Now, we're going to create a Next.js application and for that, we're going to use create-next-app. This new application is going to be called blog and it will live inside apps. Then we have to specify that we want this to be a TypeScript application, that we also want to use npm.

[0:27] Now, we are creating a React application using Vite.js. Let's cd into apps. We're going to run npm create vite@latest. We are going to call this project dashboard. We want this project to be a React project. We also want this project to use TypeScript.

[0:51] We can go back to the root of the project. Let's open the blog/package.json file and let's update its name property. This is going to be called monorepo/blog. Let's do the same for the dashboard. Let's update its name to add monorepo/dashboard. Let's run npm install from the root of the project.

[1:19] All right. One thing that is worth noting is that blog doesn't have any package-lock.json file, and neither dashboard. We just have a package.json file inside here, and inside here. The only package-lock.json file that exists, it exists in the root of the project.

[1:42] If we take a look inside its package object, we'll see that we have a monorepo package, and we also have two more packages here. One is apps/blog and its name is monorepo/blog. We also have an apps/dashboard with its name set as monorepo/dashboard.

[2:04] To recap, in order to create applications inside our monorepo, we can use different CLI tools like create-next-app or the Vite CLI. We need to install them inside the apps folder. Here we have the blog. We also have the dashboard. It is also important to note that the only package-lock.json file that should exist, exists in the root of the project.