Get Started in Seconds with Nexjs Examples
source link: https://dev.to/kouliavtsev/get-started-in-seconds-with-nexjs-examples-3f20
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
Most of the developers that start with Nextjs are not aware of the abundance of Nextjs examples, that are part of the Nextjs GitHub repo. You can use a handy CLI tool create-next-app to get any example running in seconds.
Where Can You Find Nextjs Examples?
If you want quickly browse all the examples, you can find them in the examples folder here.
Yet, there is a better way. Simply go to https://nextjs.org/examples. If you scroll down a bit, you will find a nifty filter.
Pretty neat, huh?
Here you can filter examples by:
- Styling
- Data Fetching
- Authentication
- Next.js Features
- Database
- State Management
How to Use Create Next App with an Example?
Nextjs has built an awesome CLI tool that makes it easy to get started in seconds.
npx create-next-app@latest
# or
yarn create next-app
Enter fullscreen mode
Exit fullscreen mode
If you want to start a project with an example, you can do it like this.
npx create-next-app@latest --example [name]|[github-url]
# or
yarn create next-app --example [name]|[github-url]
Enter fullscreen mode
Exit fullscreen mode
Let's do this with a real working example (no pun intended).
yarn create next-app --example auth0 auth0-app
Enter fullscreen mode
Exit fullscreen mode
This will simply create a new Nextjs app located in auth0-app folder. The example auth0 will be already pre-installed.
Bonus
The benefit of using the CLI tool is that you can combine it with many other options. For example, you could add a --ts flag to have typescript also included in your project.
You can read more about other options here.
I hope that Next time (sorry, no pun intended, again) you will be looking for a Nextjs example, you will know where to start.
Happy hacking!
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK