I created Worlde with ReactJS, and Tailwind CSS

Overview

wordle screenshot

I made Wordle XD

GitHub license GitHub contributors GitHub issues GitHub pull-requests

GitHub watchers GitHub forks GitHub stars

Hello everyone πŸ‘‹ , I am glad to see you here I know it ain't much but this is the game wordle (popular in twitter recently!) I made using ReactJS the funny part is that I didn't write a single line of CSS (Actually I wrote 3 but you didn't see anything 🀫 ). you can play it live using the link: https://mahmoudfettal.github.io/wordle/

Getting Started with Create React App

This project was bootstrapped with Create React App.

Available Scripts

In the project directory, you can run:

npm start

Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.

The page will reload when you make changes.
You may also see any lint errors in the console.

npm test

Launches the test runner in the interactive watch mode.
See the section about running tests for more information.

npm run build

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

See the section about deployment for more information.

npm run eject

Note: this is a one-way operation. Once you eject, you can't go back!

If you aren't satisfied with the build tool and configuration choices, you can eject at any time. This command will remove the single build dependency from your project.

Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except eject will still work, but they will point to the copied scripts so you can tweak them. At this point you're on your own.

You don't have to ever use eject. The curated feature set is suitable for small and middle deployments, and you shouldn't feel obligated to use this feature. However we understand that this tool wouldn't be useful if you couldn't customize it when you are ready for it.

Learn More

You can learn more in the Create React App documentation.

To learn React, check out the React documentation.

Code Splitting

This section has moved here: https://facebook.github.io/create-react-app/docs/code-splitting

Analyzing the Bundle Size

This section has moved here: https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size

Making a Progressive Web App

This section has moved here: https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app

Advanced Configuration

This section has moved here: https://facebook.github.io/create-react-app/docs/advanced-configuration

Deployment

This section has moved here: https://facebook.github.io/create-react-app/docs/deployment

npm run build fails to minify

This section has moved here: https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify

You might also like...

A trivia website game based on origin of objects and concepts from around the world

Origin guesser is a quiz/trivia game in which the user is presented a word, object, or flag and offered a series of multiple choice answers to choose from as to the origin of that concept. Unlike other trivia games, this is concentrated only on origin of objects and concepts questions.

Feb 12, 2022

Generate sound effects and background music for good old-fashioned mini-games

Generate sound effects and background music for good old-fashioned mini-games

Generate sound effects and background music for good old-fashioned mini-games

Aug 1, 2022

'Neko Mezashi Attack' - a simple but cute action game made with Vite and TypeScript

'Neko Mezashi Attack' is a simple but cute action game made with Vite and TypeScript. This app is packed all resources including style, graphics and audio into 4KB(4096 chars) JS. No runtime libraries or external resources are required.

Jun 17, 2022

How to build a multiplayer Wordle clone with Liveblocks, Vue, and Vite

How to build a multiplayer Wordle clone with Liveblocks, Vue, and Vite

Wordle Wars This repo shows how to build a multiplayer Wordle clone with Liveblocks, Vue, and Vite. Try it out It's forked from VVowrdle created by Ev

Oct 12, 2022

A recreation of the popular game Wordle with additional modes and features. Made with Svelte in Typescript.

A recreation of the popular game Wordle with additional modes and features. Made with Svelte in Typescript.

A recreation of the popular game Wordle by Josh Wardle (now purchased by the New York Times), with additional modes and features. Hosted on GitHub pag

Nov 15, 2022

A simple app to show NBA games and scores/details.

A simple app to show NBA games and scores/details.

NBA Remix A simple app to show NBA games and scores/details. Deployment After having run the create-remix command and selected "Vercel" as a deploymen

Nov 2, 2022

Open apps directly in GNOME Software by clicking Install from Flathub and apps.gnome.

Flatline Open apps directly in GNOME Software by clicking Install from Flathub and apps.gnome. Instalation Enable Epiphany extension. Optional if not

Sep 2, 2022

ReactJS-Travel-Website - This is a travel(adventure) website made with ReactJS.

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

Jan 1, 2022

βͺ Rewinds – Remix Tailwind Starter Kit with Tailwind CSS, Headless UI, Radix UI, and more

βͺ Rewinds – Remix Tailwind Starter Kit with Tailwind CSS, Headless UI, Radix UI, and more

βͺ Rewinds – Remix Tailwind Starter Kit Rewinds is a Remix starter kit with Tailwind CSS v3 family of libraries. This is an example demo to combine the

Nov 23, 2022

♦ Crowd funding project using Smart Contracts on the Ethereum. Created with Next.js and Tailwind CSS.

♦ Crowd funding project using Smart Contracts on the Ethereum. Created with Next.js and Tailwind CSS.

Crowdcoin ♦ Crowd funding project using Smart Contracts on the Ethereum. Created with Next.js and Tailwind CSS. Project from "Ethereum and Solidity: T

Dec 22, 2021

This is a movie app project using imdb database created by nextjs and tailwind css.

This is a Next.js project bootstrapped with create-next-app. Getting Started First, run the development server: npm run dev # or yarn dev Open http://

Dec 24, 2021

This is a movie app created by next.js and tailwind css using imdb database.

This is a Next.js project bootstrapped with create-next-app. Getting Started First, run the development server: npm run dev # or yarn dev Open http://

Dec 26, 2021

This app simulates a simple bookstore, and it was created using ReactJS and Redux.

Bookstore About The Bookstore is a website similar to the "Awesome Books" website built in the previous Microverse module (see live version). My goal

Oct 3, 2021

A Full Stack Amazon Clone which created using ReactJS with full E-Commerce Functionality!!

Amazon Clone with ReactJS A small web app that tries to imitate the desktop web version of amazon site, you can add items to the basket, delete them,

Oct 3, 2022

Auth model created by Using nodeJs for backend & reactJs for frontend with the help of TailwindCss in styling

Auth model created by Using nodeJs for backend & reactJs for frontend with the help of TailwindCss in styling

The Universal Auth System Using The MERN Stack Including Mysql -- The project is divded to two separte projects 1- The Client side - containing the

Aug 22, 2022

A hook based project created during 20-Dec week ReactJS workshop

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

Dec 25, 2021

A Tailwind plugin that allows to create multiple groups utilities such as group-card or group-1 and works with Tailwind 3 features and all variations.

Tailwind Labeled Groups A plugin that allows to create multiple groups utilities such as group-card or group-1 and works with Tailwind 3 features and

Oct 30, 2022

Getir.com-react-tailwind - Getir.com anasayfa react + tailwind front-end

Getir.com-react-tailwind - Getir.com anasayfa react + tailwind front-end

Getir.com React + Tailwind Front-end Bir gece uğraşı olarak getir.com'un anasayf

Nov 2, 2022

πŸ’…β€A ready-to-go with a well-thought-out structure Electron app boilerplate with ReactJS, TypeScript, CSS / SASS modules, SWC, Eslint, Prettier, GitHub Action releases and more.

πŸ’…β€A ready-to-go with a well-thought-out structure Electron app boilerplate with ReactJS, TypeScript, CSS / SASS modules, SWC, Eslint, Prettier, GitHub Action releases and more.

Electron App πŸ’…  A ready-to-go with a well-thought-out structure Electron app boilerplate with ReactJS, TypeScript, CSS / SASS modules, SWC, Eslint, P

Nov 24, 2022
Comments
  • Dark mode

    Dark mode

    The dark mode keyboard keys have the same color as none existing letters so the user can't see the difference between unused and used letters that doesn't exist in the word

    bug 
    opened by MahmoudFettal 0
Releases(v1.5.0)
Owner
Mahmoud Fettal
Microsoft learn student Ambassador | A Data Software Engineer student at INSEA
Mahmoud Fettal
A clone of the popular game Wordle made using React, Typescript, and Tailwind

Wordle Clone Go play the real Wordle here Read the story behind it here Try a demo of this clone project here Inspiration: This game is an open source

Hannah Park 2.3k Nov 24, 2022
Created by Hashlips! In this repository, Hashlips and ScrawnyViking teach you how to create your unique randomly generated NFTs and launch them on to a free Github Domain where people can buy your NFTs from

Thank You HashLips ?? Upgraded and Articulated by ScrawnyViking aka TWECryptoDev All the code in these repos was created and explained by HashLips - P

TomorrowWontExist 15 Oct 23, 2022
A checklist created for the online game Lost Ark

A checklist created for the online game Lost Ark. Create and complete daily/weekly tasks you assign to your characters!

null 5 May 24, 2022
Snake game using pure HTML, CSS and JavaScript with GameBoy look and feel using Nano editor

Snake game using pure HTML, CSS and JavaScript with GameBoy look and feel using Nano editor. 100% commented code in Portuguese

Gabriel Martins 2 Jul 2, 2022
The Snake Game implemented using HTML, CSS, and JavaScript

The Snake Game implemented using HTML, CSS, and JavaScript

Wissam Fawaz 3 Mar 2, 2022
A simple Sokoban game made in JavaScript + HTML + CSS

About Sokoban is a puzzle video game genre in which the player pushes crates or boxes around in a warehouse, trying to get them to storage locations.

Juan Manuel Flecha 4 May 24, 2022
Latin Wordle is a free and open-source project that aims to provide a fun and interactive way to learn Latin.

Latin Wordle Live Game Here Inspiration Latin Wordle is a free and open-source project that aims to provide a fun and interactive way to learn Latin.

null 16 Jul 1, 2022
Quizpetitive - A quiz game to learn new knowledge and terms in the field of project management.

Quizpetitive A quiz game to learn new knowledge and terms in the field of project management. The key element to the success of this project was the c

LMF 1 May 16, 2022
Wordle2Townscaper is meant to convert Wordle tweets into Townscaper houses using yellow and green building blocks.

Wordle2Townscaper Wordle2Townscaper is meant to convert Wordle tweets into Townscaper houses using yellow and green building blocks. You can download

Tarmo 66 Nov 2, 2022
GameApp is a web application that allow users to play nostalgic games such as minesweeper, flappybird, and space invasions.

GameApp is currently being developed. GameApp is a web application that allow users to play nostalgic games such as minesweeper, flappybird, and space

Stephanie Li 2 Feb 21, 2022