--- title: "Discussion on \"How I Built a Wordle Clone Using Next.js, TailwindCSS, and TypeScript\" | Hashnode" description: "Discussion on \"How I Built a Wordle Clone Using Next.js, TailwindCSS, and TypeScript\". TL;DR\n\nI built a Wordle Clone using Next.js, TailwindCSS, and TypeScript.\nSource code at https://github.com/alexkates/wordlol\nRunning at https://wordlol.vercel.app/\n\n\nIntroduction\nOver the past few months, Wordle has nearly consumed all of our Twitte..." url: "https://hashnode.com/posts/how-i-built-a-wordle-clone-using-nextjs-tailwindcss-and-typescript/61e5683c8a425719c17364e5" --- [Feed](https://hashnode.com/feed) / Discussion # [How I Built a Wordle Clone Using Next.js, TailwindCSS, and TypeScript](https://alexkates.hashnode.dev/how-i-built-a-wordle-clone-using-nextjs-tailwindcss-and-typescript?utm_source=hashnode&utm_medium=feed) TL;DR I built a Wordle Clone using Next.js, TailwindCSS, and TypeScript. Source code at https://github.com/alexkates/wordlol Running at https://wordlol.vercel.app/ Introduction Over the past few months, Wordle has nearly consumed all of our Twitte... Jan 17, 2022 · 4 min read · alexkates.hashnode.dev Updated Jan 1, 2024 Read the article - [#100daysofcode](https://hashnode.com/tag/100daysofcode) - [#typescript](https://hashnode.com/tag/typescript) - [#nextjs](https://hashnode.com/tag/nextjs) - [#tailwind-css](https://hashnode.com/tag/tailwind-css) ## Written by [Alex Kates](https://hashnode.com/@thealexkates) @thealexkates · Philadelphia, PA [View profile](https://hashnode.com/@thealexkates) Founding Engineer @ Croissant Hi, I'm Alex Kates 👋 I'm a product engineer currently working at Croissant as a Founding Engineer. I'm addicted to writing about building, and building things worth writing about. Some extracurriculars include AWS Community Builder Instructor at MIT xPRO Bootcamp Volunteer at Tech for Campaigns ## Responses 6 Markdown supported · ⌘↵ to post [Arth Masand](https://hashnode.com/@Arth1521) [Jan 20, 2022](https://hashnode.com/posts/how-i-built-a-wordle-clone-using-nextjs-tailwindcss-and-typescript/61e5683c8a425719c17364e5/comment/61e9baa66070d3674d084e9a) This is amazing! As a student who has just entered the world of programming this has definitely inspired me to build my own unique project. [Alex Kates](https://hashnode.com/@thealexkates) [Jan 20, 2022](https://hashnode.com/posts/how-i-built-a-wordle-clone-using-nextjs-tailwindcss-and-typescript/61e5683c8a425719c17364e5/comment/61e9baa66070d3674d084e9a#reply-61e9c6c26070d3674d084f80) That is so awesome to hear, Arth! Connect with me on Twitter [twitter.com/thealexkates](https://twitter.com/thealexkates) if you are there. All the best. [raddevus](https://hashnode.com/@raddevus) [Jan 20, 2022](https://hashnode.com/posts/how-i-built-a-wordle-clone-using-nextjs-tailwindcss-and-typescript/61e5683c8a425719c17364e5/comment/61e9b2d26b944f677207ecff) Where did you get the list of 5-letter words? Did you mention how you store & load the 5 letter words? [Alex Kates](https://hashnode.com/@thealexkates) [Jan 24, 2022](https://hashnode.com/posts/how-i-built-a-wordle-clone-using-nextjs-tailwindcss-and-typescript/61e5683c8a425719c17364e5/comment/61e9b2d26b944f677207ecff#reply-61eee8c0e247b2151e61cf76) I built a static JSON of about 50 words. The answer is fetched from this JSON during the getServerSideProps step of the index.ts file. [Jared Gentry](https://hashnode.com/@jaredgentry) [Mar 5, 2022](https://hashnode.com/posts/how-i-built-a-wordle-clone-using-nextjs-tailwindcss-and-typescript/61e5683c8a425719c17364e5/comment/61e9b2d26b944f677207ecff#reply-6223c4f8e814324bc83a9339) [Alex Kates](https://hashnode.com/@thealexkates) So when you use ``, is Next able to refetch server side props without refreshing the browser? [Andrew Baisden](https://hashnode.com/@andrewbaisden) [Jan 20, 2022](https://hashnode.com/posts/how-i-built-a-wordle-clone-using-nextjs-tailwindcss-and-typescript/61e5683c8a425719c17364e5/comment/61e952fcb25efe60841c5c23) Very cool when I started playing that game I realised how cool it would be to recreate it because it does not seem that hard to develop. And us programmers could do it. [Alex Kates](https://hashnode.com/@thealexkates) [Jan 24, 2022](https://hashnode.com/posts/how-i-built-a-wordle-clone-using-nextjs-tailwindcss-and-typescript/61e5683c8a425719c17364e5/comment/61e952fcb25efe60841c5c23#reply-61eee8e1c99aed184e727a50) Not too complicated at all to be honest, but it's a lot of fun to build. Give it a shot and I think you will also enjoy it. [IGHMAZ](https://hashnode.com/@Ighmaz-Js) [Jan 20, 2022](https://hashnode.com/posts/how-i-built-a-wordle-clone-using-nextjs-tailwindcss-and-typescript/61e5683c8a425719c17364e5/comment/61e902740204273bdcb13e0f) great article Alex!! loved it!🥰 [Alex Kates](https://hashnode.com/@thealexkates) [Jan 20, 2022](https://hashnode.com/posts/how-i-built-a-wordle-clone-using-nextjs-tailwindcss-and-typescript/61e5683c8a425719c17364e5/comment/61e902740204273bdcb13e0f#reply-61e95061bd377860a9ae95ab) TYVM Ighmaz ✌️ [Shad Mirza](https://hashnode.com/@iamshadmirza) [Jan 18, 2022](https://hashnode.com/posts/how-i-built-a-wordle-clone-using-nextjs-tailwindcss-and-typescript/61e5683c8a425719c17364e5/comment/61e64f6cf6d40b3391ad6adf) Very cool, loved it [Alex Kates](https://hashnode.com/@thealexkates) [Jan 18, 2022](https://hashnode.com/posts/how-i-built-a-wordle-clone-using-nextjs-tailwindcss-and-typescript/61e5683c8a425719c17364e5/comment/61e64f6cf6d40b3391ad6adf#reply-61e6bb290204273bdcb0f000) Tyvm, Mohd. ✌️ [Michael Larocca](https://hashnode.com/@MichaelJudeLarocca) [Jan 18, 2022](https://hashnode.com/posts/how-i-built-a-wordle-clone-using-nextjs-tailwindcss-and-typescript/61e5683c8a425719c17364e5/comment/61e61d37f6d40b3391ad66e1) This is awesome! Keep up the great work! [Alex Kates](https://hashnode.com/@thealexkates) [Jan 18, 2022](https://hashnode.com/posts/how-i-built-a-wordle-clone-using-nextjs-tailwindcss-and-typescript/61e5683c8a425719c17364e5/comment/61e61d37f6d40b3391ad66e1#reply-61e61e8df6d40b3391ad66f3) Thank you, Michael. Glad you enjoyed it ✌️