This repo contains a handful of small React projects that I've been working on.
This project allows users to add and remove birthdays from a list. The project uses the useState hook to store the list of birthdays in memory. Users can clear the list by clicking the "Clear All" button.
This project allows users to view a list of tours . The project uses the useState hook to store the list of tours in memory. Users can read the description of each tour by clicking on the Read More button. If not interested in, a particular tour can be removed by clicking on Not Interested.
This project allows users to view a list of reviews for a product. User can read other reviews by clicking on the Next or Previous button. Clicking on Surprise Me gives a random review.
This project allows users to view a list of FAQs and expand the sections to view the answers. Users can expand a section by clicking the "+" button next to the section title.
This project allows users to view a list of menu items. Users can also choose items from different categories.
This project allows users to view a list of tabs and switch between them. Users can switch to a different tab by clicking on the tab title.
It is basically a slider component. New slide appear automatically after 3 seconds. User can also change slides manually by clicking on the Next or Previous button .
This project generates Lorem Ipsum text. Users can enter the number of paragraphs and click on Generate to generate text blocks.
This project generates a random color. The project uses the useState hook to store the random color in memory. The color is generated by calling the generateColor() function, which is defined in the ColorGenerator.js file.
This project allows users to create a grocery list and add items to it. The project uses the useState hook to store the grocery list in memory. Users can add an item to the grocery list by entering the item name in the input field and clicking the "Add Item" button.
This project creates a simple navbar with links to different pages. The project uses the useState hook to store the active page in memory. Users can navigate to a different page by clicking on the corresponding link in the navbar.
This project creates a simple sidebar with links to different pages. The project uses the useState hook to store the active page in memory. Users can navigate to a different page by clicking on the corresponding link in the sidebar.
This project uses the Strapi CMS to create a set of submenus. The project uses the useState hook to store the list of submenus in memory. The submenus are created by calling the createSubmenus() function, which is defined in the StrapiSubmenus.js file.
This project allows users to add items to a cart and checkout. The project uses the useState hook to store the cart in memory. Users can add an item to the cart by entering the item name and quantity in the input fields and clicking the "Add Item" button. Users can checkout by clicking the "Checkout" button.
Clubhouse Cocktail" is a vibrant and engaging website designed to bring cocktail enthusiasts together in a virtual space. Featuring a curated collection of cocktail recipes, mixology tips, and interactive forums, this platform encourages users to explore and share their love for mixology.
Take a look at it
"Markdown Preview Online" is a convenient and user-friendly web application that allows users to create, edit, and preview Markdown documents in real-time. With a clean and intuitive interface, this tool makes it easy for writers, bloggers, and developers to format text, add images, create lists, and more using Markdown syntax.
Take a look at it
You can run the projects by cloning the repo and then running the following commands in the project directory:
npm install
npm startThis will start a development server on port 3000. You can then open the project in your browser by visiting http://localhost:3000.
Make sure to import the main file (a file that contains 'source' in its name) and the css file from the corresponding project in index.js.
If you'd like to contribute to the projects, please fork the repo and then submit a pull request.
Thanks for checking out my projects! Don't forget to drop a star ⭐.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent