2026-04-26 18:39:09 +09:00
<!doctype html>
< html lang = "ko" >
< head >
< meta charset = "utf-8" / >
< meta name = "viewport" content = "width=device-width, initial-scale=1" / >
< title > Tutor Platform< / title >
< link rel = "stylesheet" href = "/assets/styles.css" / >
< / head >
< body >
2026-04-27 14:28:09 +09:00
< script >
window._tutorGoogleCallback = null;
window._tutorPendingGoogleResponse = null;
window.handleCredentialResponse = function(response) {
if (window._tutorGoogleCallback) {
window._tutorGoogleCallback(response);
} else {
window._tutorPendingGoogleResponse = response;
}
};
< / script >
2026-04-27 13:23:47 +09:00
< script src = "https://accounts.google.com/gsi/client" async defer > < / script >
2026-04-27 14:20:18 +09:00
< section id = "login-view" class = "login-view" >
< div class = "login-card" >
< p class = "eyebrow" > Tutor Platform< / p >
< h1 > Interview practice< / h1 >
< p class = "lede" > Prove you are becoming more interview-ready after each short practice loop.< / p >
2026-04-27 14:28:09 +09:00
< div class = "login-divider" data-label = "Account" > < / div >
2026-04-27 14:20:18 +09:00
< div id = "auth-area" class = "auth-area" >
< div id = "g_id_onload" data-client_id = "13671390758-bp1ed6psn43bl86r8a9kv81o40nkea90.apps.googleusercontent.com" data-callback = "handleCredentialResponse" data-auto_prompt = "false" > < / div >
< div class = "g_id_signin" data-type = "standard" data-size = "large" data-theme = "outline" data-text = "sign_in_with" data-shape = "rectangular" data-logo_alignment = "left" > < / div >
< / div >
2026-04-27 14:28:09 +09:00
< p id = "login-error" class = "login-error" role = "alert" > < / p >
< p class = "login-legal" > By signing in, you agree to our < a href = "#" > Terms< / a > and < a href = "#" > Privacy Policy< / a > .< / p >
2026-04-27 14:20:18 +09:00
< / div >
< / section >
< main id = "workspace-view" class = "workspace" style = "display:none;" >
2026-04-26 18:39:09 +09:00
< aside class = "setup-pane" aria-label = "Diagnostic setup" >
< p class = "eyebrow" > Tutor Platform< / p >
< h1 > Interview practice< / h1 >
< p class = "lede" > Start a focused backend interview loop and turn one answer into evidence.< / p >
2026-04-27 14:20:18 +09:00
< div class = "user-bar" >
< div id = "user-info" class = "user-info" > < / div >
< button id = "logout-button" class = "small-button" type = "button" > Sign out< / button >
2026-04-27 13:23:47 +09:00
< / div >
2026-04-26 18:39:09 +09:00
< form id = "session-form" class = "stacked-form" >
< label >
User ID
< input id = "user-id" name = "user_id" value = "demo-user" autocomplete = "off" / >
< / label >
< label >
Target role
< input id = "target-role" name = "target_role" value = "junior backend developer" / >
< / label >
< label >
Stack
< input id = "stack" name = "stack" value = "go, postgres" / >
< / label >
< label >
Timeline
< input id = "timeline" name = "interview_timeline" value = "30 days" / >
< / label >
2026-04-27 11:33:20 +09:00
< button id = "start-button" type = "submit" >
< span class = "btn-text" > Start diagnostic< / span >
< span class = "btn-spinner" aria-hidden = "true" > < / span >
< / button >
2026-04-26 18:39:09 +09:00
< / form >
2026-04-27 11:33:20 +09:00
< p id = "status-line" class = "status-line" role = "status" >
< span class = "status-icon" aria-hidden = "true" > < / span >
< span class = "status-text" > Ready< / span >
< / p >
2026-04-26 18:39:09 +09:00
< p id = "error-line" class = "error-line" role = "alert" > < / p >
< / aside >
< section class = "practice-pane" aria-label = "Diagnostic practice" >
< div class = "section-heading" >
2026-04-27 11:33:20 +09:00
< div >
< p class = "eyebrow" > Diagnostic< / p >
< h2 id = "session-title" > No active session< / h2 >
< / div >
2026-04-26 18:39:09 +09:00
< / div >
< div id = "questions" class = "question-list empty-state" >
2026-04-27 11:33:20 +09:00
< span class = "empty-hint" > Start a diagnostic session to load interview questions.< / span >
2026-04-26 18:39:09 +09:00
< / div >
< form id = "answer-form" class = "answer-form" >
< label for = "answer-text" > Answer< / label >
< textarea id = "answer-text" rows = "7" placeholder = "Select a question, then answer with concrete production reasoning." > < / textarea >
2026-04-27 11:33:20 +09:00
< button id = "answer-button" type = "submit" disabled >
< span class = "btn-text" > Submit answer< / span >
< span class = "btn-spinner" aria-hidden = "true" > < / span >
< / button >
2026-04-26 18:39:09 +09:00
< / form >
2026-04-26 18:52:16 +09:00
< section class = "content-workspace" aria-label = "Material and asset workspace" >
< div class = "section-heading" >
< div >
< p class = "eyebrow" > Content operations< / p >
< h2 > Source to asset prompt< / h2 >
< / div >
< / div >
< form id = "material-form" class = "material-form" >
< label >
Material title
< input id = "material-title" value = "Backend interview notes" / >
< / label >
< label >
Source type
< input id = "material-source" value = "markdown" / >
< / label >
< label class = "wide-field" >
Source material
< textarea id = "material-body" rows = "5" > Idempotent API retries need transactions. Cache invalidation uses TTL tradeoffs and database indexes support query plans.< / textarea >
< / label >
2026-04-27 11:33:20 +09:00
< button id = "material-button" type = "submit" >
< span class = "btn-text" > Ingest material< / span >
< span class = "btn-spinner" aria-hidden = "true" > < / span >
< / button >
2026-04-26 18:52:16 +09:00
< / form >
< div id = "ontology" class = "ontology-view empty-state" >
2026-04-27 11:33:20 +09:00
< span class = "empty-hint" > Ingest material to inspect ontology candidates.< / span >
2026-04-26 18:52:16 +09:00
< / div >
< form id = "asset-form" class = "asset-form" >
< label >
Concept
2026-04-27 11:33:20 +09:00
< select id = "asset-concept" disabled >
< option value = "" > Select a concept< / option >
< / select >
2026-04-26 18:52:16 +09:00
< / label >
< label >
Asset type
< select id = "asset-type" >
< option value = "diagram" > Diagram< / option >
< option value = "lesson_slice" > Lesson slice< / option >
< option value = "worksheet" > Worksheet< / option >
< option value = "interview_card" > Interview card< / option >
< / select >
< / label >
2026-04-27 11:33:20 +09:00
< button id = "asset-button" type = "submit" disabled >
< span class = "btn-text" > Generate prompt< / span >
< span class = "btn-spinner" aria-hidden = "true" > < / span >
< / button >
2026-04-26 18:52:16 +09:00
< / form >
< div id = "asset-output" class = "ontology-view empty-state" >
2026-04-27 11:33:20 +09:00
< span class = "empty-hint" > Generate a prompt to inspect model key, review state, and evidence.< / span >
2026-04-26 18:52:16 +09:00
< / div >
< / section >
2026-04-26 18:39:09 +09:00
< / section >
< aside class = "feedback-pane" aria-label = "Feedback" >
< div class = "section-heading" >
2026-04-27 11:33:20 +09:00
< div >
< p class = "eyebrow" > Feedback< / p >
< h2 > Rubric result< / h2 >
< / div >
2026-04-26 18:39:09 +09:00
< / div >
< div id = "feedback" class = "feedback empty-state" >
2026-04-27 11:33:20 +09:00
< span class = "empty-hint" > Submit an answer to see grade, evidence, and follow-up.< / span >
2026-04-26 18:39:09 +09:00
< / div >
2026-04-26 18:41:13 +09:00
< div class = "section-heading progress-heading" >
< div >
< p class = "eyebrow" > Progress< / p >
< h2 > Learning state< / h2 >
< / div >
< button id = "refresh-progress" class = "small-button" type = "button" disabled > Refresh< / button >
< / div >
< div id = "progress" class = "feedback empty-state" >
2026-04-27 11:33:20 +09:00
< span class = "empty-hint" > Answer once to update learner memory and readiness.< / span >
2026-04-26 18:41:13 +09:00
< / div >
2026-04-26 18:39:09 +09:00
< / aside >
< / main >
< script src = "/assets/app.js" type = "module" > < / script >
< / body >
< / html >
