With NYT's purchase of Wordle, they will no doubt file for trademark. I assume that they get legal precedent over anyone with the name Wordle in the app itself.

Since this is the largest clone repository I could find, may I suggest potentially going for a change in branding to keep this project alive!

In Firefox and Chrome on Android (untested elsewhere) double tapping on a key will select the text instead of adding that letter twice. This is especially annoying when hitting the delete key repeatedly.

Probably some event capturing needs to happen? Or maybe can make the text unselectable in CSS?

Like in the original Wordle, it'd be useful to add a mode where previous hints must be taken into account on subsequent tries, to help users choose the words with the best "new character" yield.

Hi Hannah, please contact me on my profile email to discuss paid collaboration.

Share button doesn't do anything when hitting with iphone.

for people who are afraid of pressing ESC

I wanted to play again but there was no button to reset the game loop

Rules say that a grey number is "not in the prime in any spot" - but when a digit is repeated in the prime, the first occurrence shows green or orange, second shows as grey. I believe it should show as orange instead.

Example I ended with (failed): 1(green) 1(grey) 4(green) 4(grey) 7(green) - all other digits grey at bottom. This leaves no digits possible, per the rules! The prime had repeated 4 and 7 I believe (I didn't write down the correct answer, not sure the order, sorry!)

In "reference" Wordle, a permanent Alert pops up with the answer if you fail to get it in six tries.

One of the details that make the original Wordle fun to play that's missing in the clone is the slower, animated reveal of the letter colours when Enter is pressed, rather than showing the colours immediately at once.

The bottom and top of the view, especially on mobile, is often occluded by notifications, toasts, status bars, etc and therefore modals should open near the middle of the view to be most accessible.

One strategy for Wordle is to use a starting word or two (or three!) to start a game. It would be nice To have a way to store a few of these for use. Would be even better to automatically play one/two/three of them right away.

The "reference" wordle puts the share button (and a timer) at the bottom of the statistics modal. This is preferable as it gives the user a way to get back the share button after dismissing the modal.

First of all, looks good!

You might want to add license to make it clear how this can be used. Thanks!

To maintain this project for long, enough tests for each components are needed.

For those of us making international (non-English) versions of Wordle with this project as our base, the recent refactor of the Modals is a bit of a pain to rebase, as all the translated strings need to be rebased by hand. This problem can be solved by putting UI strings into a constants file, where people translating the app can make their changes independent of code refactors.

Great app but no reset to clear previous game

I have an idea to extend this to a two player game. I wonder if you would consider doing it as a paid project? If so please get in touch, my email is in my profie.

Hi Hannah, thanks for your work on this! Your project enabled me to spin up a German version of Wordle very easily.

I just ran into an issue in my fork where the game state that's saved in local storage persists into the next day. I.e. it's not cleared when a new word is enabled, making it impossible to solve the new word from scratch without manually clearing the site's localStorage.

I'm happy to try and create a PR for this tomorrow if I get around to it before you do.

e.g. by revealing one letter

After winning game, typing on the keyboard or on-screen keyboard shouldn't yield a result.

• Is there any way we can hide the words used in the game from users?
• For example in Firefox, if I go to Inspect -> Debugger tab I can see all the possible words that can be answered.
• How does the original game hide it?
• Screenshot for reference:
  

A certain game show that this is similar to has a couple rules that would provide an intriguing change to gameplay:

• You only get five guesses, not six.
• The first letter of the word is revealed at the start. All guesses must start with this letter, even though not using other hints is allowed.

It would be nice if other languages could use the same code base without creating their own project.

I cloned the repo and typed npm install as instructed, and got the following warnings:

npm WARN deprecated [email protected]: Please see https://github.com/lydell/urix#deprecated
npm WARN deprecated [email protected]: See https://github.com/lydell/source-map-url#deprecated
npm WARN deprecated [email protected]: request-promise-native has been deprecated because it extends the now deprecated request package, see https://github.com/request/request/issues/3142
npm WARN deprecated [email protected]: https://github.com/lydell/resolve-url#deprecated
npm WARN deprecated [email protected]: some dependency vulnerabilities fixed, support for node < 10 dropped, and newer ECMAScript syntax/features added
npm WARN deprecated [email protected]: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.
npm WARN deprecated [email protected]: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
npm WARN deprecated [email protected]: use String.prototype.padStart()
npm WARN deprecated [email protected]: flatten is deprecated in favor of utility frameworks such as lodash.
npm WARN deprecated [email protected]: this library is no longer supported
npm WARN deprecated [email protected]: This loader has been deprecated. Please use eslint-webpack-plugin
npm WARN deprecated [email protected]: request has been deprecated, see https://github.com/request/request/issues/3142
npm WARN deprecated [email protected]: please switch to a stable version
npm WARN deprecated @hapi/[email protected]: This version has been deprecated and is no longer supported or maintained
npm WARN deprecated @hapi/[email protected]: This version has been deprecated and is no longer supported or maintained
npm WARN deprecated [email protected]: babel-eslint is now @babel/eslint-parser. This package will no longer receive updates.
npm WARN deprecated @hapi/[email protected]: Moved to 'npm install @sideway/address'
npm WARN deprecated [email protected]: See https://github.com/lydell/source-map-resolve#deprecated
npm WARN deprecated [email protected]: Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies.
npm WARN deprecated [email protected]: Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies.
npm WARN deprecated @hapi/[email protected]: This version has been deprecated and is no longer supported or maintained
npm WARN deprecated [email protected]: Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies.
npm WARN deprecated @hapi/[email protected]: Switch to 'npm install joi'
npm WARN deprecated [email protected]: This SVGO version is no longer supported. Upgrade to v2.x.x.
npm WARN deprecated [email protected]: core-js@<3.4 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Please, upgrade your dependencies to the actual version of core-js.

added 1991 packages, and audited 1992 packages in 1m

84 packages are looking for funding
  run `npm fund` for details

137 vulnerabilities (124 moderate, 12 high, 1 critical)


To address issues that do not require attention, run:
  npm audit fix

To address all issues (including breaking changes), run:
  npm audit fix --force

Run `npm audit` for details.

Please advise!

5-letter words are cool, but have you tried 6-letter words?

Firstly, thank you @hannahcode! I made a fork for Shavian. Repo and app (I am just hosting the app on github pages using the build directory).

I added the package grapheme-splitter to the app.

Then you can see how I handled adding new unicode letters and splitting them in these two commits:

1. Shavian-School@076dba4
2. Shavian-School@50dece6

The project is missing the ISSUE TEMPLATES and a Code of Conduct. If you want to add them, then I would want to submit a PR with those.

Please let me know what do you think about that, and one more thing, this project is really the representation of your amazing work. Please don't think of changing the ownership to anyone else. You can obviously add more contributors or maintainers, but please do not change the ownership.

Share doesn't seem to be working for me. You click it and it does nothing on both mobile & desktop devices. Isn't it meant to copy to clipboard?

Please add the instructions

There's a visual issue in dark mode whereby used keys that are absent in the solution are made lighter rather than darker, which can make it very hard to tell apart unused keys and used-but-absent keys, especially later in the game.

If I forget to share when I am done, I'd still like to be able to click on some button and then share the results.

Thanks to your detailed instructions, I managed to create the Arabic version of your clone kelmaly.com. I'll continue working and testing it before making it available to the public. Thanks!

help me pls
<Key value="Ü" onClick={onClick} status={charStatuses['Ü']} />

10:07:19 PM: Failed to compile.
10:07:19 PM: 
10:07:19 PM: TS2322: Type '"Ü"' is not assignable to type 'KeyValue'.

10:07:19 PM:   > 50 |         <Key value="Ü" onClick={onClick} status={charStatuses['W']} />

Hey, first up this is fantastic. Been playing around trying to make my own version and was great to stumble across this.

Just thought I'd let you know, it seems to be missing part of the word list. I noticed that my first 3 guesses (roate, areas, and conga) were all not valid words, when I know they work on the normal wordle.

I had a look and I can see your words list matches the var in the wordle source code named "La", but I noted that after this list, there is a second var named "Ta" that has the rest of the words. I'm guessing one is a list of the daily words and the other is a list of valid answers?

Hi,

Great project this one. I wanted to try one for Persian and I was wondering how I can show the grid in reverse order as Persian is written from right to left. It would be great if you could give me a hint :)

Thank you so much :)

The real Wordle supports keyboard input on a computer. Kind of nice when you're playing on there. Should be a pretty easy add to yours if you wanted to consider it.

It'd be nice if this had a dark mode like the original Wordle.

I'd make a PR for it but I'm not that familiar with Tailwind so am not 100% sure where to start looking.

Firefox (Linux) captures the / key as the shortcut for search, so divisions are only possible using the on-screen keyboard.

I this is not a good reason to create an issue but I wanted to comment.
I just finished working on my own version of a Wordle clone and checked to see if anyone else had done something similar on GitHub. This was the first repo to come up. Looks like you got there a few weeks ahead of me.
I also used Typescript and a front end framework :)

we can find a solution every time with a simple breakpoint trick :)

Hi everyone, I never anticipated this project would grow so large, nor that a key source of its inspiration would be acquired by NYT. For these reasons I'm not sure I want to hold and maintain it. I'm open to suggestions, just wanted to be honest and start this conversation. If you are a contributor who would be comfortable owning this project please let me know.

After trying a letter and getting it marked gray, the user should not be able to type it in any more.

(Maybe make this optional using a checkbox?)

hey, i added my own words on the wordlist.ts now the browser is showing me blank page why is it so? can anyone help me in this matter?

Firstly, great work on this wordle clone!

Following the instructions at https://github.com/hannahcode/wordle#wordle-clone I got this error

$ npm install
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})

audited 1403 packages in 3.678s

166 packages are looking for funding
  run `npm fund` for details

found 9 vulnerabilities (2 low, 6 moderate, 1 high)
  run `npm audit fix` to fix them, or `npm audit` for details

So far so good!

$ npm run start
...
TypeError: (intermediate value)(intermediate value)(intermediate value).slice(...).reverse(...).flatMap is not a function
assets by path static/js/*.js 2.18 MiB
  asset static/js/bundle.js 2.17 MiB [emitted] (name: main) 1 related asset
  asset static/js/node_modules_web-vitals_dist_web-vitals_js.chunk.js 6.88 KiB [emitted] 1 related asset
asset index.html 561 bytes [emitted]
asset asset-manifest.json 458 bytes [emitted]
cached modules 1.87 MiB (javascript) 31.3 KiB (runtime) [cached] 413 modules
./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[2]!./node_modules/source-map-loader/dist/cjs.js!./src/index.css 39 bytes [built] [1 error]

ERROR in ./src/index.css (./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[2]!./node_modules/source-map-loader/dist/cjs.js!./src/index.css)
Module build failed (from ./node_modules/postcss-loader/dist/cjs.js):
TypeError: (intermediate value)(intermediate value)(intermediate value).slice(...).reverse(...).flatMap is not a function
    at Object.getAllConfigs [as default] (/home/alok/github/wordle/node_modules/tailwindcss/lib/util/getAllConfigs.js:17:26)
    at Object.resolveConfig [as default] (/home/alok/github/wordle/node_modules/tailwindcss/lib/public/resolve-config.js:14:60)
    at getTailwindConfig (/home/alok/github/wordle/node_modules/tailwindcss/lib/lib/setupTrackingContext.js:65:52)
    at /home/alok/github/wordle/node_modules/tailwindcss/lib/lib/setupTrackingContext.js:124:92
    at /home/alok/github/wordle/node_modules/tailwindcss/lib/processTailwindFeatures.js:39:11
    at plugins (/home/alok/github/wordle/node_modules/tailwindcss/lib/index.js:20:104)
    at LazyResult.runOnRoot (/home/alok/github/wordle/node_modules/postcss/lib/lazy-result.js:339:16)
    at LazyResult.runAsync (/home/alok/github/wordle/node_modules/postcss/lib/lazy-result.js:393:26)
    at LazyResult.async (/home/alok/github/wordle/node_modules/postcss/lib/lazy-result.js:221:30)
    at LazyResult.then (/home/alok/github/wordle/node_modules/postcss/lib/lazy-result.js:206:17)
 @ ./src/index.css 8:6-262 22:17-24 26:7-21 58:25-39 59:36-47 59:50-64 63:6-73:7 64:54-65 64:68-82 70:42-53 70:56-70 72:21-28 83:0-232 83:0-232 84:22-29 84:33-47 84:50-64 61:4-74:5
 @ ./src/index.tsx 6:0-21

ERROR in Module.createRequire is not a function

ERROR in   Error: Child compilation failed:
  Module.createRequire is not a function
  
  - child-compiler.js:169 childCompiler.runAsChild
    [wordle]/[html-webpack-plugin]/lib/child-compiler.js:169:18
  
  - Compiler.js:559 compile
    [wordle]/[webpack]/lib/Compiler.js:559:11
  
  - Compiler.js:1129 hooks.afterCompile.callAsync.err
    [wordle]/[webpack]/lib/Compiler.js:1129:17
  
  
  - next_tick.js:68 process._tickCallback
    internal/process/next_tick.js:68:7
  


1 ERROR in child compilations (Use 'stats.children: true' resp. '--stats-children' for more details)
webpack 5.65.0 compiled with 4 errors in 1072 ms
Files successfully emitted, waiting for typecheck results...
Issues checking in progress...
No issues found.

and http://localhost:3000 throws up

Html Webpack Plugin:
  Error: Child compilation failed:
  Module.createRequire is not a function
  
  - child-compiler.js:169 childCompiler.runAsChild
    [wordle]/[html-webpack-plugin]/lib/child-compiler.js:169:18
  
  - Compiler.js:559 compile
    [wordle]/[webpack]/lib/Compiler.js:559:11
  
  - Compiler.js:1129 hooks.afterCompile.callAsync.err
    [wordle]/[webpack]/lib/Compiler.js:1129:17
  
  
  - next_tick.js:68 process._tickCallback
    internal/process/next_tick.js:68:7

I'm trying to solve this, but just posting here in case someone already encountered it and knows of a solution.

In lib/word.ts, in getWordOfDay(), it looks like index isn't limited to the size of the WORDS array and could overrun.

I don't know JS well enough to make a PR, sorry.

Hello! I am trying to use this project to make Wordle for another language but I am a bit confused on how to do that. There are only 3 special characters, "a̱", "i̱" and "o̱", all two unicode characters. Currently in the game, the keyboard shows each of the characters in separate boxes when the letter character is selected. How do I make them only appear as one? Where do I make that change in the code? Thanks in advance!

So, I imagine this having two parts:

1. A way to enter a word. It's checked against the word list (not guess list), and if it's present, an corresponding URL for that word is generated, like https://web-site?index=masked_index. Where masked)index is the index from word the wordlist, transformed to avoid accidental spoilers. For example, masked_index = (517 * index) MOD 3947.
2. When someone uses a custom URL, the word index is unmasked (same example, index = (3237 * masked_index) MOD 3947), and the corresponding word is used instead of the daily word.