<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Arend-Jan Van Drongelen</title>
    <description>The latest articles on DEV Community by Arend-Jan Van Drongelen (@tjan).</description>
    <link>https://dev.to/tjan</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3780499%2F6ed3b5a0-8f36-4de2-88c2-270c85ce7316.jpg</url>
      <title>DEV Community: Arend-Jan Van Drongelen</title>
      <link>https://dev.to/tjan</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/tjan"/>
    <language>en</language>
    <item>
      <title>Neighbour help app</title>
      <dc:creator>Arend-Jan Van Drongelen</dc:creator>
      <pubDate>Mon, 02 Mar 2026 00:31:28 +0000</pubDate>
      <link>https://dev.to/tjan/neighbour-help-app-f9n</link>
      <guid>https://dev.to/tjan/neighbour-help-app-f9n</guid>
      <description>&lt;p&gt;&lt;em&gt;This is a submission for the &lt;a href="https://dev.to/challenges/weekend-2026-02-28"&gt;DEV Weekend Challenge: Community&lt;/a&gt;&lt;/em&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  The Community
&lt;/h2&gt;

&lt;p&gt;​​I live in an apartment building with a unique demographic: a mix of retirees (65+) and young professionals in their thirties. &lt;/p&gt;

&lt;p&gt;While the vibe is generally friendly, there is a bit of an individualistic culture where people mostly keep to themselves. I realized there is a massive, untapped potential for intergenerational support :) The seniors have time and wisdom, while the 30-somethings have tech skills and mobility. &lt;br&gt;
I wanted to build something to bridge that gap.&lt;/p&gt;

&lt;h2&gt;
  
  
  What I Built
&lt;/h2&gt;

&lt;p&gt;BurenBand is a private neighbourhood help platform for residents of an apartment complex. The core idea: neighbours helping neighbours (asking for a hand with groceries, offering tech support, or arranging help with moving) within a trusted, resident-only community.&lt;/p&gt;

&lt;p&gt;The app is a full-stack Progressive Web App built on Next.js 15 and Firebase. &lt;/p&gt;

&lt;p&gt;Key features:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;Resident gate: only people who live in the complex can join, enforced both on the frontend and in Firestore security rules.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Two-way posts: residents can post a Help Wanted or Offer Help request; each type has its own&lt;br&gt;
interaction flow&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Real-time chat: when someone responds to a post, both parties get a private in-app conversation to arrange the details, with quick-reply suggestions.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Trust &amp;amp; reputation: every post card shows the author's trust badge, built from their history of completed help actions.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Notifications: a Firestore-backed bell icon shows unread responses; confetti fires for the&lt;br&gt;
right person at the right moment&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Admin panel: residents can report posts; admins can review and close reports&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;-Language: Dutch and English, switchable at runtime, persisted per user&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;Accessibility — senior mode with larger text and wider buttons; three colour themes&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Installable PWA — works on Android (Chrome) and iOS (Safari) as a home screen app, with a service worker for offline resilience.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Demo
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://drive.google.com/file/d/1wk4x12niyjdsmJ4xlUV8Bt-1PqQDvizv/view?usp=drivesdk" rel="noopener noreferrer"&gt;https://drive.google.com/file/d/1wk4x12niyjdsmJ4xlUV8Bt-1PqQDvizv/view?usp=drivesdk&lt;/a&gt; &lt;/p&gt;

&lt;h2&gt;
  
  
  Code
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://github.com/ProgramTjan/burenband" rel="noopener noreferrer"&gt;https://github.com/ProgramTjan/burenband&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  How I Built It
&lt;/h2&gt;

&lt;p&gt;​This project was built during a focused sprint in close collaboration with Claude Sonnet 4.6 using Claude Code (CLI).&lt;/p&gt;

&lt;p&gt;​The AI Pair-Programming Workflow &lt;/p&gt;

&lt;p&gt;I acted as the architect and tester while Claude handled the implementation.&lt;/p&gt;

&lt;p&gt;​The Loop: I described features in plain language (often Dutch) → Claude edited the files directly via CLI → I tested the runtime behavior and reported bugs → Claude traced the root cause and fixed it. &lt;/p&gt;

&lt;p&gt;​Key Technical Decisions &lt;/p&gt;

&lt;p&gt;​Auth &amp;amp; State: Implemented a Screen state machine to manage complex branching between Google Login, email signup, and onboarding without UI glitches.&lt;/p&gt;

&lt;p&gt;​Smart Database Rules: Iterated on Firestore security rules to handle edge cases, such as making profile fields optional to prevent "save-fails" during the initial onboarding gate. &lt;/p&gt;

&lt;p&gt;​Custom i18n &amp;amp; UI: Built a lightweight translation system using React Context (no external libs) and used useRef to ensure "success confetti" only fires for the correct user. &lt;/p&gt;

&lt;p&gt;​PWA Ready: Automated the generation of splash screens and icons at build time using ImageMagick.&lt;/p&gt;

&lt;p&gt;​The Stack:&lt;/p&gt;

&lt;p&gt;Framework:&lt;br&gt;
Next.js 15.2 (App Router), React 19&lt;/p&gt;

&lt;p&gt;Language:&lt;br&gt;
TypeScript&lt;/p&gt;

&lt;p&gt;Backend:&lt;br&gt;
Firebase (Firestore + Auth)&lt;/p&gt;

&lt;p&gt;Styling:&lt;br&gt;
Tailwind CSS &amp;amp; Lucide Icons&lt;/p&gt;

&lt;p&gt;AI Tooling:&lt;br&gt;
Claude Sonnet 4.6 via Claude Code CLI&lt;/p&gt;

&lt;p&gt;Deployment:&lt;br&gt;
PWA&lt;/p&gt;

</description>
      <category>devchallenge</category>
      <category>weekendchallenge</category>
      <category>showdev</category>
    </item>
  </channel>
</rss>
