Skip to content

README.md

Latest commit

 

History

History
104 lines (84 loc) · 2.89 KB

README.md

File metadata and controls

104 lines (84 loc) · 2.89 KB

GitHub Tutorial Platform

An interactive platform for learning Git and GitHub through hands-on tutorials.

Features

Implemented

  • 🔐 Authentication with email/password
  • 🌓 Dark/light theme support
  • 👤 User profiles with display name customization
  • 📚 Tutorial listing and viewing
  • 🔒 Protected routes for authenticated content
  • 🎨 Responsive design with Tailwind CSS
  • 🔥 Real-time Firebase integration
  • ⚡ Built with Next.js 13 App Router

Coming Soon

  • 🔄 OAuth authentication (GitHub, Google)
  • 📧 Password reset functionality
  • 📱 Profile picture uploads
  • 🏷️ Tutorial filtering and search
  • 📊 Progress tracking
  • ⭐ Tutorial bookmarking
  • 💳 Premium subscriptions
  • 📱 Offline support

Tech Stack

  • Frontend: Next.js 13, React, TypeScript
  • Styling: Tailwind CSS
  • Authentication: Firebase Auth
  • Database: Firestore
  • State Management: React Query, Zustand
  • UI Components: Headless UI
  • Icons: Heroicons

Getting Started

Prerequisites

  • Node.js 16.8 or later
  • npm or yarn
  • Firebase account

Installation

  1. Clone the repository:
git clone https://github.com/yourusername/github-tutorial-platform.git
  1. Install dependencies:
npm install
  1. Create a .env.local file with your Firebase configuration:
NEXT_PUBLIC_FIREBASE_API_KEY=your_api_key
NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=your_auth_domain
NEXT_PUBLIC_FIREBASE_PROJECT_ID=your_project_id
NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=your_storage_bucket
NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=your_messaging_sender_id
NEXT_PUBLIC_FIREBASE_APP_ID=your_app_id
  1. Start the development server:
npm run dev

Project Structure

src/
├── app/                 # Next.js 13 app directory
├── components/          # React components
│   ├── auth/           # Authentication components
│   ├── home/           # Homepage components
│   ├── layout/         # Layout components
│   ├── profile/        # Profile components
│   ├── providers/      # Context providers
│   ├── theme/          # Theme components
│   ├── tutorials/      # Tutorial components
│   └── ui/             # Shared UI components
├── lib/                # Utility functions
│   ├── firebase/       # Firebase configuration
│   ├── hooks/          # Custom hooks
│   └── utils/          # Helper functions
├── stores/             # State management
└── types/              # TypeScript types

Contributing

  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.