How to stream ChatGPT output from python backend to react frontend

Streaming chatGPT API response to react frontend. GIF depicts actual speed

ChatGPT is great, no question. But when I tried using the API, I found the speed of the response lacking.

When using OpenAIs web frontend I saw that the answer is appearing word for word.

I thought: »I might be able to stream the chatGPT api response in realtime. This way the user has immediate feedback without needing to wait for 20 seconds«.

And - lo and behold - this is possible!

What we’re building today:

  1. Call ChatGPT API
  2. Stream the data with SocketIO from python (flask)
  3. Receive the data in react using SocketIO and display it bit as bit in realtime

How to use firebase to authenticate next.js/react against flask backend

What you'll have at the end of this howto

I’m migrating my frontend away from Flask to next.js, reducing my flask app to only backend apis.

This blogpost explains how a next.js app authenticates against flask backend using flask-login.

It assumes that you have in your flask backend:

  • an endpoint auth/sign-in which…
    • accepts a POST request with the firebase idToken
    • checks the token against firebase
    • when successful, logs it in with flask_login’s login_user
  • your api routes secured with @login_required

How to use Brightdata with scrapy

Brightdatas Proxy Manager (click to see full res)

With weegee.ch I run a handful crawlers. At the beginning I didn’t have problems with crawling protection but over time my little project got more successful (I’m on the first page of Google for the relevant search queries since a few weeks) so I see more and more websites blocking me.

I went for Brightdata as they offer a good “pay as you use” model which works well for smaller sites like mine (and don’t require to pay a minimal price per month).

I couldn’t find a documentation which covers the whole install process, that’s why I’m writing this post.

Launching weegee.ch - my first side project

During the past few months I’ve been busy creating my first side project. This week, I’ve reached a milestone - both Web and mobile apps are now available, may I present to you:

weegee.ch - the biggest shared flat search in Switzerland. In Switzerland, shared flats are called WGs (for WohnGemeinschaft), pronounced “weegee”, that’s where the domain name comes from.

It’s available for web, iOS and android.

The data is coming from crawling shared flats from wgzimmer, flatfox, urbanhome, ronorp and tutti - creating a shared flat search which is twice as big as any of the other portals!

How to install matomo for nginx on amazon linux 2

Matomo is a replacement for google analytics which is free when you self-host it. Honestly, I underestimated the effort it takes. Turns out it needs php, mysql and fastcgi running, since I’m running a python/postgres stack it adds quite a bit of clutter onto the server…

But anyway: here you are, the following guide installs Matomo with…

  • php8
  • mysql 8.0
  • nginx / letsencrypt
  • php-fpm (fastcgi)

How to install and use hashicorp vault as secrets manager - the quick'n'easy way

I wanted to get rid of AWS secrets manager - both because it was eating 7% of my hosting costs (2.42$ per month, but still :) and I wanted to get a bit more independent of AWS.

The number one alternative is Hashicorp Vault. From the same company who built Terraform, Consul and Vagrant.

The learning curve is not steep - I followed their excellent getting started guide. But if you want to have it even quicker, then use this guide.

For this how-to I chose:

  • Amazon linux ec2 instance
  • S3 as storage backend for
  • Nginx for ssl proxy
  • Python client

Exchanging any of those is a piece of cake really… but in order to keep this document brief I’ll stick to this choice.

How to authenticate flutter app against flask backend (using Firebase)

Flutter meets Flask meets Firebase

Over the past 2 weeks I struggled quite a bit to come up with a setup to make my flutter app work together with my flask web app. There’s not much documentation online, I’m wondering if I’m the only one with that setup. I doubt that, as Flutters web capabilities are still somehow limited and you’d normally want to have a “full blown” flask web app alongside your flutter app.

What I wanted is to have a login possibility with social login providers (Google, Facebook, Apple ID, via Oauth) both on Flutter and on my Flask app and when a user uses both web and app they would use the same profile and settings.

Where I was mentally stuck was this: How do I guarantee that the OAuth identity which the flutter app would send to my flask api backend can be trusted? Every app can be decompiled, you can put a proxy in front of it or whatever other hacks the internet provides. So flask needs a mechanism to double-check what flutter just sent.

How to use Firebase Auth in Flask

Using Firebase auth in Flask is currently under-documented on the web. I spent hours scraping together the relevant information which, I hope, I can present here in a good form - in order to improve the world and achieve world peace!