https://github.com/jonaxplanta/bouncingballs
A simple Bouncing Balls website using HTML canvas in JavaScript with purposes of learning.
https://github.com/jonaxplanta/bouncingballs
bouncing-balls canvas2d css3 html5 javascript school-project training website
Last synced: 5 months ago
JSON representation
A simple Bouncing Balls website using HTML canvas in JavaScript with purposes of learning.
- Host: GitHub
- URL: https://github.com/jonaxplanta/bouncingballs
- Owner: JonaxPlanta
- License: mit
- Created: 2024-09-08T02:12:43.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2025-07-08T18:53:07.000Z (12 months ago)
- Last Synced: 2025-07-08T19:51:55.529Z (12 months ago)
- Topics: bouncing-balls, canvas2d, css3, html5, javascript, school-project, training, website
- Language: JavaScript
- Homepage: https://jonaxplanta.github.io/BouncingBalls/
- Size: 27.3 KB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
### Bouncing Balls WebSite
This is a **Website** which uses *HTML*, *CSS*, *Javascript* and *Canvas API* to generate a **Ball Bouncing Frame Animation**.
---
### Dependences
This is **dependences** to run the program:
| Name | Download Link |
|------------|------------------------------------------------|
| NodeJS | https://nodejs.org/en/download/package-manager |
### Installing
#### NodeJS
1. Open the **terminal**
- Windows
```
Windows + R : "cmd" or "powershell"
```
- Linux
```
Ctrl + Alt + T
```
2. Insert the following command
```
cd
```
3. Then
```
npm init -y
```
---
### How to run
1. Download *Index.html*, *Style.css* and *Script.js*
2. Create a folder called **bouncing-balls**
- In the folder location, insert the following command
```
mkdir bouncing-balls
```
3. Move *Index.html*, *Style.css* and *Script.js* files to *bouncing-balls* folder
- In the **terminal**
```
move
```
4. Open the **bouncing-balls** folder
- In the **terminal**
```
cd
```
5. Copy the *Index.html* path and paste in browser
```
file:\\\
```
- PS.: Remove the Quotation marks from **
7. Wait until the site load completelly
##### OR
4. Open the **bouncing-balls** folder in **File Explorer**
5. Click with the *Right Mouse Button* on *Index.html* file
6. Select the *Open with* option and select a **Browser**
7. Wait until the site load completelly
#### OR Acess it with the following URL:
```
https://jonaxplanta.github.io/BouncingBalls/
```
⠀