Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings

ONode/marknote

Open more actions menu

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
4 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Markdown

A modern Next.js application for viewing and editing Markdown content with Mermaid diagram support, optimized for Bun.

Features

  • Markdown Editor: Rich text editing with syntax highlighting
  • Mermaid Diagrams: Support for various diagram types (flowcharts, sequence diagrams, class diagrams, etc.)
  • Real-time Preview: Split-view editing with live preview
  • Responsive Design: Mobile-friendly interface
  • Theme Support: Light/dark mode toggle
  • File Import/Export: Save and load your Markdown files

Tech Stack

  • Framework: Next.js 15 with App Router
  • Language: TypeScript
  • Runtime: Bun (optimized)
  • Styling: Tailwind CSS
  • UI Components: Radix UI + shadcn/ui
  • Markdown: Marked.js with custom Mermaid processing
  • Diagrams: Mermaid.js

Quick Start

Prerequisites

  1. Install Bun: Make sure you have Bun installed

    curl -fsSL https://bun.sh/install | bash
  2. Verify Installation:

    bun --version

Development

  1. Install Dependencies:

    bun install
  2. Start Development Server:

    bun run dev
  3. Open Browser: Navigate to http://localhost:3000

Production Build

  1. Build the Application:

    bun run build
  2. Start Production Server:

    bun run start

Available Scripts

  • bun run dev - Start development server with Turbopack
  • bun run build - Build for production
  • bun run start - Start production server
  • bun run lint - Run ESLint
  • bun run type-check - Run TypeScript type checking
  • bun run clean - Clean build artifacts
  • bun run install-deps - Install dependencies using Bun

Project Structure

src/
├── app/                 # Next.js App Router pages
├── components/          # React components
│   ├── ui/             # shadcn/ui components
│   ├── doc-viewer.tsx  # Document viewer component
│   ├── docs-sidebar.tsx # Documentation sidebar
│   ├── markdown-editor.tsx # Markdown editor
│   └── markdown-viewer.tsx # Markdown renderer with Mermaid
├── hooks/               # Custom React hooks
├── lib/                 # Utility functions
└── actions/             # Server actions

Mermaid Diagram Support

The application supports various Mermaid diagram types:

  • Flowcharts: graph TD, flowchart LR
  • Sequence Diagrams: sequenceDiagram
  • Class Diagrams: classDiagram
  • Gantt Charts: gantt
  • And more...

Example

```mermaid
graph TD
    A[Start] --> B{Decision?}
    B -->|Yes| C[Continue]
    B -->|No| D[Stop]

Configuration Files

  • bunfig.toml - Bun configuration
  • .bunrc - Additional Bun runtime settings
  • next.config.ts - Next.js configuration
  • tsconfig.json - TypeScript configuration

Benefits of Using Bun

  • Faster Package Installation: Significantly faster than npm/yarn
  • Improved Build Performance: Better TypeScript compilation
  • Memory Efficiency: Lower memory usage during development
  • Native TypeScript Support: Built-in TypeScript support
  • Full Compatibility: Works with existing Node.js ecosystem

Contributing

  1. Fork the repository
  2. Create a feature branch
  3. Make your changes
  4. Run tests and type checking
  5. Submit a pull request

License

This project is open source and available under the MIT License.

About

note-markdown

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Morty Proxy This is a proxified and sanitized view of the page, visit original site.