/blog

📚 DevNow is an open source technology blog project. It currently hosts weekly news (about technology, development and product), which is published every Monday morning.

Primary LanguageAstroMIT LicenseMIT

🚀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.

Screenshot

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

用Vercel部署

📌 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 by Algolia
  • ✅ Comments by Giscus
  • ✅ Pagination
  • ✅ Headless CMS by 🦙 Tina CMS

⚙️ Stack

👨🏻‍💻 Running Locally

  1. Clone or fork the repository:
git@github.com:LaughingZhu/DevNow.git
  1. Install dependencies:
pnpm install
  1. Run the development server:
pnpm dev
  1. build production
pnpm build

📐 Vercel env config

Here env config

// doc seach config
PUBLIC_SEARCH_APP_ID;
PUBLIC_SEARCH_API_KEY;

// 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:

GiscusDocSearch 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

Search config: DocSearch

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

  2. Env config

  • Private project: .env --> PUBLIC_SEARCH_APP_ID、PUBLIC_SEARCH_API_KEY
  • 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

Sponsors

sponsor me by wechat or alipay

Buy Me A Coffee Buy Me A Coffee

Star History

Star History Chart