Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/ajaypatil1993/e-tutor-app-react
E-tutor App is an online e-learning platform built with React.js. It features interactive animations using Framer Motion, dynamic counting effects with Count-Up, and engaging carousels powered by React Slick for a rich content experience.
https://github.com/ajaypatil1993/e-tutor-app-react
animation css3 e-tutor framer-motion html5 mobile-first react-icons react-router react-slick react-slick-carousel reactjs responsive-design tailwindcss
Last synced: 7 days ago
JSON representation
E-tutor App is an online e-learning platform built with React.js. It features interactive animations using Framer Motion, dynamic counting effects with Count-Up, and engaging carousels powered by React Slick for a rich content experience.
- Host: GitHub
- URL: https://github.com/ajaypatil1993/e-tutor-app-react
- Owner: ajaypatil1993
- Created: 2024-10-27T20:57:11.000Z (4 months ago)
- Default Branch: main
- Last Pushed: 2024-10-27T21:06:02.000Z (4 months ago)
- Last Synced: 2024-12-20T05:42:48.550Z (2 months ago)
- Topics: animation, css3, e-tutor, framer-motion, html5, mobile-first, react-icons, react-router, react-slick, react-slick-carousel, reactjs, responsive-design, tailwindcss
- Language: JavaScript
- Homepage: https://e-tutor-app.netlify.app
- Size: 1.65 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# E-tutor App 📚💻
**E-tutor App** is an online e-learning platform created using React.js. It provides a modern, user-friendly interface for students to explore courses and access educational content, optimized for a seamless learning experience across devices.
## Screenshots 📸
### Desktop View:
### Mobile View:
### VS Code Editor View:
## Features ✨
- **Responsive Design**: Adjusted for a great user experience on mobile, tablet, and desktop devices.
- **Course Catalog**: A structured course directory allowing users to explore various topics.
- **Interactive UI Components**: Engaging animations and carousels enhance the user interface.
- **Animated Transitions**: Powered by **Framer Motion** for smooth and engaging transitions.
- **Counters**: Dynamic counters using **react-countup** to show key metrics like number of courses, instructors, and students.
- **Icons**: Beautiful icons integrated with **React Icons**.
- **Carousels**: Smooth product showcases using **React Slick** and **Slick Carousel**.
- **React and Tailwind CSS**: Combines React's component-based structure with Tailwind CSS's responsive styling.
- **User Authentication**: Supports secure login and signup features for personalized course access.## Tech Stack 🛠️










## Project Layout 🗂️
```bash
E-tutor-App/
│
├── public/
│ └── assets/
├── src/
│ ├── components/
│ ├── pages/
│ ├── styles/
│ ├── App.js
│ ├── index.js
│ └── ...
├── .gitignore
├── package.json
├── README.md
└── LICENSE
```- **`public/`**: Static assets like images.
- **`src/`**: Source files, including components, pages, and styles.
- **`App.js`**: Main app structure.
- **`components/`**: Reusable UI elements (e.g., navbar, footer, course cards).
- **`styles/`**: Tailwind CSS and custom styles.## Getting Started 🚀
### Prerequisites
- [Node.js](https://nodejs.org/) (version 14 or higher)
- [npm](https://www.npmjs.com/) (comes with Node.js)### Installation
1. **Clone the Repository**:
```bash
git clone https://github.com/your-username/e-tutor-app.git
cd e-tutor-app
```2. **Install Dependencies**:
```bash
npm install
```3. **Run the Development Server**:
```bash
npm start
```Open your browser and go to `http://localhost:3000` to view the app.
## Contributing 🤝
1. **Fork the Repository**
2. **Create a New Branch**:
```bash
git checkout -b feature/new-feature
```
3. **Commit Changes**:
```bash
git commit -m "Added new feature"
```
4. **Push to GitHub**:
```bash
git push origin feature/new-feature
```
5. **Open a Pull Request**.## Live Preview 🌐
You can check out the live version of **E-tutor App** at: [E-tutor App Live](https://e-tutor-app.netlify.app)
## Contact 📬
- **LinkedIn**: [Ajay Patil](https://www.linkedin.com/in/ajaypatil1993)
- **Email**: [[email protected]](mailto:[email protected])
- **GitHub**: [GitHub](https://github.com/ajaypatil1993)## License 📝
This project is licensed under the MIT License. See the [LICENSE](LICENSE) file for details.
## Acknowledgements 🙏
- 
- 
- 
- 
- 
- 
- 