diff --git a/README.md b/README.md index 8d62f5e..2225d91 100644 --- a/README.md +++ b/README.md @@ -1,48 +1,60 @@ # Markdown Blog -A modern blog system built with Next.js, Markdown, and Electron for cross-platform support. +[![Next.js](https://img.shields.io/badge/Next.js-14-black?style=flat-square&logo=next.js&logoColor=white)](https://nextjs.org/) +[![Tailwind CSS](https://img.shields.io/badge/TailwindCSS-3.4-blue?style=flat-square&logo=tailwind-css&logoColor=white)](https://tailwindcss.com/) +[![TypeScript](https://img.shields.io/badge/TypeScript-5-blue?style=flat-square&logo=typescript&logoColor=white)](https://www.typescriptlang.org/) +[![Electron](https://img.shields.io/badge/Electron-28-47848F?style=flat-square&logo=electron&logoColor=white)](https://www.electronjs.org/) +[![MIT License](https://img.shields.io/badge/License-MIT-green?style=flat-square)](LICENSE) -## Features +A modern, cross-platform blog system built with **Next.js**, **Markdown**, and **Electron**. Write posts in Markdown, manage content visually, and deploy to web or desktop. -- Write blog posts in Markdown -- Responsive web design -- Desktop application support via Electron -- Mobile-friendly interface -- Tag-based organization -- Clean and modern UI +--- -## Getting Started +## ✨ Features + +- ✍️ **Markdown-based posts** — Write and organize content in Markdown files +- ⚡ **Hot reloading** — See changes instantly as you edit posts +- 🗂️ **Folder & tag organization** — Structure your content with folders and tags +- 🖥️ **Electron desktop app** — Run your blog as a native desktop app +- 📱 **Responsive UI** — Mobile-friendly and clean design +- 🛠️ **Admin dashboard** — Manage posts and folders visually + +--- + +## 🚀 Getting Started ### Prerequisites -- Node.js 18+ and npm +- [Node.js 18+](https://nodejs.org/) +- [npm](https://www.npmjs.com/) ### Installation -1. Clone the repository: ```bash -git clone +git clone cd markdownblog -``` - -2. Install dependencies: -```bash npm install ``` -3. Start the development server: -```bash -npm run dev -``` +### Development -4. For desktop development: -```bash -npm run electron-dev -``` +- **Web:** + `npm run dev` +- **Desktop (Electron):** + `npm run electron-dev` -### Writing Posts +### Production -Create new blog posts by adding Markdown files to the `posts/` directory. Each post should include frontmatter with the following fields: +- **Web build:** + `npm run build` +- **Desktop build:** + `npm run electron-build` + +--- + +## 📝 Writing Posts + +Add Markdown files to the `posts/` directory. Each post should have frontmatter: ```markdown --- @@ -55,39 +67,47 @@ summary: "A brief summary of your post" Your post content here... ``` -### Building for Production +--- -1. Build the web version: -```bash -npm run build -``` - -2. Build the desktop version: -```bash -npm run electron-build -``` - -## Project Structure +## 🗂️ Project Structure ``` markdownblog/ ├── posts/ # Markdown blog posts ├── src/ -│ ├── app/ # Next.js app directory -│ └── lib/ # Utility functions -├── electron/ # Desktop app code -└── public/ # Static assets +│ ├── app/ # Next.js app directory +│ └── lib/ # Utility functions +├── electron/ # Desktop app code +├── public/ # Static assets (favicons, etc.) +└── ... ``` -## Technologies Used +--- -- Next.js 14 -- TypeScript -- Tailwind CSS -- Electron -- Markdown (remark) -- date-fns +## 🌐 Favicon -## License +Place your favicon files (e.g., `favicon.ico`, `favicon-32x32.png`, `favicon-16x16.png`) in the `public` directory at the project root. +Next.js will automatically serve these at the root URL (e.g., `/favicon.ico`). + +--- + +## 🛠️ Technologies Used + +- [Next.js 14](https://nextjs.org/) +- [TypeScript](https://www.typescriptlang.org/) +- [Tailwind CSS](https://tailwindcss.com/) +- [Electron](https://www.electronjs.org/) +- [Remark](https://remark.js.org/) (Markdown) +- [date-fns](https://date-fns.org/) + +--- + +## 🐳 Docker + +A sample `Dockerfile` and `manage_container.sh` are included for containerized deployment. + +--- + +## 📄 License MIT \ No newline at end of file diff --git a/public/android-chrome-192x192.png b/public/android-chrome-192x192.png new file mode 100644 index 0000000..af36fa2 Binary files /dev/null and b/public/android-chrome-192x192.png differ diff --git a/public/android-chrome-512x512.png b/public/android-chrome-512x512.png new file mode 100644 index 0000000..e267cfe Binary files /dev/null and b/public/android-chrome-512x512.png differ diff --git a/public/apple-touch-icon.png b/public/apple-touch-icon.png new file mode 100644 index 0000000..988dcd9 Binary files /dev/null and b/public/apple-touch-icon.png differ diff --git a/public/favicon-16x16.png b/public/favicon-16x16.png new file mode 100644 index 0000000..2e4eb71 Binary files /dev/null and b/public/favicon-16x16.png differ diff --git a/public/favicon-32x32.png b/public/favicon-32x32.png new file mode 100644 index 0000000..8e3fa01 Binary files /dev/null and b/public/favicon-32x32.png differ diff --git a/public/favicon.ico b/public/favicon.ico new file mode 100644 index 0000000..c5da534 Binary files /dev/null and b/public/favicon.ico differ diff --git a/public/site.webmanifest b/public/site.webmanifest new file mode 100644 index 0000000..45dc8a2 --- /dev/null +++ b/public/site.webmanifest @@ -0,0 +1 @@ +{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"} \ No newline at end of file diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 6ecf9ce..3f71d73 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -2,6 +2,7 @@ import type { Metadata } from 'next'; import { Inter } from 'next/font/google'; import './globals.css'; import Link from 'next/link'; +import Head from 'next/head'; const inter = Inter({ subsets: ['latin'] }); @@ -17,6 +18,13 @@ export default function RootLayout({ }) { return ( + + + + + + +