DevCall is a full-stack remote coding interview platform built with Next.js, Clerk, Convex, and Stream Video. It combines interview scheduling, real-time video calls, a live coding workspace, interviewer feedback, pass/fail review, and recording playback in one application.
This project demonstrates modern full-stack application development with authentication, real-time collaboration, role-based workflows, serverless backend functions, webhooks, and third-party video infrastructure.
DevCall is more than a basic CRUD app. It models a real-world hiring workflow from scheduling to live interview execution to post-interview review.
It demonstrates how multiple production-style systems work together:
- Authentication and user roles with Clerk
- Serverless backend data and mutations with Convex
- Real-time video meetings with Stream Video
- Live coding workspace with Monaco Editor
- Interview scheduling and review workflows
- Recording playback for completed meetings
- Webhook-based user syncing between Clerk and Convex
- Create instant coding interview rooms
- Schedule interviews with candidates and interviewers
- Join live video meetings with a shared coding workspace
- Use pre-call camera and microphone setup
- Switch between grid and speaker video layouts
- View meeting participants during calls
- Resize the coding panel during interviews
- Leave interviewer comments and star ratings
- Mark completed interviews as passed or failed
- Review and share saved meeting recordings
- Sync new Clerk users into Convex through webhooks
- Next.js 16 – full-stack React framework and routing
- React 19 – component-based UI development
- TypeScript – type-safe application logic
- Tailwind CSS 4 – utility-first styling
- Clerk – authentication and user management
- Convex – backend database, queries, mutations, and HTTP actions
- Stream Video SDK – video meetings and recording support
- Monaco Editor – live coding workspace
- Radix UI primitives – accessible UI components
DevCall supports the full interview lifecycle:
- Interviewers create instant or scheduled interviews
- Candidates and interviewers join a video meeting
- Participants use a shared coding workspace during the call
- Interviewers leave comments and ratings
- Completed interviews are marked as passed or failed
- Recordings can be reviewed after the meeting
- Instant meeting creation from the home screen
- Scheduled interviews with title, description, date, time, candidate, and interviewer selection
- Interview cards grouped by interview status
- Admin dashboard for completed interview review
- Stream-powered video calling
- Pre-join camera and microphone setup
- Grid and speaker video layouts
- Participant list toggle
- End meeting control for the meeting owner
- Resizable coding workspace during the call
- Interview comments stored in Convex
- Star-based interviewer ratings
- Pass/fail interview status updates
- Recordings page for playback and link sharing
- Clerk handles authentication and user identity
- Convex stores application-specific user records
- Clerk webhooks sync newly created users into Convex
- Default users are created with the
candidaterole - Interviewer role enables scheduling and dashboard access
- User signs in through Clerk
- Clerk authentication state is used throughout the Next.js app
- New Clerk users are synced into Convex through a webhook
- Convex stores users, interviews, comments, and role data
- Interviewers create scheduled or instant interviews
- Stream Video powers live meeting rooms and recordings
- Monaco Editor provides the coding workspace inside the meeting route
- Completed interviews can be reviewed with comments, ratings, status, and recordings
src/
app/
(root)/
(home)/ Home screen and quick actions
meeting/[id]/ Live meeting route
recordings/ Recording browser
schedule/ Interview scheduling UI
(admin)/
dashboard/ Interview review dashboard
components/
MeetingRoom.tsx
MeetingSetup.tsx
CodeEditor.tsx
CommentDialog.tsx
RecordingCard.tsx
actions/
stream.actions.ts
convex/
comments.ts
interviews.ts
users.ts
http.ts
schema.ts
auth.config.ts
Create a .env.local file in the project root:
NEXT_PUBLIC_CONVEX_URL=
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=
CLERK_SECRET_KEY=
CLERK_WEBHOOK_SECRET=
NEXT_PUBLIC_STREAM_API_KEY=
STREAM_SECRET_KEY=npm installCreate accounts/projects for:
- Clerk
- Convex
- Stream Video
Make sure convex/auth.config.ts matches your Clerk issuer/domain.
This app syncs newly created Clerk users into Convex through the HTTP action in convex/http.ts.
Create a Clerk webhook for:
user.created
Point it to the Convex HTTP endpoint:
/clerk-webhook
Without this webhook, users can authenticate with Clerk but will not be inserted into the Convex users table.
npx convex devThis handles function deployment, type generation, and local Convex development.
npm run devOpen:
http://localhost:3000
npm run dev
npm run build
npm run start- New users are synced into Convex with the default role
candidate - Interviewer functionality requires setting a user role to
interviewer - The current experience is interviewer-focused
- Candidate dashboard functionality is still minimal in the current version
To verify a production build locally:
npm run buildIf the build succeeds, run the production server with:
npm run start- Building a full-stack SaaS-style application with Next.js
- Managing authentication and role-based user flows
- Integrating real-time video infrastructure
- Building interview scheduling and review workflows
- Using Convex for backend data, queries, mutations, and webhooks
- Syncing third-party auth users into application data
- Embedding a coding workspace into a live meeting experience
- Handling environment configuration across multiple services
- Add a more complete candidate dashboard
- Add interviewer/candidate notification emails
- Add calendar integration for scheduled interviews
- Add coding challenge templates
- Add collaborative editing in the coding workspace
- Add automated tests for scheduling, role access, and interview review
- Add stronger role-management controls in the admin dashboard
- Add analytics for interview outcomes and candidate performance
Brandon May
MIT