Design and implement an engaging, interactive web interface for your personal tutor! Build a responsive chat interface with real-time updates that offers personalized academic support powered by DeepSeek via the OpenAI SDK. Combine thoughtful design with tutoring insights to create an educational experience that connects students with expert guidance.
Overview
Syllabus
- Unit 1: Building a Basic Tutor Interface with ASP.NET Core Razor Pages
- Basic Tutor Interface Setup with ASP.NET Core Razor Pages
- Personal Tutor Chat Interface with ASP.NET Core Razor Pages
- Implement Chat Interaction in Personal Tutor Interface
- Enable Enter Key Message Submission
- New Session Chat Reset Functionality
- Unit 2: Integrating API Requests for Dynamic Tutor Interaction with ASP.NET Core
- Implement Session Tracking and startNewSession Fetch Logic
- Implement sendQuery Function with Fetch API
- Unit 3: Simplifying User Input with Query Suggestions in ASP.NET Core Razor Pages
- Add Study Schedule Suggestion Button to Chat Interface
- Enable Study Schedule Suggestion Button Functionality
- Update Study Schedule Prompt to Conversational Tone
- Add Explain a Concept and Practice Exercises Suggestion Buttons
- Unit 4: Styling the Personal Tutor Interface with CSS in ASP.NET Core Razor Pages
- Enable Static Files and Basic Interface Styling
- Center and Style Suggestion Buttons with Flexbox
- Responsive Chat Container Styling
- Style Chat Input Area Using Flexbox