Meticulous Health Solutions is a responsive React website for a Georgia pediatric home healthcare agency. The site introduces the agency, explains Georgia Pediatric Program (GAPP) services, captures consultation and contact requests, and accepts career applications with resume and cover letter uploads.
- Public marketing pages for home, about, GAPP services, contact, careers, and free consultations
- Responsive navigation and footer powered by React Router
- Framer Motion page and section animations
- Tailwind CSS styling with local image assets
- Contact, GAPP inquiry, and booking forms that submit to Airtable
- Career application form with Base64 resume and cover letter upload support
- Vercel serverless API routes for form handling
- React
- TypeScript
- Vite
- Tailwind
- React Router
- Framer Motion
- Lucide React
- Vercel serverless functions
- Airtable API
api/
career.js # Career application endpoint
contact.js # Contact, GAPP, and booking endpoint
public/
icons.svg
favicon.svg
src/
assets/ # Images, logo, and favicon assets
components/ # Shared UI sections
constants/ # Navigation configuration
lib/ # Motion helpers
pages/ # Route-level page components
| Path | Page |
|---|---|
/ |
Home page |
/about |
Agency overview, mission, vision, and values |
/gapp-services |
GAPP program and service information |
/career |
Hiring information and application form |
/contact |
Contact form and GAPP inquiry form |
/booking |
Free consultation eligibility form |
- Node.js 20 or newer recommended
- npm
- Airtable base and personal access token for production form submissions
npm installnpm run devVite will start the development server and print a local URL, usually http://localhost:5173.
npm run buildThis runs TypeScript project checks and creates a production build in dist/.
npm run previewnpm run lintCopy .env.example to .env.local for local development or configure the same variables in Vercel for deployment.
cp .env.example .env.localRequired variables:
| Variable | Description |
|---|---|
AIRTABLE_ACCESS_TOKEN |
Airtable personal access token |
AIRTABLE_BASE_ID |
Airtable base ID |
AIRTABLE_TABLE_NAME |
Career applications table name |
Optional table name overrides:
| Variable | Default |
|---|---|
AIRTABLE_CONTACT_TABLE_NAME |
Contact Submissions |
AIRTABLE_GAPP_TABLE_NAME |
GAPP Submissions |
AIRTABLE_BOOKING_TABLE_NAME |
Booking Submissions |
The .env.example file also includes optional AIRTABLE_FIELD_*, AIRTABLE_CONTACT_FIELD_*, AIRTABLE_GAPP_FIELD_*, and AIRTABLE_BOOKING_FIELD_* overrides for Airtable bases that use different field names.
The career form submits to /api/career. Create an Airtable table for applications with these fields:
- First Name
- Last Name
- Phone
- Position
- Years of Experience
- Availability
- License or Certification
- Background
- Resume File Name
- Cover Letter File Name
- Resume
- Cover Letter
Resume and cover letter uploads are sent through a Vercel serverless function, so their combined file size is limited to 3 MB before Base64 encoding.
The contact page and booking page submit to /api/contact.
Create Airtable tables for:
Contact SubmissionsGAPP SubmissionsBooking Submissions
Expected form payloads:
- Contact Us: name, phone, email, subject, message
- GAPP Form: parent name, phone, child diagnosis, location, address, city, ZIP/postal code, insurance type
- Free Consultation: qualifying conditions, Georgia residency, care need, insurance coverage, child age range, full name, email, phone
The project is ready for Vercel deployment:
- Connect the repository to Vercel.
- Add the Airtable environment variables in the Vercel project settings.
- Deploy with the default Vite build command:
npm run build. - Vercel will serve the frontend and expose the serverless functions in
api/.
- API routes only accept
POSTrequests. - Form submissions return a generic user-facing error while detailed failures are logged server-side.
- The career API creates the Airtable record first, then uploads resume and cover letter files into Airtable attachment fields.






