[Project]: Ramen Kid



Back to Portfolio

Ramen Kid Website


This project had a huge focus on functionalities of admin who is authorized to change most of the contents on the website. You can click any image to zoom.

Responsive design

rk responsive

Setting announcement

Admin has an option to set custom announcement that displays on the top of the page

rk announcement 1

rk announcement 2

Add/Edit/Delete menu items

Admin can add, edit, delete menu items. Also one can mark particular item sold out or available.

rk menu

rk menu 1

rk menu 2

Drag & Drop to change order

Admin can use drag & drop to change order of menu items using react-beautiful-dnd

rk dnd

Dynamically generate PDF

Based on the menu item stored in database, it automatically creates menu in PDF format using react-pdf

rk pdf

Editing other pages

Admin can modify images in Home page, and edit texts in About and Hours & Location

rk texts 1

rk texts 2

rk texts 3


User can opt in/out for emailing list, and admin is able to sent out bulk emails to subscribers via Sendgrid API. Subscriber data below is fake.

rk subscription 1

rk subscription 2

rk subscription 3

Contact form

Customers of the restaurant can send the message to the client using a contact form and via Sendgrid API

rk contact


Inside admin panel, admin can view the number of visitors and page hits of each pages

rk analystic


Uses json web token to sign in user and allows to change email & password

rk auth

Admin can turn/off each link in the header. i.e. one can disable contact page such that it won't be shown to the public

rk edit header

QR Code

Custom QR code that's linked to the menu page.

rk qr


Keeping a record