{"id":20449636,"url":"https://github.com/charlibb/monkeytype","last_synced_at":"2026-05-30T18:30:57.415Z","repository":{"id":235250251,"uuid":"785866469","full_name":"Charlibb/monkeyType","owner":"Charlibb","description":"Vainilla JS mock up from the famous typing game, monkeytype","archived":false,"fork":false,"pushed_at":"2024-04-22T18:21:28.000Z","size":18,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-05T09:19:58.024Z","etag":null,"topics":["game","javascript","practice-programming"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Charlibb.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-04-12T19:46:56.000Z","updated_at":"2024-04-22T18:22:14.000Z","dependencies_parsed_at":null,"dependency_job_id":"078b2101-c6bb-48d8-bcdd-69be335dd3b4","html_url":"https://github.com/Charlibb/monkeyType","commit_stats":null,"previous_names":["charlibb/monkeytype"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/Charlibb/monkeyType","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Charlibb%2FmonkeyType","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Charlibb%2FmonkeyType/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Charlibb%2FmonkeyType/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Charlibb%2FmonkeyType/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Charlibb","download_url":"https://codeload.github.com/Charlibb/monkeyType/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Charlibb%2FmonkeyType/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":33705207,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-05-30T02:00:06.278Z","response_time":92,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"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":["game","javascript","practice-programming"],"created_at":"2024-11-15T10:43:22.823Z","updated_at":"2026-05-30T18:30:57.399Z","avatar_url":"https://github.com/Charlibb.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Javascript Monkeytype mock up \n![693shots_so](https://github.com/Charlibb/monkeyType/assets/81753538/0bcaf2b1-8a36-4f95-8ee5-8c29cbdfede9)\n\n###  100% pure vainilla Javascript project based on the popular Monkeytype game, the minimalistic and customizable typing test.\n\n\n# MonkeyType Game\n\nThis is a simple typing game implemented in JavaScript. The game presents the player with a paragraph of random words, and the player needs to type them as accurately and quickly as possible.\n\n## How to Play\n\n1. Open the game in a web browser.\n2. Once the game starts, you will see a paragraph of random words displayed on the screen.\n3. Start typing the words as accurately as you can. The words will be highlighted as you type.\n4. Press the spacebar to move to the next word.\n5. If you make a mistake, you can press the backspace key to correct it.\n6. The game ends after the timer runs out.\n\n## Game Elements\n\n- **Time**: Displays the remaining time.\n- **Paragraph**: Displays the words to be typed.\n- **Input**: Allows the player to type the words.\n- **Results**: Displays the player's performance after the game ends, including words per minute (WPM) and accuracy.\n\n## Controls\n\n- **Spacebar**: Moves to the next word.\n- **Backspace**: Deletes the last character typed.\n\n## How It Works\n\n- The game randomly selects a set of words for the player to type.\n- The player types the words, and the game tracks accuracy and speed.\n- When the timer runs out or the player completes the paragraph, the game ends, and the results are displayed.\n\n## Developer Notes\n\n- The game is implemented using HTML, CSS, and JavaScript.\n- Custom HTML elements (`\u003cm-word\u003e` and `\u003cm-letter\u003e`) are used to represent words and letters for styling purposes.\n- The game dynamically adjusts the difficulty by selecting a random set of words for each play session.\n\n## Credits\n\nThis game is inspired by MonkeyType, a popular typing test website. This game was created thanks to Midudev, content creator who made the game as a tutorial \n\n# MonkeyType Game Code Explanation\n\nThis README provides an overview of the JavaScript code used to create the MonkeyType typing game. The code is structured to handle the game mechanics, including word generation, user input handling, and game over conditions.\n\n## Code Structure\n\n### Importing Data\n\nThe game imports an array of initial words from a separate JavaScript file (`data.js`) using ES6 module syntax.\n\n### DOM Elements\n\nThe code initializes variables representing various DOM elements used in the game interface, such as the timer, paragraph display, input field, and result elements.\n\n### Initialization\n\nThe `initGame()` function sets up the initial state of the game by displaying the game interface, generating a random set of words, and starting the timer.\n\n### Event Handling\n\nThe `initEvents()` function sets up event listeners for keyboard input and button clicks. These listeners ensure that the game responds to user actions such as typing and restarting the game.\n\n### Typing Mechanics\n\n- The `onKeyDown()` function handles keyboard events related to typing, including moving to the next word and correcting mistakes.\n- The `onKeyUp()` function updates the display based on user input, highlighting correct and incorrect characters as the player types.\n\n### Game Over\n\nWhen the timer runs out, the `gameOver()` function is called, hiding the game interface and displaying the player's results, including words per minute (WPM) and accuracy.\n\n## Custom HTML Elements\n\nThe game uses custom HTML elements (`\u003cm-word\u003e` and `\u003cm-letter\u003e`) to represent individual words and letters in the paragraph display. These elements are styled dynamically based on user input and game state.\n\n## Developer Notes\n\n- The code is designed to be modular and easy to understand, with clear function names and comments explaining each section.\n- It utilizes modern JavaScript features such as ES6 syntax and custom HTML elements for enhanced readability and maintainability.\n- Developers can further customize the game by adjusting parameters such as initial time and word selection criteria.\n\n## Future Improvements\n\n- Implementing additional features such as difficulty levels or multiplayer functionality.\n- Optimizing the code for performance and scalability.\n- Adding support for mobile devices and touch input.\n\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcharlibb%2Fmonkeytype","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcharlibb%2Fmonkeytype","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcharlibb%2Fmonkeytype/lists"}