https://github.com/heysupratim/electron-react-md
Boilerplate Electron Markdown Edit and Preview with Codemirror + React + Remark + Rehype + Forge + Vite
https://github.com/heysupratim/electron-react-md
codemirror electron electron-forge react rehype-highlight rehype-plugin remark-parse remarkjs typescript unified vitejs
Last synced: about 2 months ago
JSON representation
Boilerplate Electron Markdown Edit and Preview with Codemirror + React + Remark + Rehype + Forge + Vite
- Host: GitHub
- URL: https://github.com/heysupratim/electron-react-md
- Owner: heysupratim
- Created: 2022-12-19T05:14:39.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2022-12-20T22:12:41.000Z (over 2 years ago)
- Last Synced: 2025-02-09T18:18:15.119Z (3 months ago)
- Topics: codemirror, electron, electron-forge, react, rehype-highlight, rehype-plugin, remark-parse, remarkjs, typescript, unified, vitejs
- Language: TypeScript
- Homepage:
- Size: 159 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
### Electron React Markdown Edit and Preview
This is a boilerplate project consisting the following
1. [codemirror](https://codemirror.net/) for markdown editing pane
2. [unified](https://unifiedjs.com) + [remark-parse](https://github.com/remarkjs/remark/tree/main/packages/remark-parse) plugin to convert markdown text on the codemirror pane to a "remark-parse" syntax tree
3. [remark-rehype](https://github.com/remarkjs/remark-rehype) to convert remark syntax trees to rehype tree for enabling further conversion pipeline
4. [rehype-highlight](https://github.com/rehypejs/rehype-highlight) plugin to add syntax highlighting classes (using [highlight.js](https://highlightjs.org) class nomenclature)
5. [rehype-react](https://github.com/rehypejs/rehype-react) to convert rehype syntax tree to react dom
6. highlight js css imports to convert rehype-higlight syntax classes to actual color values.
7. [vite](https://vitejs.dev/) for building src files, dev server with hot reloading and hot module replacement
8. [electron-forge](https://www.electronforge.io/) for the stable electron building and packaging workflow
9. typescript+react for everything
10. [concurrently](https://www.npmjs.com/package/concurrently) to make vite server and electron start happens at the same time and not one after the other as in dev environment electron loads vite localhost port for all its views.
11. [cross-env](https://www.npmjs.com/package/cross-env) to pass a development flag to electron app.js