Itay's Restaurant (All in one solution)

eCommerce Website

-

allows customers to buy any type of food they'd like from any restaurant branch, using one of the next services such as Takeaway, Delivery and Table Reservations.

Each of these services can be consumed while making an order from variety of categories. Each category has its own individual products that have individual price/options/extras list.

Dashboard

-

allows workers to manage orders livetime with their customers (getting all the necessary details to accept/accept at specific hour/cancel with refund every order request), keeping access to archives/orders by phone number.

CMS (content management system)

-

an admin can easily change the menu for everyone without knowing any bit of code.

Many available options such as: add/remove/edit/order/hide/copy categories & items.

Amazing statistics

-

allows the admin to increase his profits by observing observing graphs are based on different data which lead the the admin to make smart decision about the restaruant (made with Chart.js)

These graphs are being changed every time a new order is being created, and they are being measured by specific dates (checkpoints) during which new data is being accumulated to the specific graph.

An admin can easily create a new checkpoint by simply clicking to start creating & grasping a new graph (for example creating a new checkpoint every month). Some examples are: the most sold products (showing how many times a product was hold, the price of the product and the total money gained from the specific product during the checkpoint), the best seller restaurant branch, the total income for the latter dates, etc..

CRM (customer relationship management)

-

divided audience with Google Analytics API, allows the admins to give purchaers sales every once in a while, also tracks the number of purchases for each client and showing in the analytics what kind of items the clients decided to remove/add.

Live updates

-

every order that is being created gets a live track URL that's specific for the specific client, this link is getting live updates about the current state of the order that's managed by the restaurant, without forcing the user to refresh his page (automatically changing the information on his page livetime).

Optimization tricks

-

using react-snap for pre-rendering to achieve optimization and manage working meta tags for making successful SEO.

Using lazy-loading on all pictures in order to prevent from the user loading heavy pages, hence it loads only the relevant information for the user.

Furthermore, using localStorage to avoid re-running a script for existing data that was downloaded in the past, this way the user can skip some unnecessary standby time.

Smart Features Behind The Scenes

-

 Smart redirects = if a user tries to load a link to Drinks category, despite his link hasn't processed/completed the AJAX request to receive the required information from the database, he'll be redirected to Drinks category after his page loaded

Smart Cart Memory = on page reload/refresh you'd expect the cart to be emptied, but that won't happen because the last cart added items are saved automatically (and even without using any caching method), which means after a refresh you'd still see your last added items until the user manually removes them.

Parallel Update on Dashboard - An update that occures in one dashboard (whether it's a worker/admin that changed something) will also change the dashboard for other dashboards opened in other branches without any page refresh.

Compressed database - any data that is inserted in the database by the user is compressed wisely, which allows the user to get database information faster than as if it wasn't compressed.

Pub/Sub & Google Scheduler = every day at night after the restaurant is closed (or at some other time we set up), a back-end function will run that will clear the database from past orders, everything from the past will be moved into an archive without any human trigger(done automatically), which means every day you come to a new day of work you'll see in main panel only the relevant orders for today, everything organized simply.

Search Engine Optimization & Loading Speed

-

using react-helmet, each page has its own meta tags(title, description, keywords), so that every page gains more exposure that can be tracked by search engines.

Using imagemin & sharp packages, all images that exist on the website or being uploaded are resized & compressed by cloud function on the backend, hence a faster loading speed is achieved for the user.

Designed / Customized / Dynamic Website (SPA)

-

 every page has its own niche, all the content in menu page is generated from Firebase firestore database, every page has its own unique page URL link (an admin can create a new route without knowing any code, which creates better practical environment for optimized SEO), every action the user does is saved in the database.

PWA (progressive web app) + Offline Mode

-

an option to install the website as an app (add to home button), using service-worker to enable offline mode, pre-caching and caching, all these allow make sure the next time you come back to the website it'll load faster.

Paypal API

-

to achieve secured payment transcations. Accepting both Paypal payments or credit cards such Visa (also pre-paid Visa cards), Mastercard, American Express and Discover.

Refunds can be handled both by the client, or the restaurant - as long as the state of the order is "pending" they both have the option to request a full refund. The refund is handled through cloud functions backend as well, which is more secured for the user.

Google Maps API

-

showing on the map markers (special icons) of each restaurant branch according to its geographic location, easy access to view more information about the specific location by simply clicking on those icons.

Secured Backend

-

Not anyone can make any type of action, every sort of action is being checked for the sake of security, only an admin can change the menu, only the specific client who made the order can ask for a refund or the restaurant itself, etc..

Multilingual

-

The whole website is supporting both Hebrew (RTL language) and English (LTR language), adding the prefix '/en' will make the website in English.

Animations

-

using CSS and the Intersection API to achieve beautiful and lovely experience for the user.

Responsive Design

-

working in any sort of environment, both in phones and computers.