Build a Wordle Clone in ReactJS - Best React Project

In this video I will be going over how to build a Wordle Clone using React.

Topics You Will Learn:
- Advanced React, React Hooks: UseState, UseEffect
- State Management - UseContext, Context API
- React/Javascript Logic, Wordle

Social
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬

Tags:
- ReactJS Tutorial
- ReactJS and MySQL
- NodeJS Tutorial
- Wordle

Timestamps
00:00 | Demo
02:45 | Sponsorship
03:34 | Setting Up Board
23:02 | Keyboard
55:13 | Coloring Letters
01:03:06 | Getting Words From Word Bank
01:20:29 | Game Over

#reactjs #wordle

[LiamGower]

Amazing video. Started learning React 2 weeks ago slowly using Codecademy to get the basics down. I then decided to build my own Wordle to implement what I learnt in Codecademy, but soon learnt I didn't have a good-enough grasp about components interacting (in particular, the use of AppContext). Searched and found your video and boom this is perfect. Slowly chipped away at this video maybe 20 minutes a day and it has been amazing to grow my understanding.

I will now look to implement other features on top of this (such as a nav bar, perhaps some animation and I would love to capture play statistics).

Thank you so, so much!

[spasojeperovic]

Hey @PedroTech great video 🙌. At 1:30:31 you guessed the word but it didn't render the GameOver component. And I poked around in the code and realized that currWord is in uppercase. And it's solved by adding .toLowerCase() in for loop in onEnter function.

[asifurrahman]

I have seen many wordle clone, but i think your's is the most efficient one, well structured

[alexandra_b]

Pedro, thank your for this amazing project! I really appreciate you using Context API here. Can't wait to watch the second part 👏

[satyaprakashsahoo]

Yes plz make the second part.. Plz plz... Lots of things we learn from you. Thanks Pedro

[YourTechWhiz]

My mind is blown. 🤯
You are a champ bro. 🙇🏻‍♂️❤️

[ezeamaka]

Seriously, the implementation of the logic behind this project is mind-blowing. I really enjoyed the thinking and implementation. Logic has been my most intimidating skill in programming. I find it difficult to think and implement with code, and it is my biggest roadblock. Any tip?

[notjunior]

this video is very underrated
explanation of your code in every step is perfect even for people that just started working with react
thanks man <3

[MrSemro]

What a legend. I will use the concepts learned here to incorporate this in my next project that will allow individuals to play three different games as part of an entire larger web application.

[boundless-sher]

great video pedrotech. was super fun hoping for more fun projects like this

[rakhisingh]

Bro pls start a series using redux with frontend and rest api with backend.

[ivanstebler]

Superb explanation!

Muchas gracias Pedro!

[codingforest]

Many thanks, you really helped me to understand a lot of concepts in react js.

[silvajulio]

GOAT! I always learn a lot from your videos!!

[Kashhash]

You explained everything very nicely. Thankyou!!
I was finding some course/video to clone quordle and then came across this video, helped me a lot.

[ThColinPereira]

Omg, great video Pedro as usual! This was amazing!

[mdhasiburrahmannafiz]

Thank you.

And waiting for second part.

[konno_donnoi]

01:30:33

t was in the word but it wasn’t highlighted as a yellow potential word

and the correct word was write


the yellow hint feature isn’t working

[DaveFredkove]

🔥Pedro, thanks! Very good tutorial and excellent learning material. super! 👍

[yuliyaSi]

It’s really helpful for training react-hooks! Thank you 🙏