Skip to content

Commit

Permalink
Zomato API
Browse files Browse the repository at this point in the history
  • Loading branch information
revanth1718 authored Aug 8, 2024
1 parent 2a30e95 commit 230b04a
Show file tree
Hide file tree
Showing 6 changed files with 220 additions and 0 deletions.
14 changes: 14 additions & 0 deletions New_APIs/Zomato API/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
# Zomato API Viewer App

A simple web application to interact with the Zomato API and display restaurant data.

## Features
- Fetch and display random restaurant details

## Installation
1. Clone the repository:
```bash
git clone https://github.com/username/ZomatoAPIApp.git

## Contributor
### Revanth
25 changes: 25 additions & 0 deletions New_APIs/Zomato API/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Zomato API Viewer</title>
</head>
<body>
<header>
<h1>Zomato API Viewer</h1>
</header>
<main id="app">
<section>
<h2>Find a Restaurant</h2>
<button id="fetchRestaurantButton">Fetch Random Restaurant</button>
</section>
<section id="restaurant-info">
<h2>Restaurant Details</h2>
<div id="restaurant"></div>
</section>
</main>
<script src="index.js"></script>
</body>
</html>
51 changes: 51 additions & 0 deletions New_APIs/Zomato API/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
document.addEventListener('DOMContentLoaded', function () {
document.getElementById('fetchRestaurantButton').addEventListener('click', fetchRandomRestaurant);
});

async function fetchRandomRestaurant() {
const apiKey = 'https://developers.zomato.com/api/v2.1/restaurant?res_id=56625527';
const cityId = 280; // Example city ID for San Francisco
const endpoint = `https://developers.zomato.com/api/v2.1/search?entity_id=${cityId}&entity_type=city&count=1&sort=rating&order=desc`;

try {
const response = await fetch(endpoint, {
method: 'GET',
headers: {
'Accept': 'application/json',
'user-key': apiKey
}
});

if (!response.ok) {
throw new Error(`HTTP error! Status: ${response.status}`);
}

const data = await response.json();
if (data.restaurants && data.restaurants.length > 0) {
const restaurant = data.restaurants[0].restaurant;
displayRestaurant(restaurant);
} else {
displayError('No restaurants found.');
}
} catch (error) {
console.error('Error fetching restaurant:', error);
displayError('Failed to fetch restaurant details.');
}
}

function displayRestaurant(restaurant) {
const restaurantDiv = document.getElementById('restaurant');
restaurantDiv.innerHTML = `
<h3>${restaurant.name}</h3>
<p><strong>Cuisine:</strong> ${restaurant.cuisines}</p>
<p><strong>Address:</strong> ${restaurant.location.address}</p>
<p><strong>Rating:</strong> ${restaurant.user_rating.aggregate_rating} (${restaurant.user_rating.rating_text})</p>
<p><strong>Cost for Two:</strong> ${restaurant.currency} ${restaurant.average_cost_for_two}</p>
<a href="${restaurant.url}" target="_blank">View on Zomato</a>
`;
}

function displayError(message) {
const restaurantDiv = document.getElementById('restaurant');
restaurantDiv.innerHTML = `<p>${message}</p>`;
}
45 changes: 45 additions & 0 deletions New_APIs/Zomato API/package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

15 changes: 15 additions & 0 deletions New_APIs/Zomato API/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
{
"name": "zomato-api-app",
"version": "1.0.0",
"description": "A simple app to view restaurant data from the Zomato API",
"main": "index.js",
"scripts": {
"start": "node server.js"
},
"author": "Revanth",
"license": "ISC",
"dependencies": {
"express": "^4.17.1"
}
}

70 changes: 70 additions & 0 deletions New_APIs/Zomato API/style.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,70 @@
body {
font-family: 'Arial', sans-serif;
background: linear-gradient(135deg, #ff8c00, #ffc107);
color: #333;
margin: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
min-height: 100vh;
}

header {
text-align: center;
margin-bottom: 20px;
}

header h1 {
font-size: 3em;
color: #fff;
}

main {
background: rgba(255, 255, 255, 0.9);
padding: 20px;
border-radius: 10px;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
text-align: center;
}

section {
margin-bottom: 20px;
}

h2 {
font-size: 2em;
margin-bottom: 10px;
color: #ff8c00;
}

button {
padding: 10px 20px;
font-size: 1em;
color: #fff;
background-color: #ff8c00;
border: none;
border-radius: 5px;
cursor: pointer;
transition: background-color 0.3s;
}

button:hover {
background-color: #e07b00;
}

#restaurant-info {
margin-top: 20px;
}

#restaurant {
font-size: 1.2em;
background: #fff;
padding: 20px;
border-radius: 10px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

#restaurant p {
margin: 10px 0;
}

0 comments on commit 230b04a

Please sign in to comment.