Panruti Cashews – Order App

A lightweight web app for taking cashew orders from residents of nearby apartments. Customers place orders from a simple mobile-friendly form, and the seller tracks, edits and closes those orders from a private admin dashboard. Everything runs in the browser against Firebase, with no backend server to maintain.

Live site: https://cashew-orders.web.app/ (admin: /admin.html)

Highlights

• No sign-up for customers: order with a mobile number, then view, modify or cancel using the same number
• Admin dashboard: secure login, live order tabs, pending total, mark delivered, and a one-click "Freeze Orders" switch
• Duplicate protection: one open order per mobile number and per flat, with warnings for possible duplicates
• Security in the database rules: access is enforced by Firestore Security Rules, not by hiding pages
• No server to maintain: plain HTML, CSS and JavaScript on Firebase Hosting and Firestore

Screenshots

Place an order	Order placed	Admin dashboard

How I built it

I built this app with Claude Code as my coding partner. I described each feature in plain English, reviewed the plan before any code was written, tested every change on my phone against the live site, and asked for fixes until it worked the way I wanted. I kept a CLAUDE.md file in the repo so Claude Code understood the project's structure, rules and deployment steps from one session to the next. I used feature branches and merged through a pull request, then deployed to Firebase from main.

Features

Customer order page (index.html)

• Shows the current product and price, updated live from the database
• Order form: mobile number (10 digits, numbers only), apartment, flat number and quantity (1–5 half-kg packets). All fields are mandatory.
• When a mobile number with an open order is entered, that order is shown with Modify Order and Cancel Order buttons. A number can have only one open order at a time.
• While placing a new order, once the apartment and flat number are filled in, the page checks for an open order for that flat (matched ignoring case, spaces and punctuation). If one exists, it shows "An order already exists" with that order's details and Modify Order / Cancel Order, instead of creating a second order. A "Not your order? Change the flat number" link goes back to the form. The same check runs again on submit, and when an order is modified to a different flat.
• After an order is placed or updated, the page keeps the mobile number and shows the order details with Modify Order and Cancel Order, so the customer can change or cancel it straight away.
• When the admin has frozen orders, a notice says that order placement is closed and existing orders cannot be modified or cancelled. The order form is hidden; a customer can still enter their mobile number to see their open order, but without the Modify/Cancel buttons.
• Running total calculated as the quantity changes (an order being modified keeps the price it was placed at)
• A pop-up notification when an order is placed, updated or cancelled, and an error message if something fails
• A contact number at the bottom of the page for order details or enquiries (a tap-to-call link; change it in the footer of index.html)

Admin dashboard (admin.html)

• Email/password sign-in (Firebase Authentication)
• Edit the product name and price shown to customers
• Freeze Orders / Unfreeze Orders button (with confirmation). While frozen, customers cannot place, modify or cancel orders; the admin can still edit, deliver and delete them.
• Summary of open orders and the total amount pending
• Open / Closed / Cancelled / All tabs, with orders updating in real time
• Each order shows the customer's mobile number as a tap-to-call link
• Reopen Order on closed and cancelled orders, which puts them back in Open. If the customer's number has no other open order, the customer page shows the reopened order again; if it does, the admin is warned before reopening.
• While signed in, the dashboard creates any missing openFlats pointers for open orders (for example orders placed before this feature, reopened orders, or orders the admin moved to another flat), so customers can find them by flat.
• Open orders that share an apartment and flat number with another open order are outlined in red with a "Possible duplicate" warning, so they can be checked manually. Flat numbers are matched ignoring case, spaces and punctuation (A-204 matches a 204).
• Mark an order as delivered, edit its apartment, flat number and quantity (the mobile number is shown read-only), or delete it (with confirmation)

Both pages

• Sun/moon toggle for light and dark mode, which follows the system setting by default and remembers your choice
• Responsive layout for phones and desktops

以上为 README 的开头部分。其余内容请阅读原文。 查看完整 README ↗