This is written in very basic html5 and Javascript. The purpose of this project was mainly for me to do a little bit of webdev practice, as well as play around with the game of life. This is written using the html5 canvas, as well as vanilla Javascript. There are no JS libraries at all, and is now separated into multiple files. Once I get the thing working, I might try to convert the code to TypeScript, but we'll see.
The way I run this program is using the basic Python http server. With Python installed, you can run the following command:
python3 -m http.server
In some cases, you do not need the '3' above, and would run this command:
python -m http.server
There are two versions of the files: JavaScript and TypeScript. You can run either, although after this point (11/2/2023), I will most likely move over to TypeScript and continue development.
Within the head of the html file, there are two script tags, with one being commented out. Above each line is a comment. Simply comment out the one you do not want to use, and uncomment the one you do want to use.
<!-- <script src="src/main.js" type="module"></script> -->
<script src="src/ts/build/main.js" type="module"></script>
With TypeScript, there is an additional step of compiling the Typescript files into Javascript. Use this command from the root directory:
tsc -p src/ts
the above python or python3 command can be run at any time, but you need
to compile the files if using TypeScript.
This is a first pass, with mostly naive implementations, so there are many areas to improve upon.
Possible improvements:
- Unglobal a lot of things, like arrays, contexts, etc.
- Add persistence. Currently when you refresh the page, you lose everything.
- Write in something other than Javascript. If I can figure this out, I might try to do this in
wasmor another language. - Use some type of restful functions.
- Add a web framework to make the website better.
Figure out how to separate the monolith JS file into separate files.
- Shapes Wiki - This seems to have everything and is a good general reference.
These shapes do not move or change.
These shapes will change, and eventually go back to the original shape. The period is how many different forms this has before transforming back to its original shape.
- Blinker - period 2
- Toad - period 2
- Beacon - period 2
- Pulsar - period 3
- Pentadecathlon - period 15
These shapes will move across the screen.
- Wikipedia - Conway's Game of Life - Good general overview
- Markdown Guide - I can never remember this, so it's in the readme :)
- Cool Color Picker - This is especially awesome for shades and tints.