Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/royluonanjing/electron-react-cloud-notebook
A cross-platform desktop app of markdown notebook built by Electron + React + Cloud
https://github.com/royluonanjing/electron-react-cloud-notebook
electron electron-react-boilerplate electron-store markdown-editor react sass typescript
Last synced: 26 days ago
JSON representation
A cross-platform desktop app of markdown notebook built by Electron + React + Cloud
- Host: GitHub
- URL: https://github.com/royluonanjing/electron-react-cloud-notebook
- Owner: RoyLuoNanjing
- License: mit
- Created: 2024-03-05T21:24:14.000Z (8 months ago)
- Default Branch: main
- Last Pushed: 2024-04-06T17:02:39.000Z (7 months ago)
- Last Synced: 2024-10-12T16:42:44.517Z (26 days ago)
- Topics: electron, electron-react-boilerplate, electron-store, markdown-editor, react, sass, typescript
- Language: TypeScript
- Homepage:
- Size: 2.94 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README
# A cloud-based Markdown notebook program written in TypeScript using Electron-React-Boilerplate
## What is Electron?
It is an interesting web technology embedding Chromium and Node.js to enable web developers to create desktop applications.
Electron apps run on three platforms across all supported architectures (Compatible with macOS, Windows, and Linux).
It surprised me to see that many software applications I use were developed using Electron, including 1Password, Skype, Microsoft Teams, Postman, and of course, VS Code!
## What I learnt in this repo
As a beginner, I didn't have high expectations for this project. However, I found it really interesting to learn about the concepts of how my program interacts with the operating system, even though I was just writing TypeScript within the React framework.
It also served as an exercise to train and test how quickly I could absorb new knowledge and solve problems independently in software development.
## What can this program do?
It's a markdown notebook where you can create, edit, delete, import, and export MD files. Additionally, it has the capability to sync with any cloud storage service such as AWS S3.
Most importantly, it functions like a web product, but you can also download and install this Electron program.
### Main Page
### Import
By clicking the import button, you can import any MD type files into the program
### Create an markdown file
From the sidebar, you can select or create new file
By clicking the import button, you can import any MD type files into the program
### Window Menu
Like most software, you can add ant function into the menu
### Markdown editor
I introduced SimpleMDE to provide the editor's functionality and wrote the logic for the tabs, where users will be informed if the file is not saved.
### Keyboard Control
Have you noticed how clean this interface is? There are no redundant buttons cluttering the user interactions. This is because all actions, such as delete, save, confirm, and quit, are controlled by keyboard commands. Just like in a Word document, you can quickly save your file by using 'Ctrl+S'.
### Search
Of course, you can search for specific files using keywords.
