Nuxt Blog
Nuxt Blog is a personal blog site built with Nuxt3, Nuxt-Content V2 & Tailwind. Deployed in vercel
Overview
This article discusses a blog built with Nuxt 3, Nuxt Content 2, Vue 3, and Tailwind CSS. It highlights the features and benefits of using this particular setup for building a blog.
Features
- Write blog with markdown file: Users can write their blog content using markdown files, which makes the process simpler and more efficient.
- Auto generate category from blog post: The blog system automatically generates categories based on the content of the blog posts, reducing the manual categorization effort.
- Blog list page with search and pagination: The blog system provides a blog list page with search functionality and pagination, making it easier for users to navigate and find specific blog posts.
- About me page for user info: Users can create an "About Me" page to provide information about themselves, allowing readers to get to know the author better.
- Auto generate table of content for blog post: The system automatically generates a table of contents for each blog post, enhancing the readability and navigation within the post.
- Auto generate Sitemap: The blog system automatically generates a sitemap, helping with search engine optimization and improving the visibility of the blog.
- Url preview with Nuxt ogImage: The system generates URL previews with Nuxt ogImage, allowing for better visual representations when sharing blog posts on social media.
- Dark and light mode: The blog system offers a dark and light mode, providing a customizable reading experience for users.
- Server-Side Rendered (SSR) with Nuxt 3: The blog is built with Nuxt 3, which offers server-side rendering capabilities for improved performance and SEO.
- Nuxt
nuxt.js is a lightweight and flexible JavaScript framework that allows developers to easily build dynamic and reactive user interfaces. Its intuitive syntax, modular architecture, and focus on performance make it a popular choice for modern web development.
- Tailwind
Tailwind CSS is a utility-first CSS framework that provides pre-defined classes for building responsive and customizable user interfaces.
- Blog
Blog websites feature posts written by one or more authors, organized by categories and tags, with a section for comments and archives sorted by date or topic. Additional features may include search bar, social media sharing, subscription or RSS feed, about and contact pages, and visual content.
- Typescript
TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.
