StayConnected 🌟

A modern Q&A platform built for knowledge sharing and community engagement

• ✨ Features
• 🛠 Tech Stack
• 🚀 Getting Started
• 🏗 Architecture
• 🤝 Contributing
• 👥 Team

✨ Features

🏠 Homepage

• Dynamic header with authentication state management
• Real-time questions feed
• Interactive leaderboard
• Dark/Light mode toggle

👤 User Authentication

• Registration
  • Default avatar assignment
  • Secure password handling
• Login
  • Email and password validation
  • Protected route handling
  • Seamless authentication flow

📝 Questions

• Create detailed questions with tags
• Rich text editing support
• Advanced search and filtering

• Tag-based categorization

💬 Answers

• Best answer highlighting
• Vote system for community feedback
• Like/upvote system

👑 Leaderboard System

• Point-based ranking
• Best answer rewards

👤 User Profiles

• Activity statistics (points)
• Question and answer history

🛠 Tech Stack

• Frontend Framework: React + TypeScript
• Build Tool: Vite
• Styling: Tailwind CSS + shadcn/ui
• State Management: Jotai
• Form Handling: React Hook Form + Zod
• API Communication: Axios + React Query
• Routing: React Router
• UI Components: shadcn/ui

👥 Team

Meet our amazing team of React developers:

@richi1213 React Developer

@sopo React Developer

@anijujunashvili React Developer

@tsamkharadze React Developer

🚀 Getting Started

1. Clone the repository

   git clone https://github.com/richi1213/stay-connected.git
   

2. Install dependencies

   cd stayconnected

3. Install dependencies

   npm install

4. Start the development server

   npm run dev

🏗 Architecture

Directory Structure

src/
├── components/         # Reusable UI components
├── features/          # Feature-specific components
├── hooks/            # Custom React hooks
├── lib/              # Utility functions
├── pages/            # Route components
├── services/         # API services
├── store/            # State management
└── types/            # TypeScript definitions

Key Components

Authentication Flow

graph LR
    A[Login/Register] --> B{Auth Check}
    B -->|Success| C[Protected Routes]
    B -->|Failure| D[Redirect to Home]

Loading

Data Flow

graph TD
    A[User Action] --> B[State Update]
    B --> C[API Call]
    C --> D[UI Update]

Loading

🙏 Acknowledgments

• shadcn/ui for the beautiful UI components
• Tailwind CSS for the utility-first CSS framework
• Vite for the blazing fast build tool

---

Made with ❤️ by the StayConnected Team