Skip to content

An interactive web application for exploring learning techniques with visualizations, quizzes, and detailed explanations. Built with Next.js, TypeScript, and Tailwind CSS.

Notifications You must be signed in to change notification settings

k6w/learning-hub

Repository files navigation

Basic Learn - Interactive Learning Techniques

An interactive web application designed to help users explore and understand various learning techniques through visualizations, quizzes, and detailed explanations. Built with modern web technologies to provide an engaging educational experience.

Features

  • Interactive Charts: Visualize learning curves and effectiveness using Chart.js
  • Comprehensive Lessons: Detailed content on various learning techniques
  • Technique Finder: Search and discover learning methods suited to your needs
  • Multilingual Support: Available in English and Romanian
  • Responsive Design: Optimized for desktop and mobile devices
  • Dark/Light Theme: Toggle between themes for comfortable reading

Tech Stack

  • Framework: Next.js 15 with App Router
  • Language: TypeScript
  • Styling: Tailwind CSS
  • Charts: Chart.js with React Chart.js 2
  • Internationalization: next-i18next
  • UI Components: Radix UI primitives
  • Icons: Lucide React

Getting Started

Prerequisites

  • Node.js 18+
  • npm, yarn, pnpm, or bun

Installation

  1. Clone the repository:
git clone https://github.com/k6w/learning-hub.git
cd learning-hub
  1. Install dependencies:
npm install
# or
yarn install
# or
pnpm install
  1. Run the development server:
npm run dev
# or
yarn dev
# or
pnpm dev
  1. Open http://localhost:3000 in your browser.

Project Structure

src/
├── app/                 # Next.js app router pages
├── components/          # Reusable React components
│   ├── ui/             # UI component library
│   └── ...             # Feature-specific components
├── data/               # Static data and content
├── lib/                # Utility functions and configurations
└── types/              # TypeScript type definitions

Available Scripts

  • npm run dev - Start development server
  • npm run build - Build for production
  • npm run start - Start production server
  • npm run lint - Run ESLint

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

  1. Fork the repository
  2. Create your feature branch (git checkout -b feature/amazing-feature)
  3. Commit your changes (git commit -m 'Add some amazing feature')
  4. Push to the branch (git push origin feature/amazing-feature)
  5. Open a Pull Request

License

This project is licensed under the MIT License - see the LICENSE file for details.

Acknowledgments

About

An interactive web application for exploring learning techniques with visualizations, quizzes, and detailed explanations. Built with Next.js, TypeScript, and Tailwind CSS.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published