01
The Challenge
Healthcare practitioners often settle for generic Doctolib profiles or cookie-cutter templates that erode trust. The challenge was to craft a site that feels simultaneously professional and human — one that reassures anxious patients, communicates expertise on specialties (bruxism, anxiety), and drives bookings without feeling like a pushy funnel.
02
The Solution
I designed and built the site end-to-end with Vite + React + TypeScript, using Framer Motion for subtle reveal animations. The typography pairs Fraunces (editorial serif) with Inter (utility sans), on a warm cream and terracotta palette. Dedicated specialty pages (anxiety, bruxism) provide deep SEO coverage, while a floating Doctolib CTA and phone FAB keep booking one tap away on mobile. Deployed on Vercel with sitemap.xml, robots.txt and OG image.
// Client-side meta + JSON-LD injection for a Vite SPA
export function useDocumentMeta({ title, description, canonical, jsonLd }: Meta) {
useEffect(() => {
const previousTitle = document.title;
document.title = title;
setMetaContent('meta[name="description"]', description);
setMetaContent('meta[property="og:title"]', title);
setMetaContent('meta[property="og:description"]', description);
if (canonical) {
setCanonical(canonical);
setMetaContent('meta[property="og:url"]', canonical);
}
let script: HTMLScriptElement | null = null;
if (jsonLd) {
script = document.createElement('script');
script.type = 'application/ld+json';
script.textContent = JSON.stringify(jsonLd);
document.head.appendChild(script);
}
return () => {
document.title = previousTitle;
if (script?.parentNode) script.parentNode.removeChild(script);
};
}, [title, description, canonical, jsonLd]);
}↳ Per-route SEO meta and Schema.org JSON-LD injection for a Vite SPA — each specialty page gets its own canonical, OG tags and LocalBusiness structured data
