منوی دیجیتال QR برای کافه و رستوران
منوی دیجیتال فارسی و موبایل‌محور که با اسکن یک کد QR باز می‌شود، قابل نصب روی گوشی است و بدون نیاز به حساب کاربری یا اینترنت پایدار کار می‌کند.
- React
- TypeScript
- Vite
- PWA
- Node.js
- نوع پروژه
- منوی دیجیتال به‌صورت اپلیکیشن تحت وب قابل نصب (PWA)
- کارفرما
- یک کافه‌رستوران (نام کارفرما بنا بر توافق منتشر نمی‌شود)
- نقش سپرو وب
- طراحی و پیاده‌سازی منوی عمومی و ابزار مدیریت محتوای محلی
- وضعیت
- تکمیل‌شده و تحویل‌شده
مسئله‌ای که حل کردیم
منوی کاغذی هر بار با تغییر قیمت یا اضافه‌شدن یک آیتم باید دوباره چاپ شود. از طرف دیگر، بسیاری از «منوهای آنلاین» مهمان را وادار به ثبت‌نام یا نصب اپلیکیشن می‌کنند — کاری که کسی سر میز کافه انجام نمی‌دهد. هدف، منویی بود که با یک اسکن باز شود، سریع بالا بیاید و هیچ مانعی سر راه مهمان نگذارد.
آنچه طراحی و پیاده‌سازی کردیم
منو به‌صورت ایستا و از یک فایل محتوایی ساخته می‌شود؛ نتیجه، بارگذاری بسیار سریع و کارکرد پایدار حتی روی اینترنت ضعیف است. مهمان می‌تواند دسته‌ها را با نوار پیمایش هوشمند مرور کند، جست‌وجو کند، جزئیات هر آیتم را در یک برگهٔ کشویی ببیند و آیتم‌های موردعلاقه‌اش را در فهرست «انتخاب من» جمع کند. این فهرست فقط روی خود گوشی مهمان ذخیره می‌شود و یک صفحهٔ ساده برای نمایش سفارش به صندوق در نظر گرفته شده است.
به‌عمد این پروژه سفارش‌گیری، پرداخت، ورود کاربر و ارسال ندارد؛ دامنهٔ کار از ابتدا روشن تعریف شد تا محصول ساده، سریع و بی‌دردسر بماند. برای تیم رستوران هم یک ابزار مدیریت محلی ساخته شد که فقط روی رایانهٔ خود مجموعه اجرا می‌شود، به شبکه باز نیست و تصاویر را هنگام افزودن به‌صورت خودکار بهینه می‌کند.
مقیاس پروژه
- منوی دوزبانهٔ فارسی و انگلیسی برای یک مجموعه
- اپلیکیشن قابل نصب با کارکرد برون‌خط
- ابزار مدیریت محتوای محلی با بهینه‌سازی خودکار تصویر
معماری فنی
منو با React و TypeScript روی Vite ساخته شده و از CSS ساده با نظام متغیرهای رنگی برای پوسته‌بندی استفاده می‌کند. یک سرویس‌ورکر به‌همراه فایل معرفی برنامه، قابلیت نصب و کارکرد برون‌خط را فراهم می‌کند. ابزار مدیریت یک سرویس Node.js است که فقط روی نشانی محلی گوش می‌دهد و پردازش تصاویر را با sharp انجام می‌دهد.
جزئیات حساسِ زیرساخت و پیکربندی امنیتی عمداً از این توضیح حذف شده‌اند.
آنچه این پروژه دارد.
- باز شدن با اسکن کد QR بدون نیاز به ثبت‌نام
- قابل نصب روی گوشی و کارکرد برون‌خط
- نوار پیمایش هوشمند دسته‌ها و جست‌وجوی سریع
- برگهٔ کشویی جزئیات هر آیتم
- فهرست «انتخاب من» با ذخیره‌سازی فقط روی گوشی مهمان
- صفحهٔ نمایش سفارش برای ارائه به صندوق
- محتوای دوزبانهٔ فارسی و انگلیسی
- ابزار مدیریت محلی با بهینه‌سازی خودکار تصویر
پشتهٔ فنی پروژه
- React
- TypeScript
- Vite
- PWA
- Node.js
جزئیات بیشتر، در گفت‌وگویی خصوصی.
بر پایهٔ تعهد محرمانگی با کارفرما، تصاویر محیط کاربری و جزئیات شناسایی‌کنندهٔ این پروژه عمومی منتشر نمی‌شود. اگر محصولی مشابه در دست دارید، درخواستتان را ثبت کنید؛ پس از بررسی، بخش‌هایی که اجازهٔ انتشار دارند را در یک جلسهٔ خصوصی مرور می‌کنیم.
ارسال درخواست به‌معنای دسترسی خودکار نیست — هر درخواست به‌صورت دستی بررسی می‌شود.