RajivCodeLabRajiv Sharma
Published © GPL3+

How to Build Your Own Web Server on Raspberry Pi Pico W

In this step-by-step guide, I’ll walk you through the process of setting up a web server on a Raspberry Pi Pico W using Phew library

IntermediateProtip2 hours876
How to Build Your Own Web Server on Raspberry Pi Pico W

Things used in this project

Hardware components

Raspberry Pi Pico W
Raspberry Pi Pico W
×1
Micro-USB to USB Cable (Generic)
Micro-USB to USB Cable (Generic)
×1

Software apps and online services

Thonny IDE

Story

Read more

Code

HTML UI File (index.html)

HTML
<!doctype html>
<html lang="en">
    <head>
        <title>Raspberry Pi Pico Web Server</title>
        <!-- Required meta tags -->
        <meta charset="utf-8" />
        <meta
            name="viewport"
            content="width=device-width, initial-scale=1, shrink-to-fit=no"
        />

        <!-- Bootstrap CSS v5.2.1 -->
        <link
            href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css"
            rel="stylesheet"
            integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN"
            crossorigin="anonymous"
        />
    </head>

    <body>
        <header>
            <nav
                class="navbar navbar-expand-sm navbar-dark bg-success"
            >
                <a class="navbar-brand" href="#">&nbsp; Pi Pico Web Server</a>
                 
                
            </nav>
            
        </header>
        <main class="container">
            <div class="d-grid gap-3 p-5">
                <a
                    href="/on"
                    class="btn btn-danger"
                >
                    LED ON
            </a>
                <a
                    href="/off"
                    class="btn btn-success"
                >
                   LED OFF
        </a>
            </div>
            
        </main>
        <footer>
            <!-- place footer here -->
        </footer>
        <!-- Bootstrap JavaScript Libraries -->
        <script
            src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
            integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r"
            crossorigin="anonymous"
        ></script>

        <script
            src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.min.js"
            integrity="sha384-BBtl+eGJRgqQAUMxJ7pMwbEyER4l1g+O15P+16Ep7Q9Q+zqX6gSbd85u4mG4QzX+"
            crossorigin="anonymous"
        ></script>
    </body>
</html>

Python code for running the server (server.py)

Python
from phew import server, connect_to_wifi
import machine

ip = connect_to_wifi("Airtel_RAJEEV","00351553")

print(ip)

page = open("index.html","r")
html= page.read()
page.close()

led = machine.Pin("LED", machine.Pin.OUT)

@server.route("/", methods=["GET"])
def home(request):
    return str(html)

@server.route("/<command>", methods=["GET"])
def command(request, command):
    if command == "on":
        led.on()
    elif command == "off":
        led.off()
    return str(html)

@server.catchall()
def catchall(request):
    return "Page not found", 404

server.run()

Credits

RajivCodeLab

RajivCodeLab

6 projects • 4 followers
Creates YT videos on DIY IoT Projects: Raspberry Pi Pico, Raspberry Pi Zero, Arduino, ESP32,
Rajiv Sharma

Rajiv Sharma

17 projects • 71 followers
Having more than 10 years of experience in IoT and software technology. Founded IoTBoys to share knowledge with IoT enthusiasts.

Comments