Full-Stack•Social-Learning•EdTech
KlasMwen
Educational Social Platform
Overview
KlasMwen is a modern educational social platform built to centralize student collaboration and encourage community-based learning.
Motivation
I wanted to challenge myself by building a full-featured social platform from scratch. Instead of cloning an existing platform, I chose an educational context to explore real-world features like file sharing, moderation, and structured discussions.
Approach
I designed and built an end-to-end system with posting, comments, reactions, file uploads, and moderation workflows, focusing on clean architecture, type safety, and maintainability.
Technologies
ViteReactTypeScriptTailwindshadcn/uiZustandAxiosReact QueryReact Hook FormMarkdown EditorZodSocket.ioNode.jsExpressPassport.jsPinoSwaggerPrismaPostgreSQLCloudinary
Highlights
- Full social learning platform with posts, comments, bookmarks, and reactions
- Real-time notifications using WebSockets
- Robust authentication with JWT, role-based access control, and secure sessions
- Built-in safety & moderation system with user reporting and admin dashboards
- Advanced file sharing with Cloudinary storage and automatic metadata extraction
- End-to-end validation and rate limiting to prevent abuse and ensure data integrity
- High-performance UX with server-state caching, optimistic updates, and debounced search
Challenges
- Keeping UI state in sync with server updates
- Managing file uploads and downloads efficiently
- Designing scalable posting & commenting structures
- Ensuring relational consistency across posts, comments, reactions, and bookmarks
- Maintaining consistent type-safety across client, server, and database layers
- Keeping frontend components modular and the backend codebase cleanly organized
Lessons Learned
- Implementing complex file upload and moderation workflows
- Structuring and maintaining a large full-stack codebase cleanly
- Strengthening end-to-end type safety using TypeScript and Zod across API layers
- Documenting REST APIs with Swagger / OpenAPI for clarity and maintainability
- Setting up scalable backend logging and error tracing using Pino
- Designing and implementing real-time features using WebSockets (Socket.IO)
Future Improvements
- Group Chats & Study Circles
- Complete Admin Dashboard for moderation and user management
Interested in this project?
Check out the live demo or explore the repository.