https://github.com/sugidaffection/js-supermariobros
Super Mario Bros with Javascript
https://github.com/sugidaffection/js-supermariobros
javascript supermariobros
Last synced: about 1 month ago
JSON representation
Super Mario Bros with Javascript
- Host: GitHub
- URL: https://github.com/sugidaffection/js-supermariobros
- Owner: sugidaffection
- Created: 2019-07-01T08:45:11.000Z (about 7 years ago)
- Default Branch: master
- Last Pushed: 2026-02-17T11:00:24.000Z (5 months ago)
- Last Synced: 2026-02-17T12:08:15.481Z (5 months ago)
- Topics: javascript, supermariobros
- Language: JavaScript
- Size: 11.3 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Super Mario Bros (JavaScript)
A classic Super Mario Bros recreation built with JavaScript and the HTML5 Canvas API.

## Preview

## Features
- Classic Super Mario Bros gameplay mechanics
- Smooth physics-based movement and collision detection
- Entity Component System (ECS) architecture
- Responsive canvas rendering
- Keyboard controls
## Tech Stack
- **Vanilla JavaScript** - Core game logic
- **HTML5 Canvas** - Rendering
- **Vite** - Build tooling and development server
## Getting Started
### Prerequisites
- Node.js (v16 or higher recommended)
- npm
### Installation
```bash
# Clone the repository
git clone https://github.com/your-username/js-supermariobros.git
# Navigate to project directory
cd js-supermariobros
# Install dependencies
npm install
```
### Development
```bash
# Start the development server with hot reload
npm run dev
```
Open your browser and navigate to `http://localhost:5173` (or the port shown in your terminal).
### Build
```bash
# Build for production
npm run build
# Preview production build
npm run preview
```
## Controls
| Key | Action |
|-----|--------|
| Arrow Keys / WASD | Move Left/Right |
| Space / Up Arrow | Jump |
## Project Structure
```
js-supermariobros/
├── src/
│ ├── main.js # Application entry point
│ ├── core/ # Core game systems
│ └── ecs/ # Entity Component System implementation
├── public/
│ ├── assets/ # Game assets (sprites, sounds)
│ └── fonts/ # Custom fonts
├── tests/ # Test files
├── index.html # HTML entry point
├── package.json # Project configuration
└── vite.config.js # Vite configuration
```
## Deployment
This project is configured for deployment on GitHub Pages.
### GitHub Pages Setup
1. Go to your GitHub repository **Settings > Pages**
2. Set **Source** to **GitHub Actions**
3. Push to `main` or `master` branch (or run the workflow manually)
The Vite `base` path is automatically configured during GitHub Actions builds.
### Manual Deployment
```bash
npm run build
# Deploy the contents of the dist/ directory to your hosting service
```
## Testing
```bash
# Run tests
npm test
```
## License
This project is licensed under the MIT License.
## Acknowledgments
- Super Mario Bros is a trademark of Nintendo. This project is a fan-made recreation for educational purposes.