Showing posts from February 3, 2024

Sign in with Google in HTMX+FastAPI

TL;DR Introduction What I Implemented Anonymous User Page Authenticated User Page HTMX with FastAPI Sign In Overview Frontend Auth Sign in with Google button The Callback Function Backend Auth Sign Out Overview Frontend Backend Switch Navbar Protecting Routes Conclusion Seeking Oppotunities TL;DR The “Sign in with Google” feature has been integrated into a sample HTMX+FastAPI web application. Either an HTML or JavaScript version of a code snippet from Google’s code generator is included in the HTML to display the button. The FastAPI backend has been configured to create a session from the JWT and set “Set-Cookie: session_id” in the header, enabling subsequent communications to maintain the login status through a session cookie. Thanks to HTMX functionality, the application page can dynamically fetch the navigation bar upon a change in login status, indicating whether the user is logged in. Introduction As an aspiring full-stack software developer, I’ve