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

If there are no separate 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 also work with slight command modifications according to the process.

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#

This web notepad was a major driving force for me during the early days of 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 channel to transfer text and URLs between the two.

Cloud storage was too heavy, WeChat required verification, and while Telegram 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, focusing on text recording.

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

Usage Instructions:

Visit the webpage: https://forward.vfly.app/index.php
It will randomly assign an address composed of 5 characters, such as https://forward.vfly.app/5b79m. If you want to specify an address, just manually modify it while accessing, like https://forward.vfly.app/this_is_a_path. Below, we will use 5b79m as an example.
Edit the text above
Wait a moment (a few seconds, depending on latency), and the server will store the webpage content in a file named 5b79m.
Close the webpage; if you close it too quickly, it may not save, resulting in lost edits.
Access the same URL on other platforms to cut the content ٩۹(๑•̀ω•́ ๑)۶

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

When remotely controlling other computers, use this to send commands first, then use it on the target computer, which is very convenient and adaptable. The same applies between 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 fully, to create a working directory and open 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 (after completion, 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 an 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

Access http://YOUR_IP_or_Domain/ to verify if Apache is working properly; 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'

Access 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 while 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 user www-data 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 the virtual host
sudo systemctl reload apache2   # Restart Apache2 to take effect

Now it can be used; access it in the browser: http://YOUR_Domain/index.php.

SSL#

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

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

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

Switch certificate issuing authority

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

Issue the certificate (change domain)

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

Install the certificate (change 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 automatic upgrades

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, ssl
sudo a2ensite ssl-webnote.conf   # Enable the virtual host
sudo systemctl reload apache2   # Restart Apache2 to take effect

Now it can be used; access it in 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 authentication 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 this path
# Require valid-user

Then create the file

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

Then add an account (remember to change 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 good project, simple, although it hasn't been updated, but the functionality is basically complete.

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

Hasty Paste#

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

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

Original link: https://blog.vfly2.com/2023/08/a-minimalist-web-notepad-used-for-two-years/
Copyright statement: All articles on 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 find my article helpful, feel free to subscribe using RSS and leave comments or corrections.