{"id":22248845,"url":"https://github.com/blocklune/astro-dracula-blog","last_synced_at":"2025-07-28T04:31:22.873Z","repository":{"id":261589663,"uuid":"875329375","full_name":"BlockLune/astro-dracula-blog","owner":"BlockLune","description":"A fast and simple blog system with dracula theme built with Astro","archived":false,"fork":false,"pushed_at":"2025-07-10T11:13:38.000Z","size":2734,"stargazers_count":37,"open_issues_count":0,"forks_count":7,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-07-24T10:58:27.456Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://blocklune.cc","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/BlockLune.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-10-19T17:28:56.000Z","updated_at":"2025-07-08T15:30:24.000Z","dependencies_parsed_at":"2024-12-09T09:27:02.894Z","dependency_job_id":"49763e70-70a7-4882-ad3d-142c03050810","html_url":"https://github.com/BlockLune/astro-dracula-blog","commit_stats":null,"previous_names":["blocklune/astro-dracula-blog"],"tags_count":0,"template":true,"template_full_name":null,"purl":"pkg:github/BlockLune/astro-dracula-blog","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BlockLune%2Fastro-dracula-blog","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BlockLune%2Fastro-dracula-blog/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BlockLune%2Fastro-dracula-blog/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BlockLune%2Fastro-dracula-blog/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/BlockLune","download_url":"https://codeload.github.com/BlockLune/astro-dracula-blog/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BlockLune%2Fastro-dracula-blog/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":267464016,"owners_count":24091491,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-07-28T02:00:09.689Z","response_time":68,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-12-03T06:19:36.641Z","updated_at":"2025-07-28T04:31:22.862Z","avatar_url":"https://github.com/BlockLune.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Astro Dracula Blog\n\n\u003cp\u003e\n    \u003ca href=\"https://blocklune.cc\"\u003e\u003cstrong\u003e🛑 Live Demo\u003c/strong\u003e\u003c/a\u003e\u0026nbsp;\u0026nbsp;/\u0026nbsp;\u0026nbsp;\n    \u003ca href=\"doc/gallery.md\"\u003e\u003cstrong\u003e🖼️Gallery\u003c/strong\u003e\u003c/a\u003e\u0026nbsp;\u0026nbsp;/\u0026nbsp;\u0026nbsp;\n    \u003cstrong\u003e🌏 English\u003c/strong\u003e\u0026nbsp;\u0026nbsp;/\u0026nbsp;\u0026nbsp;\n    \u003ca href=\"doc/readme_zh.md\"\u003e\u003cstrong\u003e🌏 简体中文\u003c/strong\u003e\u003c/a\u003e\n\u003c/p\u003e\n\n🌟 A fast and simple blog system with dracula theme built with Astro v5.\n\n[![Astro Dracula Blog](doc/img/hero.webp)](doc/gallery.md)\n\n## :fire: Features\n\n- [x] :rocket: Fast \u0026 High Performance\n- [x] :star: Simple \u0026 Clean Design\n- [x] :iphone: Responsive Design\n- [x] :vampire_man: Dracula Theme\n- [x] :zap: Animations created with [Motion](https://motion.dev) (the original Framer Motion)\n- [x] :mag: Fuzzy Search built with [fuse.js](https://www.fusejs.io/)\n- [x] :world_map: Sitemap \u0026 RSS Feed\n- [x] :spider_web: SEO-Friendly\n- [x] :robot: Auto [llms.txt](https://llmstxt.org/) generation (LLMs-Friendly)\n- [x] :earth_asia: I18n-Supported (`zh` \u0026 `en`)\n- [x] :triangular_ruler: Mathjax\n- [x] :octocat: [GitHub Alerts](https://github.com/chrisweb/rehype-github-alerts)\n- [x] :book: TOC (Table of Contents)\n- [x] :framed_picture: Dynamic Open Graph Generation for Posts\n- [x] :copyright: Project under MIT License \u0026 Support License customization for each post\n\n## :white_check_mark: Lighthouse Score\n\n\u003cp aligh=\"center\"\u003e\n    \u003ca href=\"https://pagespeed.web.dev/analysis/https-blocklune-cc/72o0c25cxa?form_factor=desktop\"\u003e\n        \u003cimg alt=\"Astro Dracula Blog Lighthouse Score\" src=\"doc/img/lighthouse-score.png\" /\u003e\n    \u003c/a\u003e\n\u003c/p\u003e\n\n## :rocket: How To Use\n\nFile structure:\n\n```text\n.\n├── astro.config.mjs\n├── package.json\n├── public/\n├── src/\n│   ├── assets/\n│   │   └── avatar.webp\n│   ├── components/\n│   ├── config.ts\n│   ├── content.config.ts\n│   ├── content/\n│   │   ├── drafts/\n│   │   │   └── ...\n│   │   ├── info/\n│   │   │   ├── en/\n│   │   │   │   └── about.md\n│   │   │   └── zh/\n│   │   │       └── about.md\n│   │   └── posts/\n│   │       ├── en/\n│   │       │   └── example-post.md\n│   │       └── zh/\n│   │           └── example-post.md\n│   ├── middleware.ts\n│   ├── pages/\n│   ├── schemas/\n│   ├── styles/\n│   └── utils/\n├── tailwind.config.mjs\n└── tsconfig.json\n```\n\nTo use this theme, follow these steps:\n\n1. Edit `src/config.ts` to configure the basic information for your site. You can also configure your [umami](https://umami.is/) analytics and search engine verifications here.\n2. Replace `src/assets/avatar.webp` with your own avatar.\n3. Rewrite your own about page text in `src/content/info/en/about.md` \u0026 `src/info/zh/about.md` (**📌Note: Please retain the license information contained therein and, if possible, the url for this project❤️.**).\n4. Delete my posts in `src/content/posts` and write your own. Currently the theme supports both Chinese and English languages, for different language versions of the same post, you need to make sure they are located in the `en` and `zh` directories and use the same filename.\n5. Remove `public/_redirects` and use your own Netlify redirect configuration.\n6. Remove the icons in `public` and use your own. The commands below may be helpful:\n\n```bash\n# https://github.com/yy4382/yfi.moe/blob/main/app/blog/src/components/modules/head/Favicon.astro\nmkdir magic\nmagick logo.png -resize 16  ./magic/favicon-16.png\nmagick logo.png -resize 32  ./magic/favicon-32.png\nmagick logo.png -resize 48  ./magic/icon-48.png\nmagick logo.png -resize 96  ./magic/icon-96.png\nmagick logo.png -resize 144 ./magic/icon-144.png\nmagick logo.png -resize 192 ./magic/icon-192.png\nmagick logo.png -resize 256 ./magic/icon-256.png\nmagick logo.png -resize 384 ./magic/icon-384.png\nmagick logo.png -resize 512 ./magic/icon-512.png\nmagick logo.png -resize 120 ./magic/apple-touch-icon-120.png\nmagick logo.png -resize 152 ./magic/apple-touch-icon-152.png\nmagick logo.png -resize 167 ./magic/apple-touch-icon-167.png\nmagick logo.png -resize 180 ./magic/apple-touch-icon-180.png\nmagick ./magic/favicon-32.png ./magic/favicon-16.png ./magic/favicon.ico\n```\n\n### Write a New Post\n\nTo start writing a new post, you can use the `pnpm new` command (see below), or follow these steps:\n\n1. Create a file in `src/content/posts/en` if you are writing the English version of a post, say `hello-world.md`.\n2. Edit the file `src/content/posts/en/hello-world.md` like this:\n\n```text\n---\ntitle: Hello World\ntags:\n- hello\n- my-first-post\ndate: 2024-11-12 18:50:00\n---\n\nHello! This is my first post!\n\n\u003c!--more--\u003e\n\nI'm writing my first post!\n```\n\nCurrently, Frontmatter supports the following properties\n\n- `title`: the title of a post\n- `tags`: the tags of a post\n- `date`: the published date of a post\n- `updated`: the updated date of a post\n- `license`: the license of a post, set to `none` to disable the license for a specific post\n- `licenseLink`: the license link\n- `ogImageUrl`: specify an Open Graph image for a specific post\n\n### Customize License\n\nTo customize default license, edit the `src/config.ts` file. To customize the license for a specific post, edit the `license` property in the Frontmatter of the post file.\n\n### Customize Color Scheme\n\nTo customize the color scheme of this theme, edit the following files:\n\n- `src/components/style/prose.astro`\n- `src/styles/global.css`\n- `src/styles/rehype-github-alerts.css`\n- `tailwind.config.mjs`\n\n### I18n Configuration\n\nCurrently this theme supports both Chinese and English, and uses English as its default language.\n\nTo switch it to Chinese:\n\n- Edit `src/utils/i18n.ts`:\n\n```ts\nexport const defaultLang : Lang = \"zh\";\n```\n\n- Edit `public/_redirects` (Make sure these are at the end of the file):\n\n```text\n/ /en 302! Language=en\n/ /zh 302!\n```\n\n### Useful Commands\n\n```bash\n# install dependencies\npnpm install\n\n# start the dev server\npnpm dev\n\n# build the project\npnpm build\n\n# preview (after the build)\npnpm preview\n\n# create a new post (or draft)\npnpm new\n```\n\nMore detailed usage of `pnpm new` (The output of `pnpm new --help`):\n\n```text\nUsage: pnpm new [options] \u003cpost-title\u003e\n\nOptions:\n  -l, --lang \u003cen|zh\u003e   Set the language (default: en)\n  -d, --draft          Create a draft post (default: false)\n  -m, --mdx            Use MDX format (default: false)\n  -h, --help           Show this help message\n\nExample:\n  pnpm new \"Hello World\"\n  pnpm new -l zh \"你好，世界\"\n```\n\n\u003e [!Caution]\n\u003e Due to [the slug generation library used](https://www.npmjs.com/package/slugify), an empty slug will be generated for a full Chinese title like “你好，世界”, which will result in a file called `Untitled.md`.\n\n## :books: The Story\n\nThis is my fourth attempt at building a blog system. My journey began at the tender age of 14, when I first dabbled in creating a blog. I learned the basics of HTML in a junior high computer class, and furthered my knowledge through resources such as [doyoudo](https://www.bilibili.com/video/BV1gp411f7j6). My first attempt at blogging was a simple static site created with HTML \u0026 CSS, no JavaScript, and hosted on GitHub Pages.\n\nAs I approached college, I experimented with [Hexo](https://hexo.io/) and the [Icarus](https://ppoffice.github.io/hexo-theme-icarus/) theme for my second blog. For the third iteration, I continued using Hexo, but this time with the [NexT](https://theme-next.js.org/) theme. Using a framework like Hexo greatly streamlines the blogging process, allowing me to focus on content creation. However, I have always felt the \"weight\" of using a framework.\n\nDetermined to create a blog that was truly my own, I decided to build one from the ground up. And here it is!\n\nThe blog is mainly built with [Astro](https://astro.build/) with [React](https://react.dev/) components. I chose Astro because it is super fast. The color scheme is inspired by [Dracula](https://draculatheme.com/). I use [Tailwind CSS](https://tailwindcss.com/) for styling and [Tailwind Typography](https://github.com/tailwindlabs/tailwindcss-typography) for typography. And I do some animations with [Motion](https://motion.dev) (the original Framer Motion).\n\n## :link: References\n\n- [Dracula Theme](https://draculatheme.com/contribute)\n- [overreacted.io - Dan's blog](https://overreacted.io/)\n- [bearblog.dev](https://bearblog.dev/)\n- [Astro Docs](https://docs.astro.build/)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fblocklune%2Fastro-dracula-blog","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fblocklune%2Fastro-dracula-blog","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fblocklune%2Fastro-dracula-blog/lists"}