🚀Hello There

简体中文

DevNow is a minimal open source tech blog project template, support Vercel one-click deployment, support comments, search, etc., welcome everyone to experience.

🔗 Demo ： https://www.laughingzhu.cn/

---

⭐ Leave a star if you like this project! ⭐️

📌 Features

• ✅ Mobile responsive
• ✅ SEO & OpenGraph
• ✅ Markdown & MDX support
• ✅ Syntax highlighting
• ✅ Image optimization
• ✅ Dark mode
• ✅ Copy code block
• ✅ Sitemap support
• ✅ RSS Feed support
• ✅ Reading Time
• ✅ 📝 Draft mode
• ✅ 🔍 Seach
• ✅ Comments by Giscus
• ✅ Pagination
• ✅ Headless CMS by 🦙 Tina CMS

⚙️ Stack

• ASTRO + Typescript - Astro is the all-in-one web framework designed for speed.
• Tailwind CSS + Tailwind-Merge + clsx - Tailwind CSS is a utility-first CSS framework.
• Search Library - Search library integration.
• Tina CMS - CMS.

👨🏻‍💻 Running Locally

1. Clone or fork the repository:

[email protected]:LaughingZhu/DevNow.git

2. Install dependencies:

pnpm install

3. Run the development server:

pnpm dev

1. build production

pnpm build

📐 Vercel env config

Here env config

// Giscus comment config
PUBLIC_GISCUS_REPO_ID;
PUBLIC_GISCUS_REPO;

// Google analytics config
PUBLIC_GOOGLE_ANALYTICS_ID;

// Sentry config
PUBLIC_SENTRY_DNS;
PUBLIC_SENTRY_TOKEN;

📢 Notice：

Giscus feature need open status in config/index

if you are private deployment, you need to update these environment variables in.env; if you are public deployment, you need to update these environment variables in Vercel config env，vercel env address

Comment config : Giscus

1. Status src/config --> giscus: true

2. Env config

• Private project: .env --> PUBLIC_GISCUS_REPO_ID、PUBLIC_GISCUS_REPO、和 PUBLIC_GISCUS_CATEGORY_ID

• Public project: Vercel config env，vercel env address

Headless CMS by Tina CMS

Tina CMS

🗂️ Adding a catefory

To add a new category to your blog, simply go to the src/data/categories.ts file and add it to the array.

Example:

export const categories: Category[] = [
  {
    title: 'Tech',
    slug: 'tech',
    color: 'blue',
    description:
      'tech category'
  },
  { new category here } <---
]

Sponsors

Star History