Skip to main content
Alvin QuachFull Stack Developer
HomeProjectsExperienceBlog
HomeProjectsExperienceBlog
alvinquach

Full Stack Developer building systems that respect complexity.

Open to opportunities

Projects

  • All Projects
  • Lacoda Capital Holdings
  • Hoop Almanac
  • SculptQL

Knowledge

  • Blog
  • Experience
  • Interview Prep

Connect

  • Contact
  • LinkedIn
  • GitHub
  • X

Resources

  • Resume
© 2026All rights reserved.
Back to Projects

Hoparc Physical Therapy

Healthcare website migration from Wix to modern Next.js stack for a pelvic floor physical therapy practice

Lead Developer & Mentor
Team of 2
4 weeks
Next.js
Sanity
TypeScript
TailwindCSS
GraphQL
Live Site

The Problem

Situation

A pelvic floor physical therapy practice in Ohio was struggling with their Wix website—Core Web Vitals were failing (LCP over 6 seconds), the site was difficult for staff to update, and local SEO rankings were poor despite quality care. This was also an opportunity to mentor Sean Sipus, a fellow Juno College of Technology alumnus from Toronto who needed a refresher on React fundamentals. I led the rebuild while pair programming with Sean through every feature, mentoring him in TypeScript, Next.js, and Sanity CMS.

My Goal

Migrate the practice's website from Wix to a modern, performant Next.js stack while preserving SEO equity and improving Core Web Vitals. Simultaneously mentor a fellow Juno College grad who needed to refresh his React fundamentals, teaching him TypeScript, Next.js patterns, and CMS integration through pair programming on every feature.

My Approach

1

Conducted comprehensive audit of existing Wix site, documenting all pages, content, and current SEO rankings with Sean to teach site analysis

2

Set up Next.js project with TypeScript, ESLint, and Prettier, walking Sean through modern tooling configuration and why each tool matters

3

Pair programmed component architecture, teaching Sean atomic design principles and React composition patterns

4

Designed and implemented responsive layouts using Tailwind CSS, explaining utility-first CSS methodology

5

Integrated Sanity CMS with GraphQL using Apollo Client and Apollo Server, teaching Sean headless CMS concepts and API design

6

Implemented 301 redirects for all existing URLs to preserve SEO equity, explaining redirect strategies and SEO fundamentals

7

Added structured data (LocalBusiness, MedicalBusiness schemas) for enhanced local search presence

8

Built HIPAA-conscious contact forms with proper data handling, discussing compliance requirements in healthcare

9

Optimized all images with next/image and WebP conversion, teaching performance optimization techniques

10

Implemented ISR (Incremental Static Regeneration) for optimal performance with dynamic content

11

Set up Vercel deployment with preview environments, teaching CI/CD concepts and professional deployment workflows

12

Created documentation for the client and conducted training session on CMS usage

13

Conducted code reviews with Sean throughout, providing feedback on code quality, naming conventions, and best practices

The Outcome

Largest Contentful Paint improved from 6.2s to 1.8s (71% improvement)

PageSpeed Insights score increased from 32 to 94

Organic search traffic increased 45% within 3 months of launch

Patient inquiry form submissions increased 60%

Zero SEO ranking losses during migration—all existing rankings preserved

Staff can now update content independently without developer assistance

Site maintenance time reduced by 80% compared to Wix

Successfully mentored junior developer who gained confidence in modern web development stack

Project Roadmap

MVP, stretch goals, and future vision

Project Roadmap

Development phases and milestones

100%
1/1 complete
1

Core Website

MVP

Physical therapy practice website with patient portal

Completed
Website Launch

Responsive website for physical therapy practice

Completed
In Progress
Planned

Interview Questions

Common questions about this project, answered in STAR format

Q1

Tell me about a time you mentored someone through a technical project.

leadership
SSituation
Sean Sipus, a fellow Juno College of Technology alumnus, needed a refresher on React fundamentals and wanted to level up to TypeScript and Next.js. I had a client project for a physical therapy practice that needed a website rebuild.
TTask
Deliver a production healthcare website while helping Sean refresh his React skills and learn TypeScript, Next.js, and Sanity CMS through hands-on pair programming.
AActions
  • →Structured the project as a mentorship opportunity from the start, getting client buy-in for the timeline
  • →Used pair programming with driver-navigator pattern where Sean drove and I guided
  • →Started by reviewing React fundamentals Sean knew from bootcamp, then built on that foundation
  • →Introduced TypeScript as 'React with guardrails' once React patterns were solid again
  • →Layered in Next.js concepts progressively through the project
RResult
Delivered a high-performing site (PageSpeed 94) that increased patient inquiries 60%. Sean refreshed his React skills and gained confidence with TypeScript and Next.js. The teaching process also improved my own technical communication.

Key Takeaway: Refresher learning builds on existing knowledge rather than starting from scratch. Meeting people where they are and reinforcing what they know before adding new concepts accelerates the learning process.

Q2

Describe a situation where you had to balance multiple competing priorities.

problem solving
SSituation
I was rebuilding a healthcare website with a client deadline while also mentoring a fellow bootcamp grad through the project. The client needed the site launched before a marketing campaign, and Sean needed time to refresh his skills and learn new technologies.
TTask
Deliver the project on time while ensuring Sean had meaningful learning experiences—not just watching but actively building and understanding.
AActions
  • →Communicated the mentorship component to the client upfront, negotiating a realistic timeline
  • →Sequenced tasks so Sean started with components that reinforced his existing React knowledge
  • →Progressed to more complex features as his TypeScript and Next.js skills developed
  • →Built in buffer time for learning moments that inevitably extended estimated task times
  • →Identified which features were best for teaching vs. where I should lead to maintain quality
RResult
Launched on schedule for the client's marketing campaign. Sean built the majority of components himself with guidance, gaining real ownership over the work. Client was happy with both the result and knowing they contributed to someone's professional development.

Key Takeaway: Balancing mentorship with delivery requires explicit planning and stakeholder communication. You can't treat teaching as invisible overhead—it needs to be accounted for and valued as part of the project scope.

Q3

How do you approach helping someone refresh skills they haven't used recently?

leadership
SSituation
Sean had learned React at Juno College but needed a refresher before tackling a production project. He also needed to learn TypeScript and Next.js, which were new to him.
TTask
Help Sean refresh his React fundamentals quickly enough to contribute meaningfully to a client project while also teaching him new technologies.
AActions
  • →Started by reviewing what Sean remembered—components, props, state, hooks
  • →Used pair programming so refresher happened in context of real features, not abstract exercises
  • →Introduced TypeScript gradually, framing types as helpful guardrails that catch errors
  • →Connected Next.js patterns to React concepts he already knew
  • →Created small wins early to rebuild confidence before tackling complex features
RResult
Sean progressed from needing a refresher to independently building and maintaining React components with TypeScript. He understood not just the syntax but the reasoning behind architectural decisions. He's now building projects independently using the patterns we established.

Key Takeaway: Refresher learning is faster than teaching from scratch because you're reactivating existing knowledge, not building it. Focus on what's changed in the ecosystem and connect new concepts to what they already know.

Technical Decisions

Quick answers to 'Why did you choose X?' questions

Q1Why choose Next.js over healthcare-specific platforms like PatientPop or SimplePractice?

Healthcare platforms are expensive ($300-700/month) and limit customization. Next.js gave us full control over performance, design, and SEO while being more cost-effective. It also provided a better learning experience for Sean—he learned transferable skills rather than platform-specific workflows.

Q2How did you approach mentoring someone who needed a React refresher?

Started by reviewing React fundamentals Sean already knew from Juno College—components, props, state, hooks. Once those were solid again, introduced TypeScript gradually as 'React with guardrails.' Then layered in Next.js patterns like file-based routing and server components. Building on existing knowledge is faster than teaching from scratch.

Q3Why use Sanity CMS for a small healthcare practice?

Sanity's real-time collaboration and intuitive Studio made it easy to train both Sean and the client. The generous free tier works well for small sites. We used GraphQL with Apollo Client and Apollo Server instead of GROQ—GraphQL is more widely adopted in the industry, making it a more transferable skill for Sean. We could also customize the Studio interface to match the client's mental model of their content.

Q4How did you structure pair programming sessions for maximum learning?

Used driver-navigator pattern where Sean drove most of the time while I guided. Started sessions with a brief explanation of what we'd build and why, coded together with lots of questions and discussion, then ended with Sean summarizing what he learned. This kept him engaged and reinforced concepts.

Q5How did you handle the Wix to Next.js content migration?

Exported Wix content manually (no clean API), used this as a teaching moment about content modeling. Sean helped restructure content for Sanity schemas, learning how CMS architecture affects frontend development. We built import scripts together, practicing TypeScript and API interactions.

Key Trade-offs

Every decision has costs — here's how I thought through them

Invest extra time in mentorship vs. complete project faster solo

Gained

  • +Junior developer gained real-world experience and built transferable skills
  • +Sean contributed meaningfully to the project with growing independence
  • +I deepened my own understanding by teaching and articulating concepts

Gave Up

  • −Project took approximately 40% longer than if done solo
  • −Required more upfront planning to structure learning opportunities
  • −Some rework needed when Sean's initial attempts needed refinement

Why Worth It

Building people is as important as building software. Sean gained confidence and skills he's now using professionally, and the teaching process improved my own technical communication.

Use modern stack (Next.js/TypeScript/Sanity) vs. simpler tools for a small site

Gained

  • +Excellent performance metrics that directly improved SEO
  • +Great developer experience for both mentoring and maintenance
  • +Sean learned industry-standard tools applicable to future work

Gave Up

  • −Steeper learning curve for both Sean and client
  • −More initial setup time compared to WordPress or Squarespace
  • −Client requires brief training on Sanity Studio

Why Worth It

Teaching current best practices prepares Sean for professional work. The performance benefits directly impacted SEO and user experience, justifying the complexity.

Pair program on everything vs. assign independent tasks

Gained

  • +Sean learned not just what to do but why—deeper understanding
  • +Caught misunderstandings immediately before they became habits
  • +Built consistent code patterns and naming conventions

Gave Up

  • −Slower short-term velocity compared to parallel work
  • −Required more of my focused time per feature
  • −Less independent problem-solving practice for Sean initially

Why Worth It

For a developer rebuilding fundamentals, guided practice builds better habits than struggling alone. Independence came later as Sean's confidence grew.

Challenges & Solutions

The hardest problems I solved on this project

1Preserving SEO equity during a complete platform migration while teaching a developer the importance of SEO

Approach

Created comprehensive redirect mapping, implemented structured data, and used this as a teaching opportunity to explain how search engines index and rank content

Solution

Built a redirect verification system and walked Sean through each redirect, explaining URL structures, canonical tags, and sitemap generation

Lesson: Platform migrations are excellent teaching opportunities—they touch every aspect of web development from routing to deployment

2Handling sensitive healthcare content appropriately while teaching a developer new to the healthcare space

Approach

Discussed HIPAA basics, patient privacy, and the emotional context of pelvic floor therapy with Sean before starting content work

Solution

Established content guidelines together and reviewed all copy for appropriate tone, teaching the importance of domain context in development

Lesson: Technical skills alone aren't enough—understanding the domain and user context is essential, and mentoring should include this broader perspective

3Balancing mentorship pace with client timeline expectations

Approach

Set clear expectations with client about the mentorship component, structured work so Sean could practice on non-critical-path items first

Solution

Created a learning roadmap that aligned with project milestones—Sean built components with increasing complexity as the project progressed

Lesson: Mentorship projects require upfront communication with stakeholders and intentional task sequencing to balance learning with delivery

4Refreshing React fundamentals while introducing new concepts like TypeScript and Next.js

Approach

Started by reviewing React basics Sean already knew, then built on that foundation to introduce TypeScript typing and Next.js-specific patterns

Solution

Used pair programming to reinforce React patterns while gradually layering in TypeScript and Next.js concepts, letting Sean drive while I guided

Lesson: Refresher learning is different from teaching from scratch—build on existing knowledge and focus on what's changed in the ecosystem

What I Learned

  • →Healthcare websites require extra sensitivity in language and imagery—patients seeking pelvic floor therapy are often vulnerable and need reassuring, professional presentation
  • →Mentoring through pair programming is more effective than code reviews alone—real-time discussion builds deeper understanding
  • →Teaching forces you to articulate concepts you take for granted, strengthening your own understanding
  • →Junior developers often ask 'why' questions that challenge assumptions and lead to better solutions
  • →HIPAA considerations extend beyond forms to analytics, third-party scripts, and even image metadata
  • →Local SEO for healthcare requires attention to NAP consistency, Google Business Profile optimization, and location-specific content
  • →Patient testimonials in healthcare require explicit consent and careful presentation to maintain trust and compliance
  • →Balancing teaching pace with project deadlines requires clear communication with both the mentee and the client

Want to discuss this project?

Get in TouchView More Projects