Mike Kim
Mike Kim

Reputation: 63

I wrote code exactly how the tutorial shows and it doesn't work

So I wrote all the code exactly shown(with all the correct path URLs based on my computer) tutorial from this youtube site: https://www.youtube.com/watch?v=NA21dUBfJhw&list=PL4cUxeGkcC9gcy9lrvMJ75z9maRw4byYp&index=33 (except this guy did't bother writing const http = require('http') and other stuff for localhosting so I added that on my code. Below is my code(which is the exact same as the tutorial's code + localhosting setup)

the code below is app.js

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\n');

});

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

});

var express = require('express');

var todoController = require('./todoController');

var app = express();

app.set('view engine', 'ejs');

app.use(express.static('./'));

todoController(app);

the code below is todo.ejs

<html>
      <head>
        <title>Todo List</title>
        <script
        src="https://code.jquery.com/jquery-3.4.1.min.js"
        integrity="sha256- 
        CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
        crossorigin="anonymous"></script>
        <link href="/Public/styles.css" rel="stylesheet" 
type="text/css">
      </head>
      <body>
        <div id="todo-table">
          <form>
            <input type="text" name="item" placeholder="Add new 
            item..." require />
            <button type="submit">Add Item</button>
          </form>
          <ul>
            <li>Item 1</li>
            <li>Item 2</li>
            <li>Item 3</li>
          </ul>
        </div>
      </body>
</html>

the code below is todoController.js

module.exports = function(app) {

    app.get('/todo', function(req, res){
        res.render('todo');

    });



app.post('/todo', function(req, res){


});
app.delete('/todo', function(req, res){
});
};

Upvotes: 0

Views: 215

Answers (2)

Shim-Sao
Shim-Sao

Reputation: 2126

You create 2 servers so http and express can't listen on the same port.

To be sure of the express hostname and port that it will use, try this:

const myExpress = app.listen(port, hostname, () => {
  const addr = myExpress.address();
  const url = `http://${addr.address}:${addr.port}/`;

  // eslint-disable-next-line no-console
  console.log(`Listening Services on ${url} family ${addr.family}`);
});

You will get the right parameters used by express and not the hostname and port you provide.

How it is useful ? Because if for some reason the port is busy, node will not always fail but it will search for the first available port.

Test for the default path / to the server:

app.get("*", function(req, res) {
  console.log("ok default connection to the server works");
  res.send("ok default connection to the server works");
});

Upvotes: 1

David
David

Reputation: 864

You create two servers, one using the http module and the other using Express, but you only listen to the http server.

Just move "server.listen" function after todoController(app) and change "server" to "app" like this

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

in this case your server will listen to Express.

Upvotes: 2

Related Questions