{"id":17160395,"url":"https://github.com/codenameyau/snake-game","last_synced_at":"2026-01-19T06:01:26.631Z","repository":{"id":22037585,"uuid":"95055853","full_name":"codenameyau/snake-game","owner":"codenameyau","description":"Snake in ES6 JS and canvas with webpack","archived":false,"fork":false,"pushed_at":"2023-01-01T08:57:59.000Z","size":2181,"stargazers_count":2,"open_issues_count":25,"forks_count":1,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-04-14T07:07:27.240Z","etag":null,"topics":["canvas","es6","game","javascript","raw","snake"],"latest_commit_sha":null,"homepage":"https://codenameyau.github.io/snake-game/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/codenameyau.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-06-21T23:45:33.000Z","updated_at":"2024-04-14T07:07:27.240Z","dependencies_parsed_at":"2023-01-13T21:49:15.126Z","dependency_job_id":null,"html_url":"https://github.com/codenameyau/snake-game","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/codenameyau/snake-game","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codenameyau%2Fsnake-game","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codenameyau%2Fsnake-game/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codenameyau%2Fsnake-game/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codenameyau%2Fsnake-game/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/codenameyau","download_url":"https://codeload.github.com/codenameyau/snake-game/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codenameyau%2Fsnake-game/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28562231,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-19T03:31:16.861Z","status":"ssl_error","status_checked_at":"2026-01-19T03:31:15.069Z","response_time":67,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["canvas","es6","game","javascript","raw","snake"],"created_at":"2024-10-14T22:24:43.258Z","updated_at":"2026-01-19T06:01:26.613Z","avatar_url":"https://github.com/codenameyau.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# snake-game\n\n![Snake Game](https://user-images.githubusercontent.com/3826772/60639920-9ccf7980-9df2-11e9-9b32-7be1e3412a77.png)\n\n## Website\nhttps://codenameyau.github.io/snake-game/\n\n## Implementation Details\nI implemented the snake using an Array (Queue), where the first element represents\nthe head of the snake and the last element represents the tail. As the snake\nmoves, the tail is popped and the new cell position is appended to the front\nof the segments as the new head. If the head of the snake collides with a food,\nthen tail is not popped. If the head collides with another snake segment, then\nthe game is over.\n\nCollision detection is implemented via a matrix that keeps track of all cells\nin the game. The snake segments and food are then drawn on the canvas. The\nindividual matrix cells are not rendered.\n\n## Running Instructions\n\n```bash\n# Running game with Webpack.\nnpm install\nnpm start\n\n# Running tests.\nnpm test\n```\n\nThen visit http://localhost:8080\n\n\n## Tasks\nThese are the steps I took when creating this game.\n```\n[+] Setup Webpack for ES6\n[+] Setup ES6 tests with Mocha and Chai\n[+] Design and create the HTML / CSS game layout\n[+] Design and create Game class\n[+] Design and create Snake class\n[+] Design and create Food class\n[+] Implement and render snake\n[+] Implement and render food\n[+] Spawn randomly generated snake on canvas\n[+] Spawn randomly generated food on canvas\n[+] Implement collision detection matrix\n[+] Handle user input\n[+] Implement game status\n[+] Implement score\n[+] Implement start/pause/restart game\n[+] Implement game loop and rendering animation frames\n[+] Implement snake movement\n[+] Implement snake and food collision events\n[+] Fix bug with snake colliding with itself when moving backwards\n[+] Implement wall collision\n[+] Implement top 5 high scores\n```\n\n### Future Enhancements\n```\n[ ] Add mobile touch support\n[ ] Revisit collision detection algorithm with sparse matrix\n[ ] Add animations\n[ ] Add music and sound effects\n[ ] Implement no walls option\n[ ] Implement options UI\n[ ] Multiplayer (separate repo)\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodenameyau%2Fsnake-game","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcodenameyau%2Fsnake-game","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodenameyau%2Fsnake-game/lists"}