InternifyIntern Tracking System
- Period
- Jun 2024 - Sep 2024
- Project type
- Team Project
- Role
- Front-End Developer - CV Workflows (Team)
- Team
- ITS development team
A React/Vite/TypeScript student recruitment portal for the ITS Batch 21 program, with a multi-round company application flow for students and a CSV-driven admin dashboard for managing the student roster.
- Preview builds
- 64Preview builds
- Upload guard
- 50 MBUpload guard
Overview
Internify centralises the ITS Batch 21 internship recruitment program: students browse the companies offered each round, apply, and manage their profiles and CVs, while admins manage the student roster (manually or via CSV import). I built front-end features — principally CV upload and management — on a group build; the Node/Express/PostgreSQL/AWS backend was the team's.
Role & context
- Role
- Front-End Developer - CV Workflows
- Team
- ITS development team
- Type
- Team Project
- Period
- Jun 2024 - Sep 2024
Group project under the ITS-Development-Team org for the ITS Batch 21 internship recruitment program. I worked on the React/Vite/TypeScript front-end — my specific contribution was the CV upload and management features. The backend (Node.js/Express/PostgreSQL/AWS) was built by the team.
Problem
The recruitment program needed a central place for Batch 21 students to view the companies offered each round and submit applications, plus a way for admins to manage the roster — the admin CSV-import path indicates the prior bottleneck was manual, one-by-one entry of student records.
Approach & architecture
The front-end SPA (this repo) reads mock data and handles CV/CSV/image input in-browser; the Node/Express/PostgreSQL/AWS backend is a separate, team-owned service.
Practices followed
Strict TypeScript across the project (strict mode plus unused-locals/params enforcement)
Zero-warning lint gate (eslint --max-warnings 0) in the build scripts
Feature-aligned folder layout
student (dashboard) vs admin UI separated, with widgets co-located per feature
Mock-data abstraction (one module per entity) so the future swap to a real API is a one-file change per entity
A single reusable drag-and-drop upload widget shared across avatar, cover, and CV uploads
Bulk-import path (CSV via PapaParse) so admins onboard a roster instead of N manual form submissions
Challenges & resolutions
CV and image uploads needed to work end-to-end in the prototype even though there is no file-storage backend yet.
FixUsed react-dropzone for drag-and-drop UX and FileReader.readAsDataURL to convert files to base64 for in-memory preview/storage, with a 50 MB client-side guard — structured so it can swap to presigned-URL uploads once storage is wired in.
Onboarding a whole batch one form at a time wouldn't scale, but admins still needed to fix single records.
FixA dual-path Add Student flow — manual entry plus bulk CSV ingest (PapaParse) — both feeding the same admin table.
Outcomes
Front-end shipped: a multi-round company application page (filter by round / role / apply-limit), a student profile editor (avatar + cover upload), and an admin manage-student table (search, edit/delete, add via manual form or CSV)
My contribution: the CV upload and management features (drag-and-drop, base64 preview, 50 MB guard)
Two merged feature PRs (epic/application-round, feature/student-profile) under the team org
Tech stack
Concepts & skills12
- React 18 with TypeScript (strict mode)
- Vite build tooling & HMR workflow
- SPA routing with react-router-dom v6 (nested routes, layouts)
- Tailwind CSS utility-first styling
- Material Tailwind + MUI component composition
- React Context + useReducer for global UI state
- Drag-and-drop file upload UX (react-dropzone)
- Client-side CSV ingestion (PapaParse)
- Browser FileReader API & base64 DataURL handling
- Feature-based folder architecture & component reuse
- ESLint + TypeScript strict-mode quality gating
- Git feature-branch + PR workflow under a team org