Frontend application for GuidWay, a mentoring marketplace platform where users can discover mentors, book mentorship sessions, communicate in real-time, and manage their learning journey through a modern and responsive user interface.
Built with React.js, TypeScript, and modern frontend architecture practices focused on scalability, performance, and maintainability.
GuidWay is a marketplace platform connecting mentors and learners through an interactive and seamless experience.
This frontend application provides:
- Modern responsive UI
- Mentor discovery experience
- Authentication workflows
- Session booking interfaces
- Real-time communication UI
- Video session integration
- Dashboard management
- Profile management
- Marketplace browsing experience
https://github.com/Aswinkl1/Guidway-backend
https://github.com/Aswinkl1/guidway-frontend
- React.js
- TypeScript
- Tailwind CSS
- Redux Toolkit / Context API
- Axios
- React Query (if applicable)
- JWT Authentication
- Google OAuth
- Protected Routes
- Responsive Design
- Modern Component Architecture
- Reusable UI Components
- Loading & Error States
- ESLint
- Prettier
- TypeScript Strict Mode
- User registration & login
- Google OAuth login
- Protected routes
- Secure token handling
- Browse mentors
- Search & filtering
- Mentor profile pages
- Session booking interface
- Profile management
- Booking management
- Session tracking
- Real-time chat UI
- Video session support
- Notifications
- Fully responsive layout
- Optimized performance
- Clean UI/UX
- Reusable component system
guidway-frontend/
│
├── public/ # Static assets
├── src/
│ ├── app/ # App router pages
│ ├── components/ # Reusable components
│ ├── features/ # Feature modules
│ ├── services/ # API services
│ ├── hooks/ # Custom hooks
│ ├── store/ # State management
│ ├── utils/ # Utility functions
│ └── styles/ # Global styles
│
├── package.json
├── tsconfig.json
└── vite.config.jsThe structure may evolve as the application grows.
The frontend follows a scalable and modular architecture approach.
- Component reusability
- Separation of concerns
- Scalable folder structure
- Type-safe development
- API abstraction
- Maintainable UI patterns
git clone https://github.com/Aswinkl1/guidway-frontend.gitcd guidway-frontendUsing pnpm:
pnpm installCreate a .env.local file in the root directory.
Example:
VITE_PUBLIC_API_URL=
VITE_PUBLIC_GOOGLE_CLIENT_ID=Add all required environment variables based on your local setup.
pnpm devpnpm buildpnpm start| Script | Description |
|---|---|
pnpm dev |
Run development server |
pnpm build |
Build application |
pnpm start |
Start production server |
pnpm lint |
Run linting |
pnpm type-check |
Run TypeScript checks |
The frontend communicates with the backend REST API for:
- Authentication
- Mentor management
- Session booking
- Messaging
- Notifications
- User management
https://github.com/Aswinkl1/Guidway-backend
The application is designed with focus on:
- Responsive design
- Accessibility
- Clean layouts
- Smooth user flows
- Marketplace-style experience
- Performance optimization
This frontend architecture supports future scaling through:
- Modular component system
- Reusable hooks
- API abstraction layers
- Centralized state management
- Type-safe development
- Feature-based organization
Potential future enhancements:
- Dark mode
- Advanced mentor recommendation system
- Real-time notifications
- Progressive Web App (PWA)
- AI-powered mentor matching
- Calendar integrations
- Multi-language support
- Better analytics dashboards
Frontend (React.js)
↓
REST API (Express.js Backend)
↓
PostgreSQL + Redis
Developed by Aswinkl1
GitHub: https://github.com/Aswinkl1