Case Study
Face of Nashik
Industry: Fashion Shows, Event Pageantry & Talent Management | Type: Full-Stack Event and Contestant Management Platform
Volmier developed a full-stack event and contestant management portal to digitize beauty pageantry workflows, from customizable participant registrations to visitor pass tracking and event CMS operations.
Project Facts
| Project Type | Contestant Management System, Pageant Showcase & Custom Registration Form Builder |
| Industry | Fashion Shows, Event Pageantry, and Talent Management |
| Volmier Role | Full-Stack Design and Development (React frontend with custom navigation context, Node/Express APIs, Mongoose modeling, UI/UX design, custom WebP compression tools) |
| Frontend Stack | React 18, TypeScript, Vite, Tailwind CSS, custom RouterContext state navigation |
| Backend Stack | Node.js, Express, jsonwebtoken, bcryptjs, cors, morgan, dotenv |
| Database | MongoDB (Mongoose ODM connected to MongoDB Atlas) |
| Authentication | JSON Web Token (JWT) in authorization headers, bcryptjs password hashing |
| Infrastructure | MongoDB Atlas; local sandbox configuration via Bolt.new |
Project Overview
The platform supports Grape City Production’s beauty pageants and events, specifically "Face of Nashik: The Maharashtra Grandeur." Volmier developed the React client using TypeScript and Vite as a Single Page Application, along with an Express backend API and a Mongoose database connection to MongoDB Atlas.
The system provides public pageant information, allows contestants to register via custom drag-and-drop form structures, coordinates attendee pass purchases, and features a comprehensive admin panel for submission verification.
Project Purpose
Organizing regional beauty pageants typically requires managing extensive participant lists, categorizing applicants by age and criteria, collecting terms acceptance, and coordinating entry tickets for live shows.
To replace spreadsheet tracking and manual ticket lists, Grape City Production required an operational hub that manages structural content dynamically and verifies payments manually inside a secure administrative interface.
What Volmier Implemented
User Experience & Front-End Routing
Implemented a custom navigation router context to control page history transitions, enabling a SPA layout without routing library dependencies. Styled using Tailwind CSS to form a luxurious, dark-themed branding.
Dynamic Contestant Onboarding
Built a form renderer that maps administrative form templates dynamically, allowing contestants to fill out portfolios, accept terms via modal displays, and access client dashboards.
Visitor Pass Sales & Verification
Developed ticket purchase flows where visitors register pass quantities, receive dynamic payment amounts, pay via manual UPI transfers, and upload confirmation screenshots.
Backend API & Database Schemas
Built an Express rest framework with JWT authentication and custom model route factories. Designed Mongoose schemas to represent users, pageant categories, timelines, winners, custom forms, registrations, and pass entries.
Key Features
Dynamic Form Configurator
Admins build custom registration forms with text fields, dropdowns, dates, and checkboxes directly from the panel.
Visitor Pass Sales
Attendee ticket selection mapping invoice details, manual UPI guidelines, and file-upload screenshot verification.
Public Lookup Trackers
Pageant candidates and pass buyers look up application status by reference number without credentials.
Contestant Dashboard
Sign-in dashboards allowing participants to edit portfolio URLs, view statuses, and download approved passes.
Client-Side WebP Compressor
Canvas-based processing that resizes uploads to 1600px and compresses WebP formats before network dispatch.
Dynamic Homepage CMS
Administrative dashboards to edit text elements, FAQ lists, timelines, and testimonial sections.
Technical Implementation
Volmier implemented a React frontend connected to an Express.js REST API backed by MongoDB. Authentication checks verify JSON Web Tokens inside header parameters, and user credentials are encrypted via bcryptjs.
The backend coordinates body payloads up to 8MB using Express JSON limiters to support base64 screenshot uploads. Uploaded files are converted client-side using Canvas rendering APIs to minimize server processing and database storage overhead inside MongoDB Atlas collections.
Database associations link orphaned registrations dynamically: when a contestant logs in, any existing registration records associated with their email address are automatically updated and linked to their new user ID.
Verified Project Outcomes
Volmier successfully delivered a full-stack contestants portal featuring:
- An operational React client with dynamic routing and custom layout animations.
- Express backend servers featuring role-based auth middleware and generic model routers.
- Manual pass verification queues and dynamically rendered custom form schemas.
- Base64 direct database asset storage paired with client-side image compression.
No verified business/performance metrics found.
Frequently Asked Questions
What did Volmier develop for the Face of Nashik project?
Volmier developed a full-stack event portal including a React SPA frontend with a custom context-based router, a Node.js Express REST API backend, Mongoose schemas for MongoDB databases, and a custom admin CMS to manage contestants, custom forms, events, and visitor passes.
Does the platform support automated online payments?
No, automated payment gateways are not verified for this project. Volmier implemented a manual UPI payment verification workflow where visitors select ticket quantities, make transfers using external UPI apps, and upload transaction screenshots for admin validation.
How does the custom registration form builder work?
The platform includes a custom drag-and-drop form builder in the admin panel. Event administrators can dynamically create registration forms with text fields, dropdowns, dates, and checkboxes, which are automatically rendered for contestants during sign-up.
Have a similar software project in mind?
Talk to Volmier about your software development needs. We focus on clear technical scoping and building tools that support your workflows.