dineÎNside

Interactive Front-End Project, Live demo here.

Table of Contents

• Purpose
• Technologies Used
• Features
• Logo
• Built With
• Usage
• Project Status
• Room for Improvement
• Contribution

Purpose

The aim of this project is to allow users to create home made cocktails and enjoy great meals at home. DineInside offers a search function so users can look up cocktails involving their favorite drinks and even the option for a meal to accompany your drink. The site also offers visual examples of both the cocktails and the drinks so users can have an idea of what each item looks like.

Technologies Used

• Tailwind CDN
• JSDelivr

Features

• Main page
• All buttons working
• Working search bar
• API calls from each API is on the project and works as intended

Logo

Built With

• HTML
• CSS
• Javascript

Usage

AS A USER

I WANT to find alcoholic/non-alcoholic cocktails paired with meals

SO THAT I can create a dine in restaurant vibe in the comfort of my home

ACCEPTANCE TEST FOR USER STORY

GIVEN sets of ingredients, drinks, and meals.

WHEN I visit the website

THEN presented with main page with drink category nav bar & search button

WHEN I select a drink category

THEN it takes me to that page with similar drinks

WHEN I hover over a picture of a drink

THEN I can see what type of drink category it belongs to

WHEN I search an ingredient(s)

THEN I should be taken to a page with drinks or meals that contain that/those ingredient(s)

WHEN I search ingredients or meals

THEN I can have them saved as future preferences (localstorage)

Project Status

Project is: complete

Screenshot

Links

• Github
• dineÎNside

Directions for Future Development

• add a more interactive user experience where they are proposed potential meals depending on their drink selection rather than the meal pairing being random. This would be to promote a better food and drink pairing that users might better enjoy with their drink.

• hone in on user’s locations to present them with their nearest liquor store/grocery store to make the experience from web to store and mixing linear and less complicated. The more we can do for our users, the less they can worry about the preparation and focus on relaxing and enjoying our suggested drink and meal combo.

Contribution

Made with ❤️ by

• George Saad

• Jinhan Yang

• Anika McLean

• Nathan Boulianne

• Ore Banjoko

• New Updates: George Saad