Forem: Edwin Muhoro

🐳 From FastAPI to Production: The Complete Docker Guide for Python Developers

Edwin Muhoro — Wed, 25 Jun 2025 23:10:55 +0000

Ever struggled with the classic "it works on my machine" problem? Or found yourself manually killing terminals instead of gracefully shutting down your FastAPI servers? Let's dive into a complete Docker setup that will transform your development workflow and prepare you for production!

🚀 The Problem We're Solving

Picture this: You've built an amazing FastAPI recruitment portal with PostgreSQL, JWT authentication, and AI-powered features. Your code works perfectly locally, but:

Setting up the environment is complex for new team members
Database connections get messy when you kill terminals
Production deployment feels like a mystery
Environment variables are scattered everywhere
Enter Docker - your development superhero! 🦸‍♂️

# docker-compose.yml
services:
  web:                    # Your FastAPI app
    build: .
    ports:
      - "8000:8000"
    environment:
      - DATABASE_URL=${DATABASE_URL}
      - SECRET_KEY=${SECRET_KEY}
      - OPENAI_API_KEY=${OPENAI_API_KEY}
    depends_on:
      - db
    command: uvicorn main:app --host 0.0.0.0 --port 8000 --reload

  db:                     # PostgreSQL database
    image: postgres:15
    environment:
      POSTGRES_DB: ${POSTGRES_DB}
      POSTGRES_USER: ${POSTGRES_USER}
      POSTGRES_PASSWORD: ${POSTGRES_PASSWORD}
    volumes:
      - postgres_data:/var/lib/postgresql/data

volumes:
  postgres_data:          # Persistent database storage

🏗️ The Complete Docker Architecture

Here's what we're building - a multi-container application that Just Works:

🔧 The Magic Dockerfile

FROM python:3.12-slim

# Essential for Python in containers
ENV PYTHONDONTWRITEBYTECODE=1
ENV PYTHONUNBUFFERED=1

WORKDIR /app

# Install system dependencies for PostgreSQL
RUN apt-get update \
    && apt-get install -y --no-install-recommends \
        postgresql-client gcc python3-dev libpq-dev \
    && rm -rf /var/lib/apt/lists/*

# Install Python dependencies
COPY requirements.txt .
RUN pip install --no-cache-dir -r requirements.txt

COPY . .
EXPOSE 8000

CMD ["uvicorn", "main:app", "--host", "0.0.0.0", "--port", "8000"]

🔐 Security First: The Template Approach

Never commit secrets to Git! Here's the pro way to handle sensitive data:

What goes in Git:

# docker-compose.template.yml (safe to commit)
services:
  web:
    environment:
      - DATABASE_URL=${DATABASE_URL}
      - SECRET_KEY=${SECRET_KEY}
      # Template shows structure, not actual values

What stays local:

# .env (NEVER commit this)
DATABASE_URL=postgresql://user:pass@localhost/db
SECRET_KEY=super-secret-jwt-key
OPENAI_API_KEY=sk-your-actual-key

Your .gitignore:

# Ignore the real compose file with secrets
docker-compose.yml
.env
.env.*

# But allow the template
!docker-compose.template.yml
!.env.example

⚡ The Developer Experience Revolution

Before Docker:

# The painful way 😤
python3 -m venv venv
source venv/bin/activate
pip install -r requirements.txt
# Start PostgreSQL somehow...
# Set 15 environment variables...
# Kill terminal when done (bad!)

After Docker:

# The magical way ✨
docker compose up --build
# Everything just works!

# Graceful shutdown
docker compose down

🛠️ Essential Docker Commands Every Developer Needs

# Development workflow
docker compose up --build        # Start with rebuild
docker compose up -d            # Background mode
docker compose logs -f web      # Follow logs
docker compose down             # Graceful shutdown

# Database operations
docker compose exec db psql -U postgres -d recruitment_db
docker compose down -v          # Fresh start (deletes data)

# Debugging
docker compose ps               # See running services
docker compose exec web bash   # Shell into container

🚨Common Gotchas & Solutions

Permission Denied Error?

# Add yourself to docker group (one-time setup)
sudo usermod -aG docker $USER
newgrp docker
# Now docker commands work without sudo!

Database Connection Issues?

# Check if database is ready
curl http://localhost:8000/db-check
# Should return: {"database": "connected", "result": 1}

Port Already in Use?

# Find what's using port 8000
sudo lsof -i :8000
# Kill it or change ports in docker-compose.yml

🚀 Production-Ready Deployment

Transform your development setup to production:

# docker-compose.prod.yml
services:
  web:
    command: uvicorn main:app --host 0.0.0.0 --port 8000 --workers 4
    restart: unless-stopped
    # Remove --reload flag for production

  nginx:
    image: nginx:alpine
    ports:
      - "80:80"
      - "443:443"
    depends_on:
      - web
    # Load balancer + SSL termination

💡 Pro Tips for FastAPI + Docker

Graceful Shutdown: Your FastAPI app can run cleanup code:

@app.on_event("shutdown")
async def shutdown_event():
    """Cleanup database connections"""
    cleanup()

Health Checks: Always include health endpoints:

@app.get("/health")
def health_check():
    return {"status": "healthy"}

@app.get("/db-check") 
def db_check():
    # Test database connectivity
    pass

Environment-Specific Configs: Use different compose files:

# Development
docker compose up

# Production  
docker compose -f docker-compose.prod.yml up

🎯 The Bottom Line
Docker transforms your FastAPI development from chaotic to professional:

✅ Consistent environments across all machines
✅ One-command setup for new developers
✅ Graceful shutdowns preserve data integrity
✅ Production-ready deployment pipeline
✅ Secure secret management with templates
✅ Database included - no manual setup needed

🚀 Ready to Dockerize Your FastAPI App?
Start with these files in your project:

Dockerfile - Your app container
docker-compose.template.yml - Safe template for Git
.env.example - Environment variable examples
README-Docker.md - Setup instructions
Updated .gitignore - Security first!
Your future self (and your team) will thank you for the professional setup!

Understanding Session Storage, Local Storage, and Cookies in Web Development

Edwin Muhoro — Sun, 25 Aug 2024 19:59:26 +0000

In the modern web development landscape, managing client-side storage is crucial for creating efficient and interactive web applications. There are primarily three ways to handle this: session storage, local storage, and cookies. Each method comes with its unique features, advantages, and limitations. In this article, we'll deeply explore these technologies, helping beginners understand their use, differences, and the scenarios in which one might be more suitable over the others.

What is Client-Side Storage?

Client-side storage allows data to be stored on the user's browser. This data can be used to maintain session information, user preferences, or any other data that needs to be preserved across different pages of a website without having to retrieve it from the server on each page load. This can significantly enhance the performance and user experience of web applications.

Session Storage

Definition and Use: Session storage is used to store data for the duration of the page session. The data stored in session storage gets cleared when the page session ends — this occurs when the user closes the specific tab or window in which the site is opened.

Example of usage:

// Store data in session storage
sessionStorage.setItem('username', 'JohnDoe');

// Retrieve data from session storage
let userName = sessionStorage.getItem('username');

// Remove data from session storage
sessionStorage.removeItem('username');

// Clear all data from session storage
sessionStorage.clear();

Pros:

Tab-specific storage: Each open tab has its own isolated instance of session storage, making it ideal for sensitive data that shouldn’t persist beyond the session.
Security: Clears data automatically at the end of the session, reducing the risk of data leakage.

Cons:

Limited lifespan: Data does not persist on closing the tab, which can be a disadvantage if persistent data storage is required.
Storage limit: Typically allows about 5MB of data, which might be limiting for more complex applications.

Local Storage

Definition and Use: Local storage provides a way to store data across browser sessions. Data stored in local storage doesn’t expire and remains stored on the user’s browser until explicitly cleared either via scripting or manually by the user.

Example of Usage:

// Store data in local storage
localStorage.setItem('theme', 'dark');

// Retrieve data from local storage
let theme = localStorage.getItem('theme');

// Remove data from local storage
localStorage.removeItem('theme');

// Clear all data from local storage
localStorage.clear();

Pros:

Persistence: Data persists even after the browser window is closed, ideal for saving user preferences or themes.
Capacity: Typically allows for larger storage limits than session storage (at least 5MB).

Cons:

Lack of auto-expiry: Data needs to be manually managed and cleared, which can lead to potential security risks if sensitive data is stored.
Global access: Unlike session storage, local storage is accessible across all tabs and windows with the same origin.

Cookies

Definition and Use: Cookies are data that is stored on the user's computer by the web browser while browsing. Cookies are primarily used for session management, personalization, and tracking user behavior.

Example of Usage:

// Set a cookie
document.cookie = "username=JohnDoe; expires=Thu, 18 Dec 2023 12:00:00 UTC; path=/";

// Get all cookies
let cookies = document.cookie;

Pros:

Expiration control: Cookies can be set to expire after a certain date or time.
HTTP-only cookies: Can be configured to be accessible only by the web server, enhancing security.

Cons:

Size limitation: Cookies are limited to about 4KB each.
Performance impact: Every HTTP request includes cookies, which can affect performance if many cookies are used.
Security risks: If not securely handled (e.g., without setting the Secure and HttpOnly attributes), cookies can be susceptible to cross-site scripting (XSS) and cross-site request forgery (CSRF) attacks.

Which One to Use and When?

Use session storage when you need to store sensitive data that should not persist beyond the session and is only relevant to a specific window or tab.
Use local storage for data that needs to persist across sessions and is not sensitive. It is ideal for storing user preferences or settings that are non-sensitive.
Use cookies when you need server-side readability of stored data, control over expiration, and for implementing user tracking for analytics.

Conclusion

Understanding the distinctions between session storage, local storage, and cookies is crucial for implementing effective client-side storage solutions in web applications. Each method has its ideal use cases and understanding these will allow you to make informed decisions about storing user data efficiently and securely. Remember, the choice of storage mechanism can greatly impact the functionality, performance, and security of your web applications.

Building Native Applications with Capacitor and ReactJS

Edwin Muhoro — Sun, 16 Jun 2024 07:53:35 +0000

Introduction

In the ever-evolving landscape of software development, the demand for building native applications from web-based code has grown exponentially. Capacitor, a tool created by the team behind Ionic, offers developers a seamless way to create cross-platform native applications using their existing web technologies. In this article, we will explore how to incorporate Capacitor into a ReactJS project to build native mobile applications.

What is Capacitor?

Capacitor is a cross-platform native runtime that allows you to build web applications with JavaScript, TypeScript, or any front-end framework and then deploy them as native mobile apps or Progressive Web Apps (PWAs). It provides a simple and unified API to access native device features and functionalities such as the camera, geolocation, and storage.

Getting Started with Capacitor and ReactJS

To start using Capacitor with ReactJS, follow these steps:

Step 1: Set Up Your React Project
First, you need to create a new React project or navigate to your existing React project directory.

npx create-react-app my-capacitor-app
cd my-capacitor-app

This command creates a new React project named my-capacitor-app and navigates into the project directory.

Step 2: Install Capacitor
Next, you need to install Capacitor core and the CLI (Command Line Interface). Run the following command in your project directory:

npm install @capacitor/core @capacitor/cli

This command installs the core Capacitor library and the CLI, which you will use to interact with Capacitor from the command line.

Step 3: Initialize Capacitor
Initialize Capacitor with your project. This will create a capacitor.config.json file in your project directory.

npx cap init

During initialization, you will be prompted to enter your app name and package ID (e.g., com.example.myapp). The capacitor.config.json file stores configuration settings for Capacitor.

Note: It’s important to change the package ID to something unique and meaningful for your project. The package ID should follow the reverse domain name notation (e.g., com.yourcompany.yourapp). This unique identifier is necessary for publishing your app on app stores and helps to distinguish your app from others.

? What is the name of your app? My Capacitor App
? What should be the Package ID? com.yourcompany.yourapp

Step 4: Install and Add Platforms
Add the desired platforms (iOS, Android) to your project. This step prepares your project to be built and run on these platforms.
Install
npm install @capacitor/android npm install @capacitor/android

npx cap add ios
npx cap add android

This command creates the necessary folders and files for iOS and Android projects within your React project directory.

Step 5: Build Your React App
Before you can run your app on a device or emulator, you need to build your React app. This step compiles your React code into static files that can be served by Capacitor.

npm run build

This command generates a build folder containing the static files of your React application. Building the project ensures that the latest version of your app is used when syncing with the native projects.

Step 6: Sync Your Project
After building your React app, sync your web code with the native platform projects. This step copies the built web assets into the native project folders.

npx cap sync

The npx cap sync command ensures that the latest version of your web app is included in the native builds and updates any Capacitor plugins and dependencies.

Using Capacitor Plugins

Capacitor comes with a set of plugins to access native device functionalities. Here are a few examples:

Example 1: Using the Camera Plugin
Step 1: Install the Camera Plugin

npm install @capacitor/camera

Step 2: Import and Use the Camera Plugin in your react code

import React, { useState } from 'react';
import { Camera, CameraResultType } from '@capacitor/camera';

const CameraComponent = () => {
  const [photo, setPhoto] = useState(null);

  const takePhoto = async () => {
    const image = await Camera.getPhoto({
      resultType: CameraResultType.Uri,
    });
    setPhoto(image.webPath);
  };

  return (
    <div>
      <button onClick={takePhoto}>Take Photo</button>
      {photo && <img src={photo} alt="Captured" />}
    </div>
  );
};

export default CameraComponent;

Example 2: Using the Toast Plugin
Step 1: Install the Toast Plugin

npm install @capacitor/toast

Step 2: Import and Use the Toast Plugin

import React from 'react';
import { Toast } from '@capacitor/toast';

const ToastComponent = () => {
  const showToast = async () => {
    await Toast.show({
      text: 'Hello from Capacitor!',
    });
  };

  return (
    <div>
      <button onClick={showToast}>Show Toast</button>
    </div>
  );
};

export default ToastComponent;

Running the App on a Device

To run your app on a device, you need to open the native project in the respective IDEs.

iOS

npx cap open ios

This will open your iOS project in Xcode. From there, you can run the app on a simulator or a connected device.

Android

npx cap open android

This will open your Android project in Android Studio. You can then run the app on an emulator or a connected device.

Conclusion

Capacitor provides a powerful and easy-to-use platform for building native mobile applications using web technologies. By integrating Capacitor with ReactJS, you can leverage your existing web development skills to create robust, cross-platform native applications. This article covered the basics of setting up Capacitor in a React project, using plugins, and running your app on devices. With Capacitor, you can simplify your development workflow and deliver high-quality mobile experiences.

Unveiling the Strengths of .NET: Choosing .NET over Node.js

Edwin Muhoro — Thu, 25 Apr 2024 19:32:25 +0000

In the vast landscape of programming languages and frameworks, choosing the right technology stack for your project can be a daunting task. Two popular contenders in the realm of web development are .NET and Node.js. While Node.js has gained significant traction in recent years, .NET remains a robust and powerful framework with its own set of strengths and advantages. In this article, we'll delve into why choosing .NET over Node.js can be a strategic decision for developers and businesses alike.

Understanding the Basics: .NET vs. Node.js

1. Architecture and Ecosystem

.NET: .NET is a mature and versatile framework developed by Microsoft. It provides a unified platform for building various types of applications, including web applications, desktop applications, mobile apps, and more. With .NET, developers can choose from different languages such as C#, F#, and Visual Basic.NET, offering flexibility and scalability.

Node.js: Node.js, on the other hand, is a runtime environment that allows developers to run JavaScript code outside of a web browser. It is known for its event-driven, non-blocking I/O model, making it ideal for building scalable, real-time applications such as chat applications and streaming services.

2. Performance and Scalability

.NET: .NET is renowned for its performance and scalability, especially when it comes to building enterprise-level applications. The introduction of .NET Core and its successor, has further enhanced the performance and cross-platform capabilities of .NET applications. With features like Just-In-Time (JIT) compilation and efficient memory management, .NET applications can handle high loads and complex tasks with ease.

Node.js: Node.js excels in handling I/O-heavy tasks and asynchronous operations, thanks to its non-blocking architecture. This makes it a popular choice for building real-time applications that require high concurrency. However, Node.js may face challenges with CPU-bound tasks, and developers may need to employ clustering or other techniques to achieve scalability for CPU-intensive workloads.

Key Advantages of Using .NET

1. Language and Tooling

C# and Visual Studio: One of the primary advantages of .NET is the use of languages like C#, which offers strong typing, extensive libraries, and a robust ecosystem. Visual Studio, the integrated development environment (IDE) for .NET, provides powerful tools for code editing, debugging, and performance analysis, enhancing developer productivity and code quality.

2. Cross-Platform Development

.NET Core and .NET Framework: With the introduction of .NET Core and its evolution into .NET 8, .NET has become a truly cross-platform framework. Developers can build and deploy .NET applications on Windows, Linux, and macOS, leveraging the same codebase and libraries across different platforms. This versatility is crucial for modern development teams targeting multiple platforms and environments.

3. Performance and Optimization

JIT Compilation and Runtime Performance: .NET's Just-In-Time (JIT) compilation optimizes code execution at runtime, leading to improved performance compared to interpreted languages. Additionally, .NET's runtime environment includes features like garbage collection and memory management, reducing memory leaks and optimizing resource utilization.

4. Enterprise-Ready Solutions

Enterprise Support and Tooling: .NET offers comprehensive support and tooling for building enterprise-grade applications. From robust security features to integration with cloud platforms like Azure, .NET provides a solid foundation for developing scalable, reliable, and secure solutions for businesses of all sizes.

Why Choose .NET Over Node.js?

1. Scalability and Performance

While Node.js excels in handling asynchronous operations and real-time applications, .NET's performance and scalability shine in enterprise-level scenarios and CPU-bound tasks. .NET's mature ecosystem, JIT compilation, and optimized runtime make it a preferred choice for building high-performance applications.

2. Language and Development Environment

The use of languages like C# and the feature-rich Visual Studio IDE contribute to a productive and efficient development experience with .NET. Strong typing, comprehensive libraries, and advanced debugging tools empower developers to write maintainable and scalable codebases.

3. Cross-Platform Capabilities

With the evolution of .NET Core into .NET 5/6, .NET has embraced cross-platform development, allowing developers to target multiple platforms without compromising on performance or features. This flexibility is crucial for modern applications targeting diverse deployment environments.

4. Enterprise Support and Ecosystem

.NET's integration with Microsoft's ecosystem, including Azure cloud services, provides seamless deployment, monitoring, and management capabilities for enterprise applications. The robust security features and enterprise-grade tooling make .NET a preferred choice for organizations with complex requirements and regulatory compliance needs.

Conclusion

In the dynamic landscape of software development, choosing the right framework can significantly impact the success of your projects. While Node.js offers strengths in certain areas such as real-time applications and asynchronous operations, .NET stands out as a powerhouse for enterprise-grade solutions, cross-platform development, and performance-critical applications.

By leveraging the strengths of .NET, developers and businesses can benefit from a mature ecosystem, robust tooling, cross-platform capabilities, and optimized performance, ultimately leading to faster time-to-market, scalability, and long-term maintainability of applications.

Whether you are embarking on a new project or considering migration/optimization of existing applications, evaluating the specific requirements, scalability needs, and development preferences can guide you in making an informed choice between .NET and Node.js. Ultimately, both frameworks have their merits, but understanding their strengths and aligning them with your project goals is key to achieving success in today's competitive tech landscape.

Building a Full-Stack Application with AWS Amplify and ReactJS

Edwin Muhoro — Sun, 24 Mar 2024 22:30:02 +0000

Introduction

AWS Amplify is a powerful development platform that enables developers to build scalable full-stack applications. This guide will walk you through creating a ReactJS application with a backend powered by AWS Amplify.

Prerequisites

Node.js v10.x or later
npm or yarn
AWS Account

Install the Amplify CLI

The Amplify Command Line Interface (CLI) is a unified toolchain to create AWS cloud services for your app. Let's go ahead and install the Amplify CLI.
npm install -g @aws-amplify/cli

Initializing the Project

Create a new React application and initialize your Amplify project:

npx create-react-app amplify-react-app
cd amplify-react-app
npm install -g @aws-amplify/cli
amplify configure

amplify configure will prompt you to sign in and add IAM user.

Enter your desired username and press Next.

Select Attach policies directly and select AdministratorAccess-Amplify as the Permissions policy. Select Next

This is the review page. Check if everything is alright and create user.

Navigate to the just created user and click on the 'create access key button'.We'll need the key in the projects' terminal.

Select the first option,Click Next.

There we go! Use the copy icon to copy these values to your clipboard, then return to the Amplify CLI.

Setting Up Authentication

Set up authentication using Amazon Cognito:

amplify add auth
# When prompted, select the default configuration
amplify push

Adding a GraphQL API and Database

Add a GraphQL API and database using AWS AppSync and Amazon DynamoDB:

amplify add api
# Select GraphQL, provide an API name, and choose an authorization type
amplify push

Implementing the Frontend

Install necessary packages and configure the frontend to interact with the backend services:

//index.js
import Amplify from 'aws-amplify';
import awsExports from './aws-exports';
Amplify.configure(awsExports);

Interacting with the API

Use the Amplify library to interact with the GraphQL API:

import { API, graphqlOperation } from 'aws-amplify';
import { listNotes } from './graphql/queries';

async function fetchNotes() {
  try {
    const noteData = await API.graphql(graphqlOperation(listNotes));
    console.log('notes:', noteData);
  } catch (err) {
    console.log('error fetching notes', err);
  }
}

Deploying the Application

Deploy your application using the Amplify Console:

amplify add hosting
# Select a hosting service and follow the prompts
amplify publish

Conclusion

You’ve now successfully set up a full-stack application with AWS Amplify and ReactJS. This application includes user authentication and a serverless backend with a GraphQL API.