By default, browser disallow website A (eg. http://localhost:5000) to access data (eg. call REST API) from website B (eg. http://localhost). This is called SOP (Same Origin Policy). If we want to allow this, website B needs to enable CORS (Cross-Origin Resource Sharing).

We can, however, use <img> tags with sources from another website by default, it is called embedding.

SOP is used so that when you’re logged in to your bank account, which leaves a cookie, while at the same time opening a malicious website, this malicious website will not be able to send request to the bank. If there is no SOP, the malicious website can send request through your browser pretending that it is you since your browser has your cookie.

When you do curl to the bank website, it won’t be blocked by SOP since it’s directly between you and the bank website.

Ref:

• Stackoverflow brief explanation
• More in depth explanation and code examples

It’s difficult to decide on which system is of a better use for a particular case, nevertheless, just a simple note of comparison of using Firebase (Hosting as well as Realtime Database) vs the traditional web server served in AWS EC2.

Firebase

• Pro: Fast to host a proof of concept or MVP, user authentication function is also already integrated, easy to setup
• Con: Hard to migrate to other system, you’re basically stuck with Firebase

EC2

• Pro: Easy to manage and scale
• Con: Takes time to set up

Apparently, Python Flask is also usable for production (eg. Pinterest).

To read: NGINX

I have not fully understood this, I will just detail out what I did. I used AWS AMI (version 1) and Apache (httpd). There are 2 things that I set up using SSL certificates:

1. HTTPS: Setting up Certificate for HTTPS connection. This certificate used for encryption that can be confirmed by clicking the lock button at the address bar of the web browser. By having https, data transfers between server and client are encrypted. The certificate
2. Client certificate: Securing the connection by enforcing the use of a client certificate to connect to a server.

Setting up a web server in AWS

I used AWS EC2, which is a Linux machine where you can ssh into. The OS image that I used was AWS AMI (version 1). Just like a normal Linux machine, we can set up a web server using Apache, which I won’t detail out here.

HTTPS

You can either make a self-signed certificate, buy one, or get a free one from place such as Let’s Encrypt. I used the last option and since certificates expire after certain time, a lot of people uses Certbot to do the automatic registration to Let’s Encrypt.

Steps:

1. Set up Apache config to serve the web at port 80. Edit the file /etc/httpd/conf.d/my-server.conf. This settings used Apache version

    <VirtualHost *:80>
        ServerName example.com
   
        DocumentRoot /var/www/public
   
        DirectoryIndex index.php index.html
   
        <Directory /var/www/public/>
            Options FollowSymLinks
            AllowOverride All
   
            Require all granted
        </Directory>
   
        ErrorLog /var/log/httpd/my-server-error.log
   
        LogLevel warn
   
        SSLCertificateFile /etc/letsencrypt/live/example.com/fullchain.pem
        SSLCertificateKeyFile /etc/letsencrypt/live/example.com/privkey.pem
        Include /etc/letsencrypt/options-ssl-apache.conf
    </VirtualHost>
   

   Rename other conf such as ssl.conf and userdir.conf to an extension other than .conf so that it doesn’t conflict with our config.

2. Run Certbot. (For AWS AMI, I referred to the instruction for Cent OS 6)What you need to make sure is the Common Name has to be the same as the URL it is going to launch at (what is set as the server name at the Apache config file).

3. Set up Apache config to serve the web at port 443 and redirect port 80 to port 443

    Listen 443
    <VirtualHost *:443>
        ServerName example.com
        DocumentRoot /var/www/public
   
        SSLEngine on
   
        SSLCACertificateFile /etc/pki/CA-example/ca.pem
        SSLVerifyClient require
        SSLVerifyDepth 1
   
        DirectoryIndex index.php index.html
   
        <Directory /var/www/public/>
            SSLRequire %{SSL_CLIENT_S_DN_CN} in {"example.com"}
   
            Options FollowSymLinks
            AllowOverride All
   
            Require all granted
        </Directory>
   
        ErrorLog /var/log/httpd/my-server-error.log
   
        LogLevel warn
   
        SSLCertificateFile /etc/letsencrypt/live/example.com/fullchain.pem
        SSLCertificateKeyFile /etc/letsencrypt/live/example.com/privkey.pem
        Include /etc/letsencrypt/options-ssl-apache.conf
    </VirtualHost>
   
    <VirtualHost *:80>
      RewriteEngine on
      RewriteCond %{HTTPS} off
      RewriteRule ^/(.*)$ https://%{HTTP_HOST}/$1 [R=301,L]
    </VirtualHost>
   

To write in the next part

• DNS for subdomain
• Client certificate
  • Server CA
  • Client certificate

I’ve been using org-mode to manually make various reports for ledger. Few years ago I ledger-web to display the reports in browser from local machine, but I think I couldn’t quite customize it at that time.

I was looking for something done using flask since I work with it a lot recently so I’m familiar with it. Also, something that directly uses ledger command would be better instead of saving the data to another format/database. I found ledger-dashboard and I find it easy to customize. I added months view and changed some of the dashboard view.

Next step, I want to add graphs! And maybe a more customizable board elements with simple settings like register/balance, title of the element, and the pattern.

I want to be able to track how my expenses matches my budget. And to do that, as other people also recommended, I used a feature in ledger called virtual postings and automated transactions.

Budgeting

I add a budget for every week

2019/10/01 Budget
    [Budget:Yarikuri]                      JPY 6,000
    [Equity:Budget]

2019/10/07 Budget
    [Budget:Yarikuri]                      JPY 7,000
    [Equity:Budget]

Automated transactions

Then these will auto deduct from my budget. By using Unbudgeted as suggested here, I can track expenses outside of my budget

= /Expenses/
    [Budget:Unbudgeted]  -1.0
    [Equity:Budget]  1.0

= /Expenses:Control:Food/
    [Budget:Yarikuri]  -1.0
    [Budget:Unbudgeted]  1.0

= /Expenses:Control:House/
    [Budget:Yarikuri]  -1.0
    [Budget:Unbudgeted]  1.0

Paying with points

The problem I had was that I don’t want payments with points counted towards decreasing my budget but I still want to see the total expenses. I’ve been calculating manually so far (doh!). I manage this by adding back the budget for every payment I made with points

2019/10/01 Supermarket
    Expenses:Control:Food  JPY 100
    Income:Point  JPY -100
    [Budget:Yarikuri]  JPY 100
    [Equity:Budget]  JPY -100

Reporting

So I can have reports on how much I’ve used my budget so far by:

ledger bal ^Budget and not payee Budget

And get the remaining budget I have by:

ledger bal ^Budget

Also the total budget that I have as:

ledger reg ^Budget and payee Budget --start-of-week monday -W