fstasi / fstasi.github.io

Hi, I'm Francesco!

A software engineer from Italy 🇮🇹.

• 🐶 Senior software engineer at Datadog
• 👨‍💻 I love Frontend, TypeScript, and building experiments

🦉 A little more about me

• Pronouns: he/his
• Coding with: JS, TS, HTML, CSS, ...
• Tools: React, Storybook, Jest, RTL, Docker, CIs, ...
• Hobbies: Hiking, photography, cooking

📫 Get in Touch

Feel free to reach out to me if you have any questions, ideas, or just want to connect. You can find me on LinkedIn.

Thanks for stopping by and happy coding! ✨👨‍💻✨

fstasi.github.io's Issues

How I used cloudflare tunnel to serve my self-hosted media server

Background

• I have a dockerized self-hosted media server (will talk about it in a separate post)
• every docker container has its own ports
• previously I used to reverse proxy the services, placing an ngnix container in front. But this has some major issues:
  • need to open port 80 in my router
  • more attack surface (nginx)
  • some ISPs do not allow opening port 80
  • some ISPs don't have static IPs, requiring an additional mechanism to dynamically update the DNS as the io change (such as dd-clienr)
  • some Italian ISPs run in a subnet, making the server virtually impossible to reach

cloudflare tunnel (cloudflared) to the rescue

Cloudflare tunnel (namely argo tunnel) is effectively a VPN between all the machines it runs on and the cloudlfare network.
It fixes all the above creating a tunnel to the cloudflare network.
Also hides my server IP, as users connect to the cloudflare network that internally routes the traffic to my local server.

Experiment with react 18 Suspense + lazy loading + pre-fetching

Reference: https://stackoverflow.com/questions/58687397/react-lazy-and-prefetching-components

How vscode Devcontainers made writing this post a joyful experience

Explain how vscode devcontainers can be used to work with GitHub pages & Jekyll.

background

• I need to run bundle update but I don't have the full ruby env
• I'd like to preview changes locally

how

• Microsoft vscode dev containers has an extremely pleasant Dev experience, as it creates the whole Jekyll configuration automatically
• once the container is up and running I can run shell commands (bundle update) in the vscode integrated terminal
• I can run build task
• I can run serve task that also creates a port forwarding from my host system to the Jekyll container. Navigating to localhost:4000 in my browsers allows me to see my blog with the live changes

Why I choose to stick with Jeckyll

GitHub pages natively supports Jekyll as a statice site generator.

When it comes to generate a static site out of .MD files compelling alternatives exist, such as Hugo and Gatsby, but I decided not to change the technology I use to write this blog.

In fact I see some advantages in the GitHub pages + Jeckyll combo that for my use case outweigh the cons:

• I don't have to manage the build/deploy pipeline
• It allowed me to experiment with Visual studio containers
• technology gain in marginal (reference to Peopleware book)