Building a Weather Dashboard with Streamlit, Plotly and Python published: true

Mary Luz Chura Ticona — Tue, 30 Jun 2026 04:17:16 +0000

Building a Weather Dashboard with Streamlit, Plotly and Python

Introduction

Data visualization is essential for understanding information quickly. In this article, I'll show you how to build an interactive Weather Dashboard using Streamlit, Plotly, and the Open-Meteo API — all for free, no API key required — and deploy it to Streamlit Cloud.

Tools Used

Streamlit — turns Python scripts into interactive web apps
Plotly — creates beautiful interactive charts
Open-Meteo API — free real-time weather data
Streamlit Cloud — free cloud deployment

The Code

import streamlit as st
import plotly.express as px
import pandas as pd
import httpx

st.set_page_config(page_title="Weather Dashboard", page_icon="🌤️", layout="wide")
st.title("🌤️ Weather Dashboard")
st.markdown("Real-time weather data using Open-Meteo API")

cities = {
    "Lima": (-12.0464, -77.0428),
    "New York": (40.7128, -74.0060),
    "London": (51.5074, -0.1278),
    "Tokyo": (35.6762, 139.6503),
    "Paris": (48.8566, 2.3522)
}

selected_cities = st.multiselect("Select cities", list(cities.keys()), default=["Lima", "New York", "London"])

if selected_cities:
    data = []
    for city in selected_cities:
        lat, lon = cities[city]
        url = (
            f"https://api.open-meteo.com/v1/forecast"
            f"?latitude={lat}&longitude={lon}"
            f"&current=temperature_2m,wind_speed_10m,relative_humidity_2m"
            f"&timezone=auto"
        )
        response = httpx.get(url).json()
        current = response["current"]
        data.append({
            "City": city,
            "Temperature (°C)": current["temperature_2m"],
            "Wind Speed (km/h)": current["wind_speed_10m"],
            "Humidity (%)": current["relative_humidity_2m"]
        })

    df = pd.DataFrame(data)

    col1, col2, col3 = st.columns(3)
    for i, row in df.iterrows():
        col = [col1, col2, col3][i % 3]
        col.metric(row["City"], f"{row['Temperature (°C)']}°C", f"Humidity: {row['Humidity (%)']}%")

    st.subheader("Temperature Comparison")
    fig1 = px.bar(df, x="City", y="Temperature (°C)", color="City", title="Temperature by City")
    st.plotly_chart(fig1, use_container_width=True)

    st.subheader("Wind Speed Comparison")
    fig2 = px.bar(df, x="City", y="Wind Speed (km/h)", color="City", title="Wind Speed by City")
    st.plotly_chart(fig2, use_container_width=True)

    st.subheader("Data Table")
    st.dataframe(df, use_container_width=True)

Installation

pip install streamlit plotly pandas httpx
streamlit run app.py

Live Demo

Check out the deployed app here:
Weather Dashboard

Repository

Full source code on GitHub:
streamlit-weather-dashboard

Conclusion

Streamlit and Plotly make it incredibly easy to build and deploy interactive dashboards with Python. In just a few lines of code, we created a real-time weather visualization app available to anyone on the web.

Building a Weather MCP Server with Python

Mary Luz Chura Ticona — Tue, 30 Jun 2026 03:34:00 +0000

Building a Weather MCP Server with Python

Introduction

The Model Context Protocol (MCP) is an open standard that allows AI models like Claude to connect with external tools and data sources. In this article, I'll show you how to build a Weather MCP Server using Python that any MCP client can use.

What We'll Build

A simple MCP Server with one tool: get_weather — it receives a city name and returns current temperature, wind speed, and humidity using the Open-Meteo API (free, no API key required).

Requirements

Python 3.12+
mcp[cli]
httpx

Installation

pip install "mcp[cli]" httpx

The Code

from mcp.server.fastmcp import FastMCP
import httpx

mcp = FastMCP("Weather MCP Server")

@mcp.tool()
async def get_weather(city: str) -> str:
    """Get current weather for a city."""

    geo_url = f"https://geocoding-api.open-meteo.com/v1/search?name={city}&count=1"
    async with httpx.AsyncClient() as client:
        geo_data = (await client.get(geo_url)).json()

    if not geo_data.get("results"):
        return f"City '{city}' not found."

    r = geo_data["results"][0]
    lat, lon = r["latitude"], r["longitude"]

    weather_url = (
        f"https://api.open-meteo.com/v1/forecast"
        f"?latitude={lat}&longitude={lon}"
        f"&current=temperature_2m,wind_speed_10m,relative_humidity_2m"
        f"&timezone=auto"
    )
    async with httpx.AsyncClient() as client:
        current = (await client.get(weather_url)).json()["current"]

    return (
        f"Weather in {r['name']}, {r['country']}:\n"
        f"Temperature: {current['temperature_2m']}°C\n"
        f"Wind Speed: {current['wind_speed_10m']} km/h\n"
        f"Humidity: {current['relative_humidity_2m']}%"
    )

if __name__ == "__main__":
    mcp.run()

Testing with MCP Inspector

Run the development server:

mcp dev server.py

This opens the MCP Inspector in your browser where you can test the get_weather tool with any city name.

Result

When tested with "Lima", the server returned:

Temperature: 19.0°C
Wind Speed: 12.2 km/h
Humidity: 81%

Repository

The full source code is available on GitHub:
weather-mcp-server

Conclusion

MCP makes it easy to extend AI capabilities with real-world data. With just a few lines of Python, we built a working weather tool that any MCP client like Claude or VSCode can use.

DEV Community: Mary Luz Chura Ticona

Building a Weather Dashboard with Streamlit, Plotly and Python published: true

Building a Weather Dashboard with Streamlit, Plotly and Python

Introduction

Tools Used

The Code

Installation

Live Demo

Repository

Conclusion

Building a Weather MCP Server with Python

Building a Weather MCP Server with Python

Introduction

What We'll Build

Requirements

Installation

The Code

Testing with MCP Inspector

Result

Repository

Conclusion