Some of you might be wondering how to go about developing a frontend from within your coder projects... 🔍❓

Fortunately we've now got a quick and easy way to do that!

TLDR

Any port that you are hosting something on inside your coder will be accessible by the path

https://<your-project-id>.coder.h4s.io/proxy/<port-number>

Node.js Hello World

To walk you through now to get going with this we'll write a quick Hello World for Node.js

Step 1: Create the project

Head over to coder.h4s.io and create a new Node.js project.

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/dd8c2efb-7da0-4a2e-ab7f-edae48b74b8f/Untitled.png

<aside> 🛠 Make sure to select Nodejs from the runtimes drop down

</aside>

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/5b41b853-3a59-4fee-811e-545d6ba99830/Untitled.png

Step 2: Write the code

Start by creating a file called index.js

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/56d54d74-39b2-4dec-a101-dc9fc682036b/Untitled.png

Then you can simply copy and paste this code into the file

const http = require('http');

const hostname = '127.0.0.1';
const port = 3000;

const server = http.createServer((req, res) => {
  res.statusCode = 200;
  res.setHeader('Content-Type', 'text/plain');
  res.end('Hello World');
});

server.listen(port, hostname, () => {
  console.log(`Server running at <http://$>{hostname}:${port}/`);
});