Know Your Rights, Find Your Support — Built for Brent

AI Summary5 min read

TL;DR

Brent Navigator is a free community webapp that centralizes verified, plain-English information for Brent residents facing diverse challenges. It covers nine key areas like housing, health, and rights, designed specifically for mobile access in this diverse London borough.

Key Takeaways

  • Brent Navigator addresses information gaps by consolidating verified resources across nine critical areas including crisis support, housing rights, and employment opportunities.
  • The app prioritizes mobile responsiveness and user experience details like tab persistence, recognizing most residents access information via phones.
  • Every piece of content was rigorously verified against official sources to ensure reliability in real-life situations.
  • Built with React, Vite, and Leaflet.js, the project emphasizes functional depth over aesthetics to solve practical community problems.
  • The tool represents a shift from simple directories to comprehensive navigators that provide context and explanations alongside resources.

Tags

devchallengeweekendchallengeshowdev

This is a submission for the DEV Weekend Challenge: Community

The Community

Brent is one of London's most diverse and deprived boroughs. 340,000 residents. 130+ languages spoken. A 27% child poverty rate, one of the highest in the capital.

The people who live here are not short of resilience or community spirit. What they are often short of is information. Not because it doesn't exist but because it's scattered across dozens of council web pages, NHS portals, charity websites, and government guidance documents, written in bureaucratic language, rarely updated, and almost impossible to navigate under stress.

When someone is facing eviction tonight, they don't have time to search five websites. When a young person gets stopped and searched, they should already know their rights. When a resident doesn't know there are fully funded training courses available to them for free — that information gap has a real cost.

I live in Brent. I built this for my neighbours.


What I Built

Brent Navigator is a free, community webapp that puts verified, plain-English information in one place, organised around the moments that matter most to residents.

Nine sections covering the full range of issues Brent residents face:

  • Crisis Support — Mental health lines, domestic abuse contacts, emergency services

  • Health — NHS urgent care, GP registration, healthy living support

  • Housing — Renting rights, social housing bidding system, eviction process, emergency housing

  • Employment — Free job search tools, fully funded training courses, benefits explained, starting a business

  • Cleaner Brent — Bin collection finder, fly-tipping reporting, bulky waste options

  • The Hub — Community groups, local events, faith organisations, local news, and an interactive Leaflet.js map with 17 clickable location pins across the borough

  • Youth & Rights — Stop and search rights, education entitlements, mental health support, care leaver entitlements

  • Tax & Budget — Council tax discounts, where the money goes, accountability tools, financial help

  • Council FAQs — A searchable accordion of 32 verified answers to the most common resident questions

Every phone number is real. Every link goes somewhere useful. Every piece of content was verified against official sources.


Demo

Live app: brent-navigator.vercel.app

GitHub: github.com/Maame-codes/brent-navigator

Dashboard
Dashboard

Tabs on the different help available
Navigator Tabs

Interactive Map featuring places in Brent
Interactive map


How I Built It

Stack:

  • React + Vite
  • Framer Motion for page transitions
  • Leaflet.js for the interactive map
  • CSS custom properties for theming
  • Deployed on Vercel, source on GitHub

The content was the hardest part.

Every section required genuine research, verifying phone numbers against official sources, checking council policy documents, confirming addresses. The Housing section alone covers the Locata bidding system, Section 21 validity checklist, illegal eviction law, deposit protection rules, and emergency housing routes. That's not content you can make up or guess at. People will use this in real situations.

The CSS nearly broke me.

I'll be honest, my CSS sucks. It was the reason why I never wanted to ever get into front-end anyway and getting this to be responsive was a battle. So forgive me if it is not the most aesthetically pleasing site there is, I TRIED MY BEST 😂. The sidebar needed to become a hamburger menu on mobile without pushing or shifting the main content. The interactive map needed to render correctly on small screens. The tab navigation inside each section needed to wrap without breaking the layout. I spent significant time wrestling with position: fixed, overflow-x: hidden, -webkit-overflow-scrolling: touch, and overscroll-behavior to get the mobile experience feeling smooth and native. It's not glamorous work but it matters — most Brent residents access the internet on a phone.

The tab persistence was a small detail that mattered a lot.

Early on, refreshing the page would always kick you back to the dashboard. For an app that residents might bookmark and return to repeatedly, that's genuinely frustrating. I added localStorage to persist the active tab across sessions so the app remembers where you were.

Why I built it this way.

I could have built a simple link directory. Instead I chose depth real explanations, real context, real phone numbers. The Housing section tells you that you don't have to leave just because you receive an eviction letter. The Youth section tells you exactly what an officer must say before a stop and search. The Benefits section explains the Universal Credit taper rate in plain English so residents aren't scared to take a job.

That's the difference between a directory and a navigator. This is built to help real people, and solve real problems in a neighbourhood I live in.


Built with ❤️ for the 340,000 residents of Brent, London.

Visit Website