Skip to content

DemonDaddy22/all-about-reactJS

Repository files navigation

All About ReactJS

All Contributors Last Commit Repo Size Open Issues Pull Requests Workflow Status


If you want to contribute to this project, consider reading the CONTRIBUTING.md first to get a better idea of how to contribute to this repo.


I'll be working on 20 different ReactJS projects over the next 50 days. I would also be deploying all the projects so that it is easy to visualize the projects.

  1. TodoApp  ☑: A responsive ToDo app with functionalities of adding new todos, editing, and deleting existing todos. Also, data persistence is achieved by storing the todos in the browser's localStorage.

  2. Pricing Cards  💸: A responsive imitation of pricing cards. Also, introduced a dark theme, where text colors and background colors are changed based on the theme activated.

  3. Calculator  ➕➖: A responsive calculator that performs basic mathematical operations. Made use of eval (not recommended) to evaluate the expression string.

  4. Color Picker  🎨: A responsive color picker which allows user to select a color from a randomly generated color palette, or choose a color of choice which gets set as the background color of the header. Implemented various color util methods to help create this exercise.

  5. GitHub Profile Viewer  🙋: A responsive GitHub Profile Viewer which clones the view of searched user's GitHub profile by listing his/her profile details and repo summaries. Made use of GitHub API to fetch details of the searched user.

  6. Stone-Paper-Scissor  ✂: A responsive Stone-Paper-Scissor game built using React Hooks. The score is persisted using the browser's localStorage.

  7. Password Generator  🔐: A responsive password generator that allows the user to generate a password of specified length containing a random sequence of lowercase, uppercase, numeric or special characters. The user can also click on the generated password to copy it to the clipboard.

  8. Random Jokes  😹: A responsive random jokes app which renders random jokes fetched using the icanhazdadjoke API. User can like and copy the joke, and the liked jokes can also be easily accessed from a dedicated Liked Jokes section.

  9. Hover Board  🚥: A responsive hover board which consists of several small square-shaped cells, where each square lights up whenever it is hovered upon. The user can also click any square to lock the color of that cell and click again to unlock it.

  10. Key Code Sequence  ⌨: A response key code sequence generator which displays the code, key, keycode, which (deprecated) of the pressed key.

  11. Random Quotes  💭: A responsive random quotes app which renders random jokes fetched using the api.quotable.io API. This app also makes use of infinite scrolling to fetch more quotes whenever a user scrolls to the bottom of the page.

  12. Carousel  🎠: A simple and responsive image carousel which creates a controlled slideshow of images. The users can move between the images using the control buttons provided. An advanced and modern looking version of the carousel will be added in the future.

  13. Meal Generator  🍲: A responsive random meal generator which uses Themealdb.com API to fetch random meal recipes. Each fetched recipe not only contains a list of ingredients and instructions, but also links to YouTube video and source of the post.

  14. Bill Generator  💰: A responsive bill generator which displays an arbitrary taco menu, and a user can select different quantities of tacos, sides and add-ons. Based upon the items selected, the bill gets generated dynamically.

  15. Form with Validations  ⛔: A responsive form with validations which validates user's input responses. It is just a template form which doesn't store any information entered by the users.

  16. Alternate Grid  💢: A responsive alternate grid which displays an alternate ordered grid where one of the cells, in every row, contains some text information, and the other cell contains an image.

  17. Pokédex  📱: A responsive Pokédex which uses Pokeapi and is inspired by Pokedex.org. The user can search for the desired Pokémon using Pokémon's index or name and basic stats and info of the fetched Pokémon are then displayed.

  18. Twitter UI clone  🐦: A responsive Twitter UI Clone which clones the UI of Twitter feed to some extent. It's a simple UI clone of the feed, so none of the functionalities like liking, retweeting, etc. have been provided.

  19. Voting Poll  ✍: A responsive voting poll which lets user vote for an option from a set of options.

  20. Skeleton Loader  💬: A responsive skeleton loader which serves as a skeleton placeholder for the content. Used JSON Placeholder API and UI Faces for fetching mock content.


Contributors ✨

Thanks goes to these wonderful people (emoji key):


Rohan Gupta

💻 🤔 📖 👀

Vineet Nilawar

📖

Jaikishan

💻

Dipendra Neupane

📖

Ritika0126

📖

Aqsa Umar

📖

Mustafa Masvi

📖

phanlyhuynh

💻

This project follows the all-contributors specification. Contributions of any kind welcome!

About

I'll be working on 20 different ReactJS projects over the course of 60 days and try to create mobile-first, light and dark themed apps out of them.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published