View Code? Open in Web Editor
NEW
✍️ A local-first Markdown note-taking app built with Vue.js, Tailwind CSS, and Electron.
License: MIT License
JavaScript 91.62%
HTML 3.66%
CSS 3.06%
TypeScript 1.66%
graphite's Introduction
⚠️ This repo is for demo purposes only ⚠️
⚠️ Don't use Graphite to edit local files ⚠️
A local-first Markdown note-taking app built with Vue.js, Tailwind, and Electron.
- In 2020, I quit my tech job to focus on creating web development tutorials on YouTube.
- After spending a few months playing around with different technologies, I decided to focus on Vue + Tailwind.
- In order to test how far I've come with the tech stack, I made Graphite, a local-first markdown note-taking app.
- Note: I built Graphite in ~1 week so don't mind the code quality or lack of tests.
Demo GIF (takes a few seconds to load)
- Stack
- Libraries
- Marked (convert markdown to html)
- CodeMirror (builing your own editor is hard)
- Hotkeys (makes keyboard shortcuts easy)
- Basic
- Add/remove/rename/move files
- Markdown preview
- CodeMirror editor
- Keybindings
- Open file search ->
command + o
- Close file search ->
esc
- Toggle sidebar ->
command + b
- Configurable Themes with CSS Variables
- TODO
- WYSIWYG
- Add/remove/rename/move folders
- Watch for file changes in Electron and persist changes automatically
- Actually release a desktop app for Mac/Windows/Linux
graphite's People
Contributors
Watchers
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent