Skip to content

IISweetHeartII/My_Website_Astro

Repository files navigation

Obsidian Blogger

CI Cloudflare Pages Made with Astro Bun

Transform your Obsidian notes into a beautiful, modern blog with ease. Built with Astro.js for blazing-fast performance and seamless Markdown support.

Obsidian Blogger

Features

  • Blazing Fast: Built with Astro.js for optimal performance and SEO
  • Markdown Support: Write in pure Markdown, just like in Obsidian
  • Beautiful Design: Modern, responsive layout with dark mode support
  • Tag System: Organize posts with tags and browse by categories
  • Mobile-First: Looks great on any device
  • SEO Optimized: Built-in SEO with OpenGraph and canonical URLs
  • RSS Feed: Automatic RSS feed generation
  • Sitemap: Automatic sitemap generation
  • Featured Images: Support for post featured images
  • Date-based Sorting: Chronological post organization
  • Dark Mode: Built-in dark mode support

Quick Start

  1. Clone the repository:
git clone https://github.com/yourusername/obsidian-blogger.git
cd obsidian-blogger
  1. Install dependencies:
bun install
  1. Configure your site:

    • Copy .env.example to .env
    • Update the environment variables for your deployment
  2. Start the development server:

bun dev
  1. Visit http://localhost:4321 to see your blog!

Creating Blog Posts

  1. Add your Markdown files to src/content/blog/
  2. Include required frontmatter:
---
title: "Your Post Title"
description: "Post description for SEO"
publish: true
created_date: 2024-01-19
slug: custom-url
tags:
  - tag1
  - tag2
---

Supported Frontmatter Fields

Field Required Description
title Yes Post title
description No SEO description
publish Yes Set to true to publish
created_date No Publication date
slug No Custom URL slug
tags No Array of tags
featured_image No Hero image URL
subtitle No Optional subtitle

Customization

Site Configuration

Update src/shared/config/consts.ts to modify:

  • Site title
  • Site description
  • Other global constants

Styling

  • Global styles: src/styles/global.css
  • Theme variables: src/styles/theme.css
  • Component styles: Inline in respective .astro files

Deployment

See DEPLOYMENT.md for detailed deployment instructions for:

  • GitHub Pages
  • Netlify
  • Vercel
  • Custom domains

Project Structure

obsidian-blogger/
├── src/
│   ├── features/      # Domain-specific features (blog, newsletter)
│   ├── shared/        # Shared components, utils, config
│   ├── content/       # Blog posts and content
│   ├── layouts/       # Page layouts
│   ├── pages/         # Route components
│   ├── styles/        # Global styles
│   └── assets/        # Static assets (images)
├── public/            # Public assets
├── astro.config.mjs   # Astro configuration
├── biome.json         # Biome linter/formatter config
└── package.json       # Project dependencies

Development Commands

Command Action
bun dev Start dev server
bun run build Build for production
bun run preview Preview production build
bun run lint Run Biome linter
bun run format Format code with Biome
bun run check Run Biome check + TypeScript type check
bun run type-check Run TypeScript type checking only
bun run deps:check Check for dependency updates (using ncu)
bun run deps:update Update dependencies and install

Production-Ready Features

Code Quality

  • Biome: Fast linter and formatter (replaces ESLint + Prettier)
  • TypeScript Strict: Maximum type safety
  • Husky: Pre-commit hooks with Biome check
  • commitlint: Conventional commit messages

Setup

# Install all dependencies
bun install

# Initialize Git hooks
bun run prepare

# Run all checks
bun run check

CI/CD

This project uses GitHub Actions (CI) + Cloudflare Pages (CD).

GitHub Actions (Automated Quality Checks)

  • Biome lint and format check
  • TypeScript type check
  • Project build verification
  • Lighthouse performance (PR only)

Cloudflare Pages (Automated Deployment)

  • Production: mainhttps://log8.kr
  • Preview: develop → https://*.pages.dev
  • PR Previews: Auto-generated

See .github/workflows/ for workflow files.

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

License

This project is licensed under the MIT License - see the LICENSE file for details.

Support

If you find this project helpful, please consider:

  • Starring the repository
  • Sharing it with others
  • Contributing to its development

Documentation

Development Guides

Content Creation

Deployment

Links

Tech Stack

  • Framework: Astro v5.16.x
  • Styling: TailwindCSS v4.1.x (with @tailwindcss/vite)
  • Package Manager: Bun
  • Code Quality: Biome (linter + formatter)
  • Font: Pretendard (Korean optimized)
  • SEO: Built-in SEO/AEO optimization

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 2

  •  
  •