Advertisement

Most quick/modern/worthwhile way to learn JavaScript

Started by November 25, 2020 07:17 PM
32 comments, last by 8Observer8 3 years, 11 months ago

I forgot to write that you should to write “npm init -y” to add the “package.json” file.

I wrote in the console after adding the “package.json” file and the “start” command:

git add .
git commit -m "Added the package.json file and the start command"
git push

Build was succeeded:

Try to open the application: https://multiplayer-game-in-js.herokuapp.com/​ We see the error:

Let's type:

heroku login

and

heroku logs --tail

I see:

I do not know what is the problem. Time to help me.

Advertisement

I found the solution:

heroku logs --tail -a multiplayer-game-in-js

I see the error called “Module not found”:

It seems that I forgot to add dependencies to the “package.json" file:

  "dependencies": {
    "express": "^4.17.1",
    "ws": "^7.3.1"
  }

Let's add, commit, push, and wait for deploy…

Yes, it is better. We can see the Hello message here: https://multiplayer-game-in-js.herokuapp.com/

But if you open the browser console you can see that we cannot connect by WebSocket:

Let's open the Heroku log again by typing:

heroku logs --tail -a multiplayer-game-in-js

But we see that everything is okay:

2020-11-27T21:05:25.373396+00:00 heroku[web.1]: Starting process with command `npm start`
2020-11-27T21:05:27.387944+00:00 app[web.1]:
2020-11-27T21:05:27.387963+00:00 app[web.1]: > multiplayer-game-in-js@1.0.0 start /app
2020-11-27T21:05:27.387964+00:00 app[web.1]: > node app.js
2020-11-27T21:05:27.387964+00:00 app[web.1]:
2020-11-27T21:05:27.555512+00:00 app[web.1]: Server started. Port:  55056
2020-11-27T21:05:27.645586+00:00 heroku[web.1]: State changed from starting to up
2020-11-27T21:05:35.014681+00:00 heroku[router]: at=info method=GET path="/" host=multiplayer-game-in-js.herokuapp.com request_id=d246221c-5299-4ee9-a900-5d686c029ed4 fwd="176.212.78.78" dyno=web.1 connect=1ms service=15ms status=200 bytes=693 protocol=https

Server war started on the port 55056.

Let's see what we have on our client:

    <script>
        const ws = new WebSocket("ws://localhost:3000");
        ws.onopen =
            () => {
                console.log("connected");
            }
    </script>

Let's try to change the address to:

const ws = new WebSocket("ws://https://multiplayer-game-in-js.herokuapp.com");​

“git add”, “git commit …”, “git push” …

Build in progress:

Advertisement

But we cannot connect again:

I will try to change “ws” to “wss” here:

const ws = new WebSocket("ws://https://multiplayer-game-in-js.herokuapp.com");

Okay I see my mistake. I forgot to delete “https” from the address above like this:

const ws = new WebSocket("ws://multiplayer-game-in-js.herokuapp.com");

And I changed “ws” to “wss”. See the code: https://github.com/8Observer8/multiplayer-game-in-js

And see the result (open the browser console): https://multiplayer-game-in-js.herokuapp.com/

We connected! Connect to the repo and let's to study JavaScript together by making a multiplayer game with WebSocket. I think we can use Canvas API (https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API) for simple 2D graphics. We can write the game it this topic. Author of the topic! Where are you? How wants to write a game with me? Anyways, it was a nice practice in English language. Thank you for your patience. And sorry if something is wrong.

This topic is closed to new replies.

Advertisement