Vue Notepad

A modern desktop note-taking application with a front-end and back-end separation!
Explore the API docs »

Chinese Documentation · English Documentation · Report a Bug

🚀 About Vue Notepad 🚀

Introduction: 😀

Vue Notepad is an advanced desktop note-taking application that employs a front-end and back-end separation architecture. Below are screenshots of the application's interface and features.

Core Features:

1. Comprehensive Note Management: Easily create, delete, and manage notes, to-do lists, and Markdown content. Features include AI summarization, AI conversation, theme switching, and note searching.
2. Powerful User System: Secure account login, registration, and user management, along with back-end note management.
3. Media Handling: Seamlessly upload and manage images within the note environment.
4. Interactive Feedback: A product message system for collecting user feedback.

Technical Highlights:

1. Database Management: Utilizes mysql2 and handles high concurrency through connection pooling.
2. Security: Secure data processing with JWT, back-end request interceptors, and middleware for JWT header validation.
3. Email Notifications: Efficiently sends emails using message queues.
4. Caching and Security: Redis is used to prevent DDoS attacks and page caching. bcrypt is used for password hashing to prevent rainbow table attacks.
5. Environment Configuration: Sensitive information is stored in .env files.
6. SQL Injection Protection: Uses secure SQL syntax to reduce the risk of injection.
7. File Upload Security: Verifies files during the upload process.

Main Languages

This section should list the main frameworks/libraries used to bootstrap your project. Leave any additional components/plugins for the acknowledgments section. Here are some examples.

• https://nextjs.org/
• https://reactjs.org/
• https://vuejs.org/
• https://angular.io/
• https://svelte.dev/
• https://laravel.com
• https://getbootstrap.com
• https://jquery.com

Technology Stack: 😎

• Front-end: A single-page desktop application built with Vue3, Vite, Vuex, ElementUI Plus, Vue Router, Electron, Axios, Fuse.js, and Vditor.
• Local Back-end: Node.js environment.
• Server Back-end: A powerful back-end setup, including Node.js, PHP, Python, Express, Redis, mysql2, CORS, bcrypt, JWT, and Multer.
• Database: Uses MySQL for data persistence.
• Management Panel: An intuitive interface for back-end management.
• Comment System: User interaction implemented with PHP, Bootstrap, and jQuery.

Installation Guide: 😘

Prerequisites:

Before proceeding, ensure that PHP, Python, and Node.js environments, along with the .env configuration, are correctly set up.

admin/.env file needs to be configured with database information.

VUE_APP_API_URL=http://localhost:3000 // admin backend address
VUE_APP_API_URL_BACKEND=http://localhost:4000 // backend address
DB_HOST=localhost // database address
DB_USER=root // database username
DB_PASSWORD=root // database password
DB_NAME=test // database name
PORT=3000 // port

backend/.env file needs to be configured with database information.

JWT_SECRET=your_secret_key_here // JWT secret key

Installation Steps:

1. Clone the repo git clone https://github.com/github_username/repo_name.git

2. After installing cnpm, simply run the provided one-click startup script to launch the application.

Documentation:

The default administrator account is admin with a password of 123456.

Update Log (Newest to Oldest): 😁

• Emoji Enhancement: Added more emojis for users to choose from.
• Markdown Editor Upgrade: Implemented the ability to adjust the editor's height.
• Word Count Feature: Introduced a text word count feature for better content management.

Database Architecture:

Vue Notepad is designed to provide users with a friendly and efficient experience, focusing on security and performance. The application's modular architecture ensures scalability and ease of maintenance, making it an ideal choice for users who value productivity and privacy.

Contact

hllqk - @hllqkb - hllqkb@gmail.com

Project Link: https://github.com/hllqk/VueNotepad

Contributing

Contributions are what make the open source community such a wonderful place to learn, inspire, and create. Any contributions you make are greatly appreciated. If you have suggestions for improving this project, here are some step-by-step guidelines:

1. Fork the Project Use GitHub's Fork button to create a copy of the project.

2. Create Your Feature Branch

git checkout -b feature/AmazingFeature Create a new branch in your fork for development of your feature.

Commit your changes

git commit -m 'Add some AmazingFeature' Commit your changes with a clear message.

Push to the branch

git push origin feature/AmazingFeature Push your feature branch to the remote repository.

Open a Pull Request

Initiate a Pull Request through the GitHub interface from your feature branch to the main branch of the original repository.

Don't forget to star the project! Thanks for your contribution!

If you wish to propose improvements, you can also open an issue with the “enhancement” label.

Thank you again for your participation and support!