This project is a simple theme switcher React app that allows users to toggle between light and dark themes. It employs React Context API for managing theme states and utilizes Tailwind CSS for styling.
This repository contains a React-based theme switcher app built to showcase the usage of React Context API for managing themes. The app includes components such as ThemeBtn for toggling themes and an App component that manages the theme mode using Context API.
- Toggle between light and dark themes
- ThemeBtn component for switching themes
- Context API usage for managing theme states
The project directory structure is organized as follows:
themeSwitcher/
├── src/
│ ├── components/
│ │ ├── ThemeBtn.jsx
│ │ ├── Card.jsx
│ ├── contexts/
│ │ ├── theme.js
│ ├── App.jsx
│ ├── main.jsx
│ ├── index.css
├── package.json
├── package-lock.json
└── README.md
-
Clone the repository:
git clone https://github.com/mustafa854/react-currency-converter.git cd simpleCurrencyConverter
-
Install dependencies:
npm install
-
Start the development server:
npm start
-
Open your browser and go to
http://localhost:3000
to view the application. -
Clone the repository:
git clone https://github.com/mustafa854/theme-switcher.git cd simpleCurrencyConverter
-
Install dependencies:
npm install
-
Start the development server:
npm start
-
Open your browser and go to
http://localhost:3000
to view the application. -
Enter the amount, select the currencies, and click 'Convert' to see the converted amount.
- React
- Axios
- Tailwind CSS
- React
- Tailwind CSS