Welcome to GifNinja, a modern web application for discovering and sharing GIFs. Built with React and Vite, GifNinja provides an engaging interface to browse trending GIFs, view individual GIF details, and manage your favorite GIFs.
- Trending GIFs: Browse the latest trending GIFs with a clean and responsive interface.
- GIF Details: View detailed information about each GIF, including its source and creator.
- Favorites: Add GIFs to your favorites for easy access later.
- Related GIFs: Discover related GIFs based on the one you're currently viewing.
- Responsive Design: Optimized for both desktop and mobile views.
- React: JavaScript library for building user interfaces.
- Vite: Fast build tool and development server for modern web projects.
- Giphy API: API used to fetch GIFs.
- React Router: Library for handling routing in the application.
- React Icons: Library for using popular icons in the project.
To get started with GifNinja, follow these steps:
- Node.js (v14 or higher)
- npm or yarn
-
Clone the repository:
git clone https://github.com/swappy-2003/GifNinja.git
-
Navigate to the project directory:
cd GifNinja
-
Install the dependencies:
npm install
-
Set up environment variables:
Create a .env file in the root directory and add your Giphy API key:
VITE_GIPHY_KEY=your_giphy_api_key
-
Run the development server:
npm run dev
Building for Production
To create a production build, run:
```bash
npm run build
The production files will be generated in the dist directory. Folder Structure public/: Contains static assets like images and the favicon.
src/: Contains the source code for the application.
components/: Reusable React components.
Context/: React context for managing global state.
pages/: React components for different pages of the application.
vite.config.js: Vite configuration file.
index.html: The main HTML file.
Contributing
Contributions are welcome! Please follow these guidelines:
Fork the repository.
Create a new branch for your feature or fix.
Make your changes and commit them.
Open a pull request describing your changes.
License
This project is licensed under the MIT License. See the LICENSE file for details.
Contact
For any questions or feedback, feel free to reach out:
GitHub Issues
[email protected]