https://github.com/jolbol1/nextjs-velite-blog-template
A static blog template built using NextJS 14, Velite, Tailwind, Shadcn/UI and MDX. Follow along on YouTube!
https://github.com/jolbol1/nextjs-velite-blog-template
mdx nextjs shadcn tailwind velite
Last synced: 3 months ago
JSON representation
A static blog template built using NextJS 14, Velite, Tailwind, Shadcn/UI and MDX. Follow along on YouTube!
- Host: GitHub
- URL: https://github.com/jolbol1/nextjs-velite-blog-template
- Owner: jolbol1
- Created: 2024-03-06T18:21:47.000Z (about 1 year ago)
- Default Branch: master
- Last Pushed: 2024-03-21T09:04:06.000Z (about 1 year ago)
- Last Synced: 2024-03-21T18:05:59.676Z (about 1 year ago)
- Topics: mdx, nextjs, shadcn, tailwind, velite
- Language: TypeScript
- Homepage: https://my-first-blog-dusky.vercel.app
- Size: 410 KB
- Stars: 14
- Watchers: 1
- Forks: 3
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## NextJS 14, Tailwind, Shadcn UI, MDX and Velite Blog Template
In this repo is a simple implementation of a markdown static blog, a demo can be seen [here](https://my-first-blog-dusky.vercel.app/), Features include:
- MDX Components
- Shadcn UI
- Pagination
- Dynamic Open Graph Image
- Syntax Highlighting in code block
### Learning Points
Hopefully, from this project and the video, you can learn:
- NextJS 14 basics (layouts, app router etc)
- NextJS SEO
- NextJS Dynamic Graph Images
- [Velite](https://velite.js.org/) Setup and usage
- [Shadcn/ui](https://ui.shadcn.com/) setup and usage
- Custom components in MDX
- Tailwind styling
## YouTube
You can follow along with me as we build this on YouTube. The commits will line up with the GitHub chapters so you can easily see what changed in each section.
[](https://youtu.be/tSI98g3PDyE?si=fBBR3S3XWhhQyYON)
## Credits
Much of the design of this project is taken from shadcn in his projects, such as [shadcn/ui](https://ui.shadcn.com/) and [Taxonomy](https://tx.shadcn.com/)