E↗EDGAR / ENGINEERING ← All projects
FULL-STACK / PUBLIC SOURCEPublic source · Code walkthrough

Interest & aptitude platform.
Next.js with Prisma.

A Next.js education application connecting an interactive questionnaire to a structured Prisma data model for users, schools, questions and results.

EVIDENCE TYPENext.js application prototype · Public code
TECHNOLOGYNext.js 15 · React 19 · TypeScript · Prisma
INSPECTED REVISION3575ad98d33f ↗ · 12 May 2025
REAL REACT COMPONENTS / INTERACTION TESTED

A questionnaire that responds.

Rendered from the original Next.js ClientTes and AnswerScale components. A local test-only page supplies four synthetic questions to verify the real selection and progression behavior.

Original source · Commit 3575ad98d33f
01 / Initial question
Original Next.js questionnaire showing the first synthetic question with the real seven-button answer scale.
Original React questionnaire and answer scale.
02 / After clicking an answer
Original React questionnaire showing the second synthetic question after clicking the answer value 2.
Progress changes when an answer is selected.
Original Next.js questionnaire rendered with test-only questions at a 390px mobile viewport. Mobile viewport · 390 px
10/10Real browser component and interaction checks passed

Original Next.js app, synthetic question fixture, real answer click and verified mobile layout.

View verification record ↗

The original components were tested locally using a temporary synthetic fixture. No real student database, student identity or backend submission was used.

01 / PROJECT CONTEXT

The use case

Assessment software combines responsive question flow with structured information about users, sessions, schools and results. This project explores that architecture in a full-stack Next.js application.

02 / HOW IT WORKS

Inside the build

Next.js loads question records through Prisma and renders an interactive React questionnaire. The data model defines users, schools, questions, sessions and scores, with middleware used for selected role-specific routes.

Question recordsReact questionnaire UIAnswer submission UIPrisma results model

Workflow overview based on the linked implementation.

03 / DIRECT CODE EVIDENCE

Explore the implementation

Explore the checked Next.js, React and Prisma implementation. The pinned Git links show how the questionnaire and data model are organized.

01 / Modern frontend stackInspect code ↗
package.json

Declares Next.js 15, React 19, TypeScript-related tooling and the Prisma client dependency.

02 / Relational data modelInspect code ↗
prisma/schema.prisma

Defines User, School, Question, Session and Result models with relations and role definitions.

03 / Server-side question loadingInspect code ↗
app/tes/page.tsx

Reads question records through Prisma and provides them to the questionnaire component.

04 / Interactive questionnaireInspect code ↗
app/tes/ClientTes.tsx

Implements a client-side question sequence, collects answers and sends a submission request to the application's API.

05 / Role-routing conceptInspect code ↗
middleware.ts

Implements JWT-based route checks for selected teacher and administrator paths.

04 / ENGINEERING HIGHLIGHTS

What I built into it

  • Designed application entities for users, institutions, questions and session results.
  • Combined server-rendered question retrieval with client-side questionnaire interaction.
  • Worked with a TypeScript/React application and a Prisma relational schema.
05 / PROJECT STATUS

Current stage

Early-stage application prototype with public source. A deployable assessment product would require end-to-end submission testing, permission review and validation of the scoring method.

← Back to portfolioExplore all project references ↗