Creating a Next.js project
For our front end, we will be using Next.js. To create a new application, simply type npx create-next-app client in your terminal. We can cd into our project and run the dev server with yarn dev.
I'll also add some styling in the Home.module.css file that you can copy from the github link below.
Instructor: [0:00] In our terminal, we use the command npx create Next.js Next app. We'll name our app, "Client." This will create a brand new Next.js. We'll stop that and correct the spelling of client. [0:22] After our Next.js application is created, we'll change directories into client, and then start our server with yarn dev. We'll open up our application, which is running on localhost:3000, and we get the usual Next.js starter.
[0:41] We'll open up our Next.js application in VS Code. In VS Code, we'll open our pages folder and inside that open our index.js folder. We'll resize our window, and we'll start by getting rid of this div.
[0:54] We'll change, "Welcome to Next.js" to "Welcome to the future of content." Now, for some styling, we'll go into home.module.styles, and paste this class as well as main blog.
[1:18] We'll go to the bottom and look at our footer and update those classes, and save. Our page should look a little different. There you go. That is how you create a brand new Next.js application.
Member comments are a way for members to communicate, interact, and ask questions about a lesson.
The instructor or someone from the community might respond to your question Here are a few basic guidelines to commenting on egghead.io
Be on-Topic
Comments are for discussing a lesson. If you're having a general issue with the website functionality, please contact us at support@egghead.io.
Avoid meta-discussion
Code Problems?
Should be accompanied by code! Codesandbox or Stackblitz provide a way to share code and discuss it in context
Details and Context
Vague question? Vague answer. Any details and context you can provide will lure more interesting answers!