Serve static HTML and update index.html

giaongo · giaongo · commit 7b1a7988da59 · 2025-09-10T15:16:26.000+03:00
diff --git a/src/index.html b/src/index.html
@@ -0,0 +1,111 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>Node.js</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <style>
+      * {
+        font-family: sans-serif;
+        font-size: 16px;
+      }
+
+      html,
+      body {
+        margin: 0;
+        min-height: 100vh;
+        background: #202328;
+        color: #fff;
+      }
+
+      body {
+        display: flex;
+        flex-direction: column;
+        gap: 8px;
+        padding: 32px;
+        align-items: center;
+        justify-content: center;
+        box-sizing: border-box;
+      }
+
+      h1 {
+        font-size: 24px;
+      }
+
+      p,
+      form,
+      hr {
+        max-width: min(400px, 100%);
+      }
+
+      p {
+        text-align: center;
+        opacity: 0.8;
+        line-height: 1.5;
+      }
+
+      button,
+      .button {
+        padding: 10px 18px;
+        align-self: center;
+        text-decoration: none;
+        background: #6650fa;
+        border-radius: 64px;
+        border: none;
+        color: #fff;
+        cursor: pointer;
+      }
+
+      a {
+        font-size: inherit;
+        color: inherit;
+      }
+
+      hr {
+        display: block;
+        margin: 32px 0;
+        width: 100%;
+        height: 2px;
+        background: #31363f;
+        border: none;
+      }
+
+      a:last-child {
+        margin-top: 32px;
+      }
+
+      code {
+        font-family: monospace;
+        font-size: 14px;
+        background: #31363f;
+        padding: 2px 4px;
+        border-radius: 4px;
+      }
+    </style>
+  </head>
+  <body>
+    <img
+      alt="Node.js logo"
+      src="https://github.com/diploi/component-nodejs/raw/main/.diploi/icon.svg"
+      width="64"
+      height="64"
+    />
+
+    <h1>Node.js</h1>
+
+    <p>
+      Your Node.js application is up and running! You can start editing the code
+      to build your backend API. In development stage, Node.js will
+      automatically reload as you make changes.
+      <br /><br />
+      <b> Install dependencies: </b><br />
+      Please use <code>npm i package_name</code> to add NPM packages to your
+      environment.
+    </p>
+
+    <hr />
+
+    <a href="https://diploi.com/"
+      ><img width="54" height="16" src="https://diploi.com/logo-white.svg"
+    /></a>
+  </body>
+</html>
diff --git a/src/index.mjs b/src/index.mjs
@@ -1,8 +1,18 @@
-import { createServer } from 'node:http';
+import { createServer } from "node:http";
+import { readFile } from "node:fs";
+import { join } from "node:path";
 
 const server = createServer((req, res) => {
-  res.writeHead(200, { 'Content-Type': 'text/plain' });
-  res.end('Hello World!\n');
+  const filePath = join(process.cwd(), "src", "index.html");
+  readFile(filePath, (err, data) => {
+    if (err) {
+      res.writeHead(500, { "Content-Type": "text/plain" });
+      res.end("Error loading HTML file");
+      return;
+    }
+    res.writeHead(200, { "Content-Type": "text/html" });
+    res.end(data);
+  });
 });
 
 const port = process.env.PORT;
