This is a simple React sidebar navigation component that utilizes the React Router library for routing and Framer Motion for animation.
- Responsive sidebar navigation with collapsible menu items
- Dynamic routing using React Router
- Smooth animation effects using Framer Motion
- Customizable icons for menu items
- Supports nested sub-routes
-
Clone the repository:
git clone https://github.com/kit0-0/React_AnimatedSidebar.git -
Change to the project directory:
cd your-repo -
Install the dependencies:
npm install -
Start the development server:
npm start -
Open your browser and visit
http://localhost:3000to see the application.
-
Modify the
routesarray in theSidebar.jsfile to define your desired navigation links and icons. -
Customize the styling of the sidebar by modifying the CSS styles in the
Sidebar.cssfile. -
Add additional components and routes to your application as needed.
- React
- React Router
- Framer Motion
Contributions are welcome! If you find any bugs or have suggestions for improvements, please open an issue or submit a pull request.
This project is licensed under the MIT License.