WYSIWYG Markdown Editor

A full-stack markdown editor with live preview, built with Go backend and React/TypeScript frontend.

Features

• Live Preview: Real-time GFM markdown rendering as you type
• File Management: Create, open, edit, save, and delete markdown files
• Three Themes: Light, Dark, and System (auto-detect) with theme persistence
• Responsive Design: Works on mobile (320px) and desktop (1920px)
• CRUD API: RESTful API for file operations

Tech Stack

• Backend: Go with Cobra CLI, logrus logging, standard HTTP server
• Frontend: React, TypeScript, Tailwind CSS, Vite, marked (GFM parser)
• Storage: Local filesystem (flat structure)

Quick Start

Prerequisites

• Go 1.21+
• Node.js 20+
• Nix (optional, for development environment)

Development

1. Enter the development environment (with Nix):

   nix develop
   

2. Start the backend:

   make dev-backend
   # or: cd backend && go run main.go
   

3. Start the frontend (in another terminal):

   make dev-frontend
   # or: cd frontend && npm run dev
   

4. Open http://localhost:5173 (frontend dev server) or http://127.0.0.1:8080 (backend)

Build & Run

# Build everything (frontend + backend)
make build

# Run the built application
make run
# or: ./bin/markdown-editor-backend

# Run tests
make test

CLI Options

./bin/markdown-editor-backend --help

Flags:
  --data-dir string   Storage path for markdown files (default "./data")
  --host string       Bind address (default "127.0.0.1")
  --port int          Server port (default 8080)

API Endpoints

Method	Endpoint	Description
GET	/api/health	Health check
GET	/api/files	List all files
POST	/api/files	Create new file
GET	/api/files/{name}	Get file content
PUT	/api/files/{name}	Update file
DELETE	/api/files/{name}	Delete file

Project Structure

.
├── backend/
│   ├── main.go              # CLI entry point
│   ├── server/              # HTTP server
│   ├── handlers/            # API handlers
│   ├── storage/             # File storage
│   └── static/              # Frontend build output
├── frontend/
│   ├── src/
│   │   ├── components/      # React components
│   │   ├── api/             # API client
│   │   └── types.ts         # TypeScript types
│   └── dist/                # Build output
├── data/                    # Markdown files storage
├── bin/                     # Compiled binaries
├── Makefile                 # Build automation
└── flake.nix                # Nix development environment

Testing

# Run all tests
make test

# Backend tests only
make backend-test

# Frontend tests only
make frontend-test

License

MIT