AhFei

AhFei

简洁的写作需要勇气

Share my minimalist web notepad that I've been using for two years.

If there are no special instructions, execute the commands in the order they appear in the article's code block, one by one, to achieve the goal.
Applicable systems: Debian-based distributions, including Ubuntu and Armbian; other distributions can generally work with slight modifications to the commands.

Estimated time to complete: 10 minutes (Docker) or 25 minutes (native deployment)


You can access this instance: https://forward.vfly.app/index.php to see how it works, a publicly available web notepad.

minimalist-web-notepad#

image.png

This web notepad was a major driving force for me when I first started playing with devices two years ago. At that time, I mainly browsed information on my phone and had just transitioned to processing information on a computer, needing a simple way to transfer text and URLs between the two.

Cloud storage was too heavy, WeChat required verification, and while TG was great, after finding this notepad, everything else seemed cumbersome; this is the best tool for cross-platform text transfer.

The minimalist web notepad is a lightweight and easy-to-use notepad accessed via a browser, focused on text recording.

Github: pereorga/minimalist-web-notepad: Minimalist Web Notepad (github.com)


Usage:

  1. Visit the webpage: https://forward.vfly.app/index.php
  2. It will randomly assign an address made up of 5 characters, such as https://forward.vfly.app/5b79m. If you want to specify the address, just manually modify it when accessing, such as https://forward.vfly.app/this_is_a_path. Below, we will use 5b79m as an example.
  3. Edit the text above
  4. Wait a moment (a few seconds, depending on latency), and the server will store the webpage content in a file named 5b79m.
  5. Close the webpage; if you close it too quickly, it won't have time to save, and you will lose your edits.
  6. Access the same URL on another platform to cut the content ٩۹(๑•̀ω•́ ๑)۶

As long as you don't close too quickly and edit on two webpages simultaneously, it works well. Because it is minimalist, the project author does not consider adding unnecessary features.

webnote-in-phone_compressed.webp

When remotely controlling other computers, use this to send commands first, then use it on the target computer; it's very convenient and adaptable. The same goes for multiple phones. It can also be used for temporarily transmitting sensitive data to avoid platform scrutiny.

Install Web Notepad Using Docker#

GitHub: pereorga/minimalist-web-notepad at docker (github.com)

Copy and execute all, creating a working directory and opening the port with one command

myserve="webnote"
sudo ufw allow 8088/tcp comment $myserve && sudo ufw reload
cd ~/myserve/
wget https://github.com/pereorga/minimalist-web-notepad/archive/refs/heads/docker.zip
unzip docker.zip && mv minimalist-web-notepad-docker webnote
cd webnote

Customize according to comments, then execute to create the docker-compose.yml file with one command

cat > docker-compose.yml << EOF
---

version: "2.4"
services:
  minimalist-web-notepad:
    build: .
    container_name: webnote
    restart: always
    ports:
     - "8088:80"
    volumes:
     - ./_tmp:/var/www/html/_tmp
EOF

The previous 5b79m is stored in _tmp.

Build and start the container (once completed, you can access the webpage via http://ip_addr_or_domain:8088. Replace ip_addr_or_domain with the server's IP or domain)

docker compose up -d

The Docker version hasn't been updated for a long time; those with technical skills can refer to the native installation to create the image.

Native Installation of Web Notepad#

Using the domain http://forward.vfly.app as an example.

Install Apache2 and PHP#

sudo apt update && sudo apt upgrade && \
sudo apt install apache2
# sudo systemctl status apache2   # Check status
sudo apt install php libapache2-mod-php

Visit http://YOUR_IP_or_Domain/ to verify if Apache is working correctly; you should see the welcome page.

After installing PHP, restart Apache to load the PHP module:

sudo systemctl restart apache2

Check PHP installation:

sudo bash -c 'echo "<?php phpinfo(); ?>" > /var/www/html/phpinfo.php'

Visit http://YOUR_IP_or_Domain/phpinfo.php to verify if PHP is installed successfully.

Let me share my experience. When using the .app domain obtained for free from porkbun to resolve this service, it wouldn't open no matter what, and it always redirected to HTTPS. It took me a long time to realize that .app and .net domains seem to only support HTTPS.

Create Directory and Download Original Files#

cd /var/www/ && \
sudo git clone https://github.com/pereorga/minimalist-web-notepad.git
# Rename and assign the directory to the www-data user for read and write permissions
sudo mv minimalist-web-notepad webnote
sudo chown -R www-data:www-data /var/www/webnote

Modify $base_url = 'http://forward.vfly.app'; on the fourth line; it must be changed to the domain used for access. If you plan to add SSL later, it should also be modified to https here.

cd /var/www/webnote && sudo vim index.php

Create Virtual Host#

If you want to use https, skip this section and go directly to the next section.

Enter the available virtual host directory, copy the example configuration file, and edit it

cd /etc/apache2/sites-available   
sudo cp 000-default.conf web-notepad.conf
sudo vim web-notepad.conf

Ensure the following two lines are present, and remember to modify the domain and directory.

        ServerAdmin <your email>
        ServerName forward.vfly.app
        DocumentRoot /var/www/webnote

Also, add the following part

<Directory /var/www/webnote>
                Options Indexes FollowSymLinks MultiViews
                AllowOverride All
                Order allow,deny
                allow from all
</Directory>

Enable the virtual host

sudo a2enmod rewrite   # Enable mod_rewrite
sudo a2ensite web-notepad.conf   # Enable virtual host
sudo systemctl reload apache2   # Restart apache2 to take effect

You can now use it; access it via the browser: http://YOUR_Domain/index.php.

SSL#

When applying for a certificate, use root: sudo -i. Remember to modify the domain during actual deployment.

Install and enable the acme.sh script (/home/skf/.acme.sh/acme.sh) (change the email)

apt install -y curl && curl https://get.acme.sh | sh -s [email protected] && cd ~ && source .bashrc

Switch the certificate issuing authority

acme.sh --set-default-ca --server letsencrypt

Issue the certificate (change the domain)

acme.sh  --issue -d forward.vfly.app --apache

Install the certificate (change the domain)

acme.sh --install-cert -d forward.vfly.app \
--cert-file      /etc/ssl/certs/forward.vfly.app.cer \
--key-file       /etc/ssl/private/forward.vfly.app.key

Enable acme.sh auto-upgrade

acme.sh  --upgrade  --auto-upgrade

You can exit the root user now.

Enter the available virtual host directory, copy another default one, and edit it

cd /etc/apache2/sites-available   
sudo cp default-ssl.conf ssl-webnote.conf
sudo vim ssl-webnote.conf

Ensure the following two lines are present, and remember to modify the domain and directory.

        ServerAdmin <your email>
        ServerName forward.vfly.app
        DocumentRoot /var/www/webnote

Also, add the following part

<Directory /var/www/webnote>
                Options Indexes FollowSymLinks MultiViews
                AllowOverride All
                Order allow,deny
                allow from all
</Directory>

And edit the certificate location

          SSLCertificateFile  /etc/ssl/certs/forward.vfly.app.cer
          SSLCertificateKeyFile /etc/ssl/private/forward.vfly.app.key

Enable the virtual host

sudo a2enmod rewrite ssl   # Enable mod_rewrite and ssl
sudo a2ensite ssl-webnote.conf   # Enable virtual host
sudo systemctl reload apache2   # Restart apache2 to take effect

You can now use it; access it via the browser: https://YOUR_Domain/index.php.

If the text box appears very small, it means that $base_url has not been changed from http to https.

Migration#

All data is in /var/www/webnote/_tmp. To redeploy on a new machine, simply copy this directory to the new machine.

Others#

If you want to enable authenticated access. Edit the .htaccess file in the website root directory and uncomment the last four lines.

cd /var/www/webnote && sudo vim .htaccess

Uncomment these four lines

# AuthType basic
# AuthName "website.name"
# AuthUserFile "/var/www/webnote/update-path-to.htpasswd"   # Customize the path here
# Require valid-user

Then create the file

sudo touch /var/www/webnote/update-path-to.htpasswd

Then add an account (remember to change the username; it will prompt for a password)

sudo htpasswd -c /var/www/webnote/update-path-to.htpasswd username

To add a second one, do not use -c, or it will overwrite the first.

Other Similar Projects#

Browser Sticky Notes#

A very nice project, simple, although it hasn't been updated, the functionality is basically complete.

GitHub: jonathontoon/manifest: An instant grid-based pinboard for note taking in your browser. (github.com)

image.png

Hasty Paste#

A text paste tool that looks good, with highlighting, suitable for sharing code.

GitHub: enchant97/hasty-paste: A fast and minimal paste bin. (github.com)

image


Original link: https://blog.vfly2.com/2023/08/a-minimalist-web-notepad-used-for-two-years/
Copyright statement: All articles in this blog are licensed under CC BY-NC-SA 4.0 unless otherwise stated. Please indicate the source when reprinting 承飞之咎 (blog.vfly2.com) .

If you think my article is helpful, feel free to subscribe using RSS and leave comments for corrections.

Loading...
Ownership of this post data is guaranteed by blockchain and smart contracts to the creator alone.