A responsive, WCAG-compliant single-page rental application portal for Affordable Apartments USA. Applicants apply either as a Standard Applicant or a Housing Voucher / Section 8 Applicant, pay the $35.00 application fee online through Stripe, and the portal emails notifications to your team.

👉 Try it live: https://rental-application.val.run

• Application-type toggle — selecting Section 8 reveals Housing Authority, voucher amount, approved bedroom count, and caseworker contact fields (and hides them again for Standard applicants).
• Six form sections: Property Info · Applicant Personal Details · Rental History · Financial Details · Disclosures & Accessibility · Application Fee & Authorization.
• Online payment — after submitting, the applicant is offered a secure "Pay $35.00 Now" button that opens a Stripe Checkout page. A completed payment is verified via Stripe webhook and the application is marked paid.
• Email notifications — your team gets an email when an application is submitted and again when the fee is paid; applicants get a confirmation.
• Executive palette — Navy #1a365d, Slate #4a5568, soft accent #ebf8ff.
• Accessibility (WCAG) — real <label for> pairs, aria-invalid, role="alert" validation, visible focus rings, keyboard-friendly controls, fully mobile responsive.
• Validation — required-field checks, email/phone/SSN masking (last-4-only display), conditional validation, digital-signature requirement.
• Persistence — applications + payment status stored in the val's SQLite DB.

Rendering mermaid diagram...

Variable	Required	Description
NOTIFY_EMAIL	always (has default)	Inbox notified of new applications & payments. Defaults to Cynthiawilliamshouse@gmail.com.
STRIPE_SECRET_KEY	for payments	Stripe API secret key (sk_test_… or sk_live_…)
STRIPE_WEBHOOK_SECRET	for payments	Stripe webhook signing secret (whsec_…)

1. Create a Stripe account (or connect to an existing one), then grab the API secret key — Restrict API key access: https://dashboard.stripe.com/apikeys

2. Add the two Stripe variables and then register the webhook so Stripe can confirm payments:

   • Endpoint: https://rental-application.val.run/api/stripe-webhook
   • Subscribe to the checkout.session.completed event.
   • After saving, copy the whsec_… signing secret into STRIPE_WEBHOOK_SECRET.

   👉 Add STRIPE_SECRET_KEY here: https://www.val.town/x/affordableapartmentsusa/rental-application-portal/environment-variables?key=STRIPE_SECRET_KEY 👉 Add STRIPE_WEBHOOK_SECRET here: https://www.val.town/x/affordableapartmentsusa/rental-application-portal/environment-variables?key=STRIPE_WEBHOOK_SECRET

   For testing, use Stripe test keys (sk_test_…) and their test card 4242 4242 4242 4242. Switch to live keys when you're ready to collect real payments.

Notifications are sent through Val Town's built-in std/email. The Free plan only allows sending email to the account owner's own address — external recipients (Cynthia's inbox or applicants' inboxes) require the Pro or Business plan. If you stay on Free, submissions and payments still work; the notification sends are attempted, logged, and safely ignored on failure. Emails are always wrapped so a delivery problem never breaks the application flow.

Method	Route	Description
GET	/	The application portal UI
POST	/api/application	Store an application (ApplicationFormData JSON)
GET	/api/application/:id	Fetch a single application (used on the paid confirmation page)
POST	/api/checkout/:id	Create a Stripe Checkout session for the $35 fee
POST	/api/stripe-webhook	Stripe webhook — marks an application paid & emails notifications
GET	/api/applications	List the 50 most recent applications (internal)

The val is deployed automatically on save. To build or extend:

• Tweak the palette and form fields in frontend/components/.
• Adjust business rules (fees, validation) in frontend/components/ApplicationForm.tsx.
• The fee is set by APPLICATION_FEE_CENTS = 3500 in index.ts.

View the source at any time from the View source link in the footer.