Introduction · Features · Tech Stack · Getting Started · Folder Structure · Contributing
KidneyInsight is a web-based educational platform designed to make learning about the complex processes of kidney function regulation engaging and intuitive. Through a combination of interactive animations, detailed diagrams, and clear explanations, this application demystifies the vital roles of the kidneys in maintaining homeostasis.
Our goal is to provide a visually appealing and user-friendly experience for students, educators, and anyone curious about human biology.
- Interactive Animations: Visualize complex biological processes like the RAAS system and hormonal regulation with dynamic animations.
- Detailed Diagrams: Explore high-quality, zoomable diagrams of the kidney, nephron, and juxtaglomerular apparatus.
- Step-by-Step Explanations: Follow a structured learning path that breaks down complex topics into manageable sections.
- Responsive Design: Enjoy a seamless experience on any device, from desktops to smartphones.
- Modern UI/UX: A clean, dark-themed interface with smooth transitions and engaging micro-interactions.
- React: A JavaScript library for building user interfaces.
- TypeScript: A typed superset of JavaScript that compiles to plain JavaScript.
- Tailwind CSS: A utility-first CSS framework for rapid UI development.
- Vite: A fast build tool and development server.
- Framer Motion: For animations and page transitions.
- Wouter: A minimalist routing library for React.
- Shadcn/UI: A collection of reusable UI components.
To get a local copy up and running, follow these simple steps.
- Node.js (v18 or higher)
- npm or yarn
-
Clone the repository:
git clone https://github.com/faiz4sure/temp.git cd temp
-
Install dependencies:
npm install
-
Run the development server:
npm run dev
This will start the application on
http://localhost:5000
.
The project is organized into the following structure:
client/
: Contains the React application.src/components/
: Reusable UI components.src/pages/
: Individual pages of the application.public/assets/
: Images, videos, and other static assets.
Contributions are what make the open-source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.
If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement".
- Fork the Project
- Create your Feature Branch (
git checkout -b feature/AmazingFeature
) - Commit your Changes (
git commit -m 'Add some AmazingFeature'
) - Push to the Branch (
git push origin feature/AmazingFeature
) - Open a Pull Request
Made with ❤️ by faiz4sure