Open Dev Kit Documentation :: Demo - HTTP Server

Basic demonstration of an HTTP server that responds with basic HTML.

How it Works

This template demonstrates the use of Open Dev Kit's capability to start and host a server, which listens on localhost at port 80 via the TCP protocol. It showcases adding new client connections to an Array, processing incoming data, updating the Response Message Textbox, and sending an HTML response. The Start function initializes the server, and the Tick function handles active connections, including HTTP header processing and response generation.

Establishing Connection

1. To use the demo, make sure to start the server by running the project.
2. Connect to the server by openning a web browser and and navigating to either 127.0.0.1 or localhost on the URL bar.
3. You can view the response via the message entered in the Response Message Textbox, which will be displayed in the browser.

Example of a Richer Response

Below is an HTML example of a basic but more fleshed out webpage, populated with checkboxes, radioboxes, a textbox and a clickable button. It even includes some CSS styling that can be found at the bottom part of the code. To view this, simply copy the entire code block below and paste it on the Reponse Message box. Then refresh the webpage and it should be there.

<title>Open Dev Kit - HTTPS Server Test</title>

<h1>Welcome to the HTTPS Server Demo hosted via <a href="https://opendevkit.com/">Open Dev Kit</a>!</h1>
<h2>Check out some cool stuff you can do below:</h2>

<div class="container">

<p>What's your favorite color?</p><input type="text" placeholder="Enter a color"/>

<p>Select your mood:</p>
<label><input type="radio" name="mood" value="happy"/> Happy</label>
<label><input type="radio" name="mood" value="excited"/> Excited</label>
<label><input type="radio" name="mood" value="relaxed"/> Relaxed</label>

<p>Choose activities you enjoy:</p>
<label><input type="checkbox" value="music"/> Listening to Music </label>
<label><input type="checkbox" value="reading"/> Playing Video Games </label>
<label><input type="checkbox" value="coding"/> Coding</label>

<br><br>

<button onclick="alert('Thanks for clicking me!')">Click me!</button>

<br>

<img src="https://opendevkit.com/wp-content/uploads/2023/05/Open-Dev-Kit-Banner-Blue-Discord-1.png">


<style>body{font-family:Arial,sans-serif;text-align:center;background-color:#f0f8ff;color:#333;}.container{margin-top:50px;}button{background-color:#4CAF50;color:white;padding:10px 20px;border:none;border-radius:5px;}button:hover{background-color:#45a049;}.input-box{margin:10px;}</style>

If you think anything is missing, please feel free to: submit documentation feedback on this page