Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/greyovo/markditorapp
✍️ Yet another WYSIWYG Markdown editor written in TypeScript and Tauri. Aiming to be an open-source alternative to Typora. (🤗WIP)
https://github.com/greyovo/markditorapp
electron markditor markdown markdown-editor react tauri typora vditor wysiwyg wysiwyg-editor
Last synced: about 1 month ago
JSON representation
✍️ Yet another WYSIWYG Markdown editor written in TypeScript and Tauri. Aiming to be an open-source alternative to Typora. (🤗WIP)
- Host: GitHub
- URL: https://github.com/greyovo/markditorapp
- Owner: greyovo
- License: mit
- Created: 2024-01-12T11:43:45.000Z (10 months ago)
- Default Branch: dev
- Last Pushed: 2024-05-02T17:07:50.000Z (7 months ago)
- Last Synced: 2024-10-12T16:42:54.077Z (about 1 month ago)
- Topics: electron, markditor, markdown, markdown-editor, react, tauri, typora, vditor, wysiwyg, wysiwyg-editor
- Language: TypeScript
- Homepage: https://greyovo.github.io/PicQuery
- Size: 19.4 MB
- Stars: 13
- Watchers: 3
- Forks: 2
- Open Issues: 6
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Markditor
English | 简体中文
Yet another WYSIWYG Markdown editor written in TypeScript and Tauri. Aims to be an open-source alternative to Typora.
> **[Markditor]** = **[Mark]** down + e **[ditor]**.
> Supports Windows 10 / 11 by now.
> ⚠️ WIP. Be careful when editing your important documents.
| light | dark |
| ------------------------------------------ | ----------------------------------------- |
|  |  |
|  |  |
## Technology Stack
Markditor is heavily based on [Vditor](https://github.com/Vanessa219/vditor), and we used a modified version of it. [(Check out repo)](https://github.com/greyovo/vditor). In addition, we also built on top of the following technology stack:
- React
- **Tauri** (preferred) / Electron
- Zustand
- Radix-UI
- Tailwind CSS
- Vite
## Features
- Instant-render for Markdown typing
- User-friendly table editor
- Auto-save within internal seconds
- Dark mode support
## Download
Go to [releases](https://github.com/greyovo/MarkditorApp/releases) page.
## TODOs
- [ ] Internationalization (i18n)
- [ ] Insert images by: dropping, pasting (automatically copy to `asset` folder)
- [ ] Drag & drop to: open files, or insert images
- [ ] Enhance file management: drag and drop to move files, watch file changes from outside, automatically save when switching windows.
- [ ] Source code mode
- [ ] Export to: PDF or HTML
- [ ] Support macOS, Linux (technically available, but lack of testing devices to confirm)
## Project Architecture
```js
├─build // Build assets used by electron-builder
├─dist // Web contents build output
├─dist-electron // Electron prebuilt files
├─electron // Electron main process
├─public // Public files to be used in HTML
├─release // Electron build output
├─shared // Shared types definitions between renderer and main processes
├─src // Front-end sources
│ ├─assets // Static assets, i.e., fonts
│ ├─components // Global components
│ ├─feat // Feature modules
│ ├─ipc // IPC communication
│ ├─store // Zustand stores and business logics
│ ├─types // Global type definitions
│ └─utils // Utility functions
└─src-tauri // Tauri backend process and build output
```
## Development
> Note: Markditor is initially made with Electron, **but currently Tauri is preferred.** So far Electron is still in development but has some unimplemented Platform API. See `electron/main/handler`. Electron backend may be deprecated in the future.
By encapsulating IPC communication (see `shared/platform_api.d.ts` and `src/ipc`), Markditor can be easily migrated to other backends such as Tauri.
Install dependencies:
```bash
npm install
```
Run in dev mode:
```bash
# Run with Tauri (preferred)
npm run dev:tauri
# Run with Electron
npm run dev:electron
```
Build product:
```bash
# Build with Tauri (preferred)
npm run build:tauri
# Build with Electron
npm run build:electron
```