A high-fidelity, premium Single Page Application (SPA) designed to simulate the exact layout, regulations, and timing of the TCS NQT Verbal Ability foundation exam. The portal uses a Dual Groq API Key Architecture to generate unique tests and grade responses without phrasing bias.
- Dual-Key Isolation: Uses Key A (Generator) at
temperature: 0.9to write unique tests, and Key B (Evaluator) attemperature: 0.2to grade submissions strictly against TCS rubrics. The grader never sees the generator prompts. - Cheating Defense: Core questions are sanitized of answer keys, explanations, and recall requirements before rendering in the exam engine to prevent inspect-element leaks.
- Auto-Save & Refresh Recovery: Active inputs and exam stages are auto-saved to
localStorageon every keystroke. If you refresh or drop connection, the exam resumes with the timer correctly ticking down. - Self-Correcting Timers: Evaluates time via absolute target timestamps (
endTimestamp - Date.now()) to bypass background browser tab timer throttling. - Vocabulary-focused Freshness: Feeds the exact correct vocabulary words and scenarios of your last 5 attempts back into Key A's generator to prevent repeat questions.
- Detailed Development Feedback: The evaluator provides clear, context-rich improvement advice on vocabulary, tone, and grammar, highlighting exactly how to reach the NQT standard.
- Pure SVG Charting: Renders metrics and score progress trends client-side with native SVG elements (no bloated charting libraries).
| Section | Question Type | Count | Visibility | Timer | Regulations |
|---|---|---|---|---|---|
| Section 1 | Sentence Completion | 20 | Visible | 25s per Q | Typed answer (no options/MCQs). Shuffled difficulty. Covers academic science, literature, philosophy, and advanced grammar structures. |
| Section 2 | Passage Recall | 4 | 30s visible, then hidden | 30s read, 90s write | Paragraph is hidden during the 90s writing phase. Paragraph size is 90-130 words. |
| Section 3 | Email Writing | 1 | Scenario stays visible | 540s (9 min) | Corporate scenario compose panel. Requires at least 100-150 words. Features live word counter in the UI. Graded for word count compliance. |
- Build Tool: Vite 8
- Library: React 19
- Icons: Lucide React
- Styling: Vanilla CSS (Modern CSS Custom Tokens, Light/Dark Modes, Glassmorphic panels)
Ensure Node.js (v18 or higher) and npm are installed.
You can configure your Groq API credentials in two ways:
Copy the .env.example file to .env.local and add your Groq keys:
cp .env.example .env.localEdit .env.local to fill in your API keys:
VITE_GROQ_KEY_A=gsk_your_generator_api_key_here
VITE_GROQ_KEY_B=gsk_your_evaluator_api_key_hereAlternatively, launch the portal, open the Settings menu at the top right, insert the credentials, and save. The keys will be encrypted/persisted securely inside your browser's local sandbox (localStorage).
# Install dependencies
npm install
# Run the development server
npm run devNavigate to http://localhost:5173 in your browser.
To build the application bundle and test it in a production-like environment:
# Build the optimized production bundles
npm run build
# Run local preview server on compiled dist folder
npm run preview- src/App.jsx: Main state controller. Manages session cache hydration, navigation routes, theme switching, error fallbacks, and the sanitization layer.
- src/utils/groq.js: Contains connection tests, prompt builders, schema validation, and JSON parsing retry loops.
- src/index.css: Design Tokens, light/dark variables, buttons, grids, animations, and forms.
- src/components/Dashboard.jsx: Score trends, stats tracking, SVG progress charts, and list of attempts.
- src/components/Settings.jsx: API key configurator with input masking, model overrides, and connection test status.
- src/components/ExamEngine.jsx: Step indicators, self-correcting timers, phase transitions, and inputs.
- src/components/ResultsView.jsx: Detailed feedback tabs, correct/incorrect comparison, recall score detail, and email rubric rating charts.