Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/whispernet/multiplayer-game-with-js
This multiplayer game project was a fantastic learning experience, focusing on socket programming, server-client architecture, and multi-user environments. It features real-time player movement, collision detection, and a leaderboard.
https://github.com/whispernet/multiplayer-game-with-js
canvas express javascript node-js socket-io
Last synced: about 1 month ago
JSON representation
This multiplayer game project was a fantastic learning experience, focusing on socket programming, server-client architecture, and multi-user environments. It features real-time player movement, collision detection, and a leaderboard.
- Host: GitHub
- URL: https://github.com/whispernet/multiplayer-game-with-js
- Owner: WhisperNet
- Created: 2024-05-05T08:20:10.000Z (9 months ago)
- Default Branch: master
- Last Pushed: 2024-06-25T18:43:21.000Z (7 months ago)
- Last Synced: 2024-06-25T20:36:28.988Z (7 months ago)
- Topics: canvas, express, javascript, node-js, socket-io
- Language: JavaScript
- Homepage: https://www.youtube.com/watch?v=v28cxluJgAk
- Size: 24.4 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Multiplayer Game with JS
Welcome to my multiplayer game project repository! This project was a significant learning experience where I explored socket programming, server-client architecture, and multi-user environments. You can view a demo of this game [here](https://youtu.be/v28cxluJgAk) .
![image](https://github.com/WhisperNet/multiplayer-game-with-js/assets/83389896/bb7fda96-378e-403a-9db5-4d94121abdef)## Table of Contents
- [Introduction](#introduction)
- [Features](#features)
- [Technologies Used](#technologies-used)
- [Installation](#installation)
- [Lessons Learned](#lessons-learned)## Introduction
This project is a multiplayer game developed from scratch. It covers various aspects of game development, from setting up the game to adding unique player attributes, implementing player movement, handling projectiles and collisions, creating a leaderboard, and more. The project culminates in pushing the game live and setting up a domain name.
## Features
- **Player Connection and Disconnection**: Manages multiple players connecting and disconnecting seamlessly.
- **Unique Attributes and Usernames**: Assigns unique attributes and usernames to each player.
- **Real-time Player Movement**: Implements smooth player movement and interactions.
- **Projectiles and Collision Detection**: Handles shooting projectiles and detecting collisions.
- **Leaderboard**: Displays a leaderboard to track player scores.## Technologies Used
- **HTML5**: For structuring the game interface.
- **CSS3**: For styling the game elements.
- **JavaScript**: For game logic and client-side interactions.
- **Node.js**: For the server-side logic.
- **Socket.IO**: For real-time communication between the server and clients.## Installation
To run this project locally, follow these steps:
1. **Clone the repository**:
```sh
git clone https://github.com/whispernet/multiplayer-game-with-js.git
```2. **Navigate to the project directory**:
```sh
cd multiplayer-game-with-js
```3. **Install dependencies**:
```sh
npm install
```4. **Start the server**:
```sh
node backend.js
```5. **Open your browser and navigate to**:
```
http://localhost:3000
```## Lessons Learned
Throughout this project, I gained valuable insights into:
- **Socket Programming**: Learned how to use Socket.IO for real-time communication.
- **Server-Client Architecture**: Understood how servers and clients interact in a multi-user environment.
- **Game Logic**: Developed logic for player movement, collisions, and score tracking.
- **Project Deployment**: Learned how to deploy a project live and set up a custom domain.
- **Enhanced Interpolation**: Improved the smoothness and responsiveness of gameplay.---