Local WebSite using ESP32

How to make a local Website using a ESP32 that you can use to expand on.

Mar 24, 2024

•

575 views

•

0 respects

•

GPL3+

Arduino User Group

Internet Of Things

Devices & Components

ESP32

Software & Tools

Arduino IDE

Project description

Code

The entire code

cpp

The entire code for ESP32 with HTML code

1// Include the WiFi and WebServer libraries
2#include <WiFi.h>
3#include <WebServer.h>
4
5// Enter your WiFi name (SSID) and password
6const char* ssid = "REPLACE_WITH_YOUR_SSID";
7const char* password = "REPLACE_WITH_YOUR_PASSWORD";
8
9// Start a WebServer on port 80
10WebServer server(80);
11
12// HTML code for the website
13// You can style it with CSS and add interactivity with JavaScript
14const char* htmlPage = R"rawliteral(
15<!DOCTYPE html>
16<html>
17<head>
18
19  <!-- Website title -->
20  <title>My ESP32 Website</title>
21
22  <!-- Favicon (the small icon beside the website title) -->
23  <link rel="icon" type="image/x-icon" href="data:image/png;base64,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">
24
25  <style>
26    /* CSS styling for the website */
27    body { font-family: Arial, sans-serif; text-align: center; padding: 20px; }
28    h1 { color: #333366; }
29    p { font-size: 1.2em; }
30  </style>
31</head>
32<body>
33
34  <!-- Main heading -->
35  <h1>Welcome to your own ESP32 website!</h1> <!-- Heading level 1: largest of 6 heading sizes -->
36
37  <!-- Paragraphs -->
38  <p>Hello, world!</p> <!-- Simple paragraph. Browsers add spacing automatically before and after paragraphs. -->
39  <p> Made by Sweden_Duck </p>
40
41  <!-- Hyperlink -->
42  <p>
43    <a href="https://www.w3schools.com/html/">Visit W3Schools.com/html for HTML tutorials to improve your website!</a>
44  </p>
45
46  
47
48</body>
49</html>
50)rawliteral";
51
52// Function to handle the root URL "/"
53void handleRoot() {
54  server.send(200, "text/html", htmlPage);
55}
56
57void setup() {
58  Serial.begin(115200);
59  
60  // Connect to WiFi
61  WiFi.begin(ssid, password);
62  Serial.print("Connecting to WiFi...");
63  
64  while (WiFi.status() != WL_CONNECTED) {
65    delay(1000);
66    Serial.print(".");
67  }
68
69  Serial.println();
70  Serial.print("Connected! IP address: ");
71  Serial.println(WiFi.localIP());
72
73  // Handle HTTP requests to "/"
74  server.on("/", handleRoot);
75
76  // Start the web server
77  server.begin();
78  Serial.println("Website started!");
79}
80
81void loop() {
82  // Listen for incoming client requests
83  server.handleClient();
84}

// Include the WiFi and WebServer libraries
#include <WiFi.h>
#include <WebServer.h>

// Enter your WiFi name (SSID) and password
const char* ssid = "REPLACE_WITH_YOUR_SSID";
const char* password = "REPLACE_WITH_YOUR_PASSWORD";

// Start a WebServer on port 80
WebServer server(80);

// HTML code for the website
// You can style it with CSS and add interactivity with JavaScript
const char* htmlPage = R"rawliteral(
<!DOCTYPE html>
<html>
<head>

  <!-- Website title -->
  <title>My ESP32 Website</title>

  <!-- Favicon (the small icon beside the website title) -->
  <link rel="icon" type="image/x-icon" href="data:image/png;base64,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">

  <style>
    /* CSS styling for the website */
    body { font-family: Arial, sans-serif; text-align: center; padding: 20px; }
    h1 { color: #333366; }
    p { font-size: 1.2em; }
  </style>
</head>
<body>

  <!-- Main heading -->
  <h1>Welcome to your own ESP32 website!</h1> <!-- Heading level 1: largest of 6 heading sizes -->

  <!-- Paragraphs -->
  <p>Hello, world!</p> <!-- Simple paragraph. Browsers add spacing automatically before and after paragraphs. -->
  <p> Made by Sweden_Duck </p>

  <!-- Hyperlink -->
  <p>
    <a href="https://www.w3schools.com/html/">Visit W3Schools.com/html for HTML tutorials to improve your website!</a>
  </p>

  

</body>
</html>
)rawliteral";

// Function to handle the root URL "/"
void handleRoot() {
  server.send(200, "text/html", htmlPage);
}

void setup() {
  Serial.begin(115200);
  
  // Connect to WiFi
  WiFi.begin(ssid, password);
  Serial.print("Connecting to WiFi...");
  
  while (WiFi.status() != WL_CONNECTED) {
    delay(1000);
    Serial.print(".");
  }

  Serial.println();
  Serial.print("Connected! IP address: ");
  Serial.println(WiFi.localIP());

  // Handle HTTP requests to "/"
  server.on("/", handleRoot);

  // Start the web server
  server.begin();
  Serial.println("Website started!");
}

void loop() {
  // Listen for incoming client requests
  server.handleClient();
}

The HTML code

markup

The HTML code

1<!DOCTYPE html>
2<html>
3<head>
4
5  <!-- Website title -->
6  <title>My ESP32 Website</title>
7
8  <!-- Favicon (the small icon beside the website title) -->
9  <link rel="icon" type="image/x-icon" href="data:image/png;base64,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">
10
11  <style>
12    /* CSS styling for the website */
13    body { font-family: Arial, sans-serif; text-align: center; padding: 20px; }
14    h1 { color: #333366; }
15    p { font-size: 1.2em; }
16  </style>
17</head>
18<body>
19
20  <!-- Main heading -->
21  <h1>Welcome to your own ESP32 website!</h1> <!-- Heading level 1: largest of 6 heading sizes -->
22
23  <!-- Paragraphs -->
24  <p>Hello, world!</p> <!-- Simple paragraph. Browsers add spacing automatically before and after paragraphs. -->
25  <p> Made by Sweden_Duck </p>
26
27  <!-- Hyperlink -->
28  <p>
29    <a href="https://www.w3schools.com/html/">Visit W3Schools.com/html for HTML tutorials to improve your website!</a>
30  </p>
31
32  
33
34</body>
35</html>

<!DOCTYPE html>
<html>
<head>

  <!-- Website title -->
  <title>My ESP32 Website</title>

  <!-- Favicon (the small icon beside the website title) -->
  <link rel="icon" type="image/x-icon" href="data:image/png;base64,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">

  <style>
    /* CSS styling for the website */
    body { font-family: Arial, sans-serif; text-align: center; padding: 20px; }
    h1 { color: #333366; }
    p { font-size: 1.2em; }
  </style>
</head>
<body>

  <!-- Main heading -->
  <h1>Welcome to your own ESP32 website!</h1> <!-- Heading level 1: largest of 6 heading sizes -->

  <!-- Paragraphs -->
  <p>Hello, world!</p> <!-- Simple paragraph. Browsers add spacing automatically before and after paragraphs. -->
  <p> Made by Sweden_Duck </p>

  <!-- Hyperlink -->
  <p>
    <a href="https://www.w3schools.com/html/">Visit W3Schools.com/html for HTML tutorials to improve your website!</a>
  </p>

  

</body>
</html>

Downloadable files

Website

Skärmbild 2026-01-01 165033.png

Website title and favicon

Skärmbild 2026-01-01 165121.png

Comments

Only logged in users can leave comments

sweden_duck

0 Followers

•

0 Projects

Intro

Trademarks & CopyrightsWhistleblowingDigital Services ActTerms of ServicePrivacy PolicySecurityCookie Settings

Report content