This project is a simple React application that allows users to take selfies using their device's camera, mirror the captured image, and store the selfies locally. It utilizes the localforage library to store the selfie images in IndexedDB, providing a way to access and manage previous selfies.
To run the React Selfie App, follow these steps:
- Clone this repository to your local machine.
git clone <repository-url>
- Install the dependencies using npm or yarn.
cd react-selfie-app
npm install
- Start the development server.
npm run dev
- Open your web browser and navigate to localhost:port to access the app(you'll see the port in your terminal).
- Take a selfie using the device's camera.
- Toggle the mirror effect to flip the image horizontally.
- Store the captured selfie locally using localforage and IndexedDB.
- View the captured selfie on the app interface.
- Delete previous selfies from the storage.
- Open the React Selfie App in your web browser.
- Allow the app to access your device's camera.
- Use the "Take Selfie" button to capture a selfie.
- Toggle the "Enable Mirror" button to apply the mirror effect.
- The captured selfie will be displayed on the app interface.
- Previous selfies, if available, will be listed below the camera preview.
- Use the "Delete" button next to each previous selfie to remove it from storage.
The React Selfie App uses the following dependencies:
- React: A JavaScript library for building user interfaces.
- React DOM: Provides DOM-specific methods that can be used at the top level of your app.
- localforage: A library that provides a simple API to store data in IndexedDB.
This app uses the localforage library to store the selfies in the browser's IndexedDB, which means the selfies will persist even if you close the app or refresh the page. The app uses modern React hooks and functional components for its implementation.
This project is licensed under the MIT License - see the LICENSE file for details.
The original project's code and design remain unchanged. This modified content of the readme provides an overview of the React Selfie App and its features. For detailed information, the user can refer to the original documentation and code.