Code Monkey home page Code Monkey logo

lokeshwar777 / loki-react-redux-learning Goto Github PK

View Code? Open in Web Editor NEW
1.0 1.0 0.0 464 KB

In this React learning space, delve into projects crafted with Vite, Tailwind CSS, React, and Redux Toolkit. Explore the synergy of these cutting-edge technologies as you deepen your understanding of React concepts through practical implementation.

License: MIT License

JavaScript 88.87% HTML 3.89% CSS 7.24%
javascript reactjs redux redux-toolkit tailwindcss vite nodejs

loki-react-redux-learning's Introduction

Loki React Projects

Welcome to my repository of React projects! Each project in this repository is dedicated to exploring and implementing different React concepts.

Projects

  • React Counter Using Hooks: A project showcasing the implementation of React hooks for state management. It includes features for incrementing and decrementing a counter.

  • React Magic Color Changer: A project featuring a background color changer using React's state management. Users can experience a visually appealing color transition.

  • React Props and Tailwind CSS: A project demonstrating the use of React props for component customization and styling using the Tailwind CSS framework.

  • Password Generator: A React-based application for generating secure passwords with customizable options. It utilizes hooks such as useState, useEffect, and useRef for password generation.

  • Currency Converter: A React project enabling users to convert currency values with ease. It includes components like InputBox, a custom hook (useCurrencyInfo) for fetching currency information, and the main App component.

  • React Router Project: A dynamic, multi-page application showcasing the implementation of React Router. Components include Layout, Home, About, Contact, User, and Github, managed using React Router's Outlet.

  • Theme Switcher: A React-based application allowing users to toggle between light and dark themes. Key files include Card.jsx (example card), ThemeBtn.jsx (toggle switch), and App.jsx (main component with ThemeProvider).

  • Simple Todo Management: An easy-to-use TODO management system with features like adding, editing, and deleting tasks. Components include TodoForm, TodoItem, and TodoContext, utilizing React Context for state management.

  • Redux Todo Management: A Redux-powered TODO management application offering efficient state management. Components include AddTodo, Todos, and todoSlice.js, providing features for adding and removing todos.

Getting Started

For each project, refer to the respective README.md file for detailed instructions on how to run and explore the project locally.

Contribute to the Project

This project is open for contributions, and your input is highly valued. If you encounter any issues or have ideas for improvements, please feel free to contribute. Follow the steps below to get started:

  1. Fork the repository to your GitHub account.

  2. Clone the forked repository to your local machine:

git clone https://github.com/your-username/loki-react.git
cd loki-react
  1. Create a new branch for your contribution:
git checkout -b feature/your-feature
  1. Make your changes and commit them:
git add .
git commit -m "Add your concise commit message"
  1. Push your changes to your forked repository:
git push origin feature/your-feature
  1. Create a pull request from your branch to the main repository.

Issues

If you come across any issues or have suggestions, please create an issue.

Credits

Projects inspired by the "Chai aur react" Playlist from Chai aur Code.

License

This repository is licensed under the MIT License.

loki-react-redux-learning's People

Contributors

lokeshwar777 avatar

Stargazers

 avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.