Maple Trail

Inspiration

Every year, millions of people relocate into unfamiliar environments — international students starting a new program, workers arriving on a permit, refugees rebuilding a life, and even relocating personnel and their families moving to a new posting. In every one of these cases, the same problem repeats: critical information about housing, healthcare, government registration, and daily life is scattered across dozens of websites, forums, and word-of-mouth advice, with no single source that adapts to who you are and why you're there.

We wanted to build something that replaces "figure it out yourself over three stressful weeks" with a single, personalized guide generated the moment someone tells us their situation.

What it does

Newcomer Guide is a role-based onboarding platform. A user signs up and selects their situation — Student, Worker, Visitor, or Relocating Personnel — along with their destination city. From there, the app generates a personalized guide covering:

• Government & Legal — what to register for first (e.g. a SIN), required documents, and next steps
• Healthcare — how to access care and register with a provider
• Accommodation — short-term and long-term housing guidance
• Daily Life — transit, banking, groceries, and other essentials
• A First Two Weeks Checklist — a simple, ordered action plan so the process doesn't feel overwhelming

Guides are generated by an LLM but tailored per role — a student's guide emphasizes study permits and campus health insurance, while a relocating-personnel guide covers on-base vs. off-base housing and dependent registration. Every guide is saved to the user's account so they can return to it and check off items as they go.

How we built it

• Frontend: React + Vite, styled with Tailwind CSS
• Backend/Database: Supabase — Postgres for structured data (profiles, guides tables), built-in Auth for signup/login, and Row Level Security policies so every user can only read and write their own data
• AI: Claude API, prompted per-role to generate structured JSON guide content, which we render into an accordion/tabbed layout in the UI
• Auth flow: Email/password signup and login via Supabase Auth, with a database trigger that automatically creates a profile row the moment a user signs up, and protected routes that send users to a role-specific dashboard

We deliberately kept the architecture simple — no live scraping, no unreliable third-party data feeds — so that everything works reliably end-to-end for the demo.

Challenges we ran into

• Auth + RLS setup under time pressure: getting Row Level Security policies exactly right (so users can only see their own data, but the app still works smoothly) took careful testing — an early misconfigured policy silently blocked legitimate reads, which took some debugging to trace back to the auth.uid() policy condition rather than the query itself.
• Environment variable handling in Vite: we initially wrote our Supabase client using process.env, which works in Node/Next.js but not in a Vite app — Vite requires import.meta.env and a VITE_ prefix on env variables. A small but easy-to-miss gotcha.
• Deciding how far to take the dual-use angle: we considered several defense-adjacent framings and were careful not to force a connection that wasn't real. We landed on genuinely relevant extensions — offline-first access and privacy-conscious data handling — rather than just relabeling the same civilian tool.

What we learned

• How to design Row Level Security policies that actually match an application's access patterns, not just "turn RLS on and hope."
• How to structure LLM prompts to reliably return consistent, structured JSON rather than freeform text, so it can be rendered predictably in the UI.
• That a genuinely useful, simple tool with a clear user story is often stronger than a more complex one — we prioritized finishing one clean flow end-to-end over half-finishing several features.

What's next

• Offline-first caching of guides for low-connectivity environments
• Multi-language guide generation
• A "Relocating Personnel" mode with features tailored to military and diplomatic relocations, including stronger data-handling and privacy defaults

Built With

• auth
• claudeapi
• css
• html5
• javascript
• node.js
• postgresql
• react
• rest
• supabase
• tailwind
• vercel
• vite