From 5d84e64201bcbe24535b9addd63951fde3140587 Mon Sep 17 00:00:00 2001
From: Supriya <56571107+priyaraj7@users.noreply.github.com>
Date: Fri, 4 Nov 2022 10:15:11 -0700
Subject: [PATCH] Fetching Google API Data (#3)

* add header component

* trying to fetch api dynamically

* update query

* rending data(menu info) frontend

* do some cleanup

* add key to map function

* commentout category props

* fetch googleapi backend

* add google mock api code

* fetching google Api from frontend

* add google api info

* add contact page

* change file name

* delete commentout code

* change let to const

Co-authored-by: Chris Jaure <chrisjaure@gmail.com>

* change parameter author to review

Co-authored-by: Chris Jaure <chrisjaure@gmail.com>

Co-authored-by: Chris Jaure <chrisjaure@gmail.com>
---
 client/src/App.js                             |   9 +-
 client/src/api/categoryApi.js                 |   6 +
 client/src/api/googleApi.js                   |   6 +
 client/src/component/customer/ContactPage.js  | 134 ++++++
 client/src/component/customer/CustomerPage.js |  17 +
 client/src/component/customer/Header.js       | 255 +++++++++++
 client/src/component/customer/Menu.js         | 166 +++++++
 client/src/component/customer/ReviewPage.js   | 119 +++++
 package-lock.json                             | 379 ++++++++++++++++
 package.json                                  |   1 +
 server/.env.example                           |   4 +-
 server/api/googleApi.js                       |  34 ++
 server/api/mockGoogleApiData .js              | 420 ++++++++++++++++++
 server/package-lock.json                      | 127 ++++++
 server/package.json                           |   2 +
 server/server.js                              |   2 +
 16 files changed, 1678 insertions(+), 3 deletions(-)
 create mode 100644 client/src/api/categoryApi.js
 create mode 100644 client/src/api/googleApi.js
 create mode 100644 client/src/component/customer/ContactPage.js
 create mode 100644 client/src/component/customer/CustomerPage.js
 create mode 100644 client/src/component/customer/Header.js
 create mode 100644 client/src/component/customer/Menu.js
 create mode 100644 client/src/component/customer/ReviewPage.js
 create mode 100644 server/api/googleApi.js
 create mode 100644 server/api/mockGoogleApiData .js

diff --git a/client/src/App.js b/client/src/App.js
index dfef6e2..fb93b7c 100644
--- a/client/src/App.js
+++ b/client/src/App.js
@@ -1,11 +1,16 @@
 import "./App.css";
 import { ChakraProvider } from "@chakra-ui/react";
-import Customer from "./component/customerPage/Customer.js";
+
+import CustomerPage from "./component/customer/CustomerPage.js";
+
+
 
 function App() {
   return (
     <ChakraProvider>
-      <Customer />
+
+      <CustomerPage />
+
     </ChakraProvider>
   );
 }
diff --git a/client/src/api/categoryApi.js b/client/src/api/categoryApi.js
new file mode 100644
index 0000000..90ae2a7
--- /dev/null
+++ b/client/src/api/categoryApi.js
@@ -0,0 +1,6 @@
+export const getAllItem = async (id) => {
+  const response = await fetch(`/api/${id}`);
+  const result = await response.json();
+
+  return result;
+};
diff --git a/client/src/api/googleApi.js b/client/src/api/googleApi.js
new file mode 100644
index 0000000..f6f8b1f
--- /dev/null
+++ b/client/src/api/googleApi.js
@@ -0,0 +1,6 @@
+export const getReviews = async () => {
+  const response = await fetch(`/place/reviews`);
+  const result = await response.json();
+
+  return result;
+};
diff --git a/client/src/component/customer/ContactPage.js b/client/src/component/customer/ContactPage.js
new file mode 100644
index 0000000..6dc18f4
--- /dev/null
+++ b/client/src/component/customer/ContactPage.js
@@ -0,0 +1,134 @@
+import {
+  Container,
+  Flex,
+  Box,
+  Heading,
+  Text,
+  Button,
+  VStack,
+  Wrap,
+  WrapItem,
+  FormControl,
+  FormLabel,
+  Input,
+  InputGroup,
+  InputLeftElement,
+  Textarea,
+  Link,
+} from "@chakra-ui/react";
+import { MdPhone, MdLocationOn, MdOutlineEmail } from "react-icons/md";
+import { BsPerson, BsPhone } from "react-icons/bs";
+
+function ContactPage() {
+  return (
+    <Container bg="gray.50" maxW="full" mt={0} centerContent overflow="hidden">
+      <Flex>
+        <Box
+          bg="gray.100"
+          borderRadius="lg"
+          m={{ sm: 4, md: 16, lg: 10 }}
+          p={{ sm: 5, md: 5, lg: 16 }}
+        >
+          <Box p={4}>
+            <Wrap spacing={{ base: 20, sm: 3, md: 5, lg: 20 }}>
+              <WrapItem>
+                <Box>
+                  <Heading>Contact</Heading>
+                  <Text mt={{ sm: 3, md: 3, lg: 5 }} color="gray.500">
+                    Fill up the form below to contact
+                  </Text>
+                  <Box py={{ base: 5, sm: 5, md: 8, lg: 10 }}>
+                    <VStack pl={0} spacing={3} alignItems="flex-start">
+                      <Button
+                        size="md"
+                        // height="48px"
+                        // width="200px"
+                        variant="ghost"
+                        // color="#DCE2FF"
+                        _hover={{ border: "2px solid #1C6FEB" }}
+                        leftIcon={<MdPhone color="#1970F1" size="20px" />}
+                      >
+                        +91-988888888
+                      </Button>
+
+                      <Button
+                        as={Link}
+                        size="md"
+                        variant="ghost"
+                        _hover={{ border: "2px solid #1C6FEB" }}
+                        href="https://maps.google.com/?cid=5149673375893793708"
+                        leftIcon={<MdLocationOn color="#1970F1" size="20px" />}
+                      >
+                        Ujire, Karnataka 574240, India
+                      </Button>
+                    </VStack>
+                  </Box>
+                </Box>
+              </WrapItem>
+              <WrapItem>
+                <Box bg="white" borderRadius="lg">
+                  <Box m={8} color="#0B0E3F">
+                    <VStack spacing={5}>
+                      <FormControl id="name">
+                        <FormLabel>Your Name</FormLabel>
+                        <InputGroup borderColor="#E0E1E7">
+                          <InputLeftElement
+                            pointerEvents="none"
+                            children={<BsPerson color="gray.800" />}
+                          />
+                          <Input type="text" size="md" />
+                        </InputGroup>
+                      </FormControl>
+                      <FormControl id="name">
+                        <FormLabel>Mail</FormLabel>
+                        <InputGroup borderColor="#E0E1E7">
+                          <InputLeftElement
+                            pointerEvents="none"
+                            children={<MdOutlineEmail color="gray.800" />}
+                          />
+                          <Input type="text" size="md" />
+                        </InputGroup>
+                      </FormControl>
+                      <FormControl id="phone">
+                        <FormLabel>Phone Number</FormLabel>
+                        <InputGroup borderColor="#E0E1E7">
+                          <InputLeftElement
+                            pointerEvents="none"
+                            children={<BsPhone color="gray.800" />}
+                          />
+                          <Input type="text" size="md" />
+                        </InputGroup>
+                      </FormControl>
+                      <FormControl id="name">
+                        <FormLabel>Message</FormLabel>
+                        <Textarea
+                          borderColor="gray.300"
+                          _hover={{
+                            borderRadius: "gray.300",
+                          }}
+                          placeholder="message"
+                        />
+                      </FormControl>
+                      <FormControl id="name" float="right">
+                        <Button
+                          variant="solid"
+                          bg="#0D74FF"
+                          color="white"
+                          _hover={{}}
+                        >
+                          Send Message
+                        </Button>
+                      </FormControl>
+                    </VStack>
+                  </Box>
+                </Box>
+              </WrapItem>
+            </Wrap>
+          </Box>
+        </Box>
+      </Flex>
+    </Container>
+  );
+}
+
+export default ContactPage;
diff --git a/client/src/component/customer/CustomerPage.js b/client/src/component/customer/CustomerPage.js
new file mode 100644
index 0000000..05b58c7
--- /dev/null
+++ b/client/src/component/customer/CustomerPage.js
@@ -0,0 +1,17 @@
+import Header from "./Header.js";
+import Menu from "./Menu.js";
+import ReviewPage from "./ReviewPage.js";
+import ContactPage from "./ContactPage";
+
+function CustomerPage() {
+  return (
+    <>
+      <Header />
+      <Menu />
+      <ContactPage />
+      <ReviewPage />
+    </>
+  );
+}
+
+export default CustomerPage;
diff --git a/client/src/component/customer/Header.js b/client/src/component/customer/Header.js
new file mode 100644
index 0000000..3a36ad1
--- /dev/null
+++ b/client/src/component/customer/Header.js
@@ -0,0 +1,255 @@
+import {
+  Box,
+  Flex,
+  Text,
+  IconButton,
+  Button,
+  Stack,
+  Collapse,
+  Icon,
+  Link,
+  Popover,
+  PopoverTrigger,
+  PopoverContent,
+  useColorModeValue,
+  useBreakpointValue,
+  useDisclosure,
+} from "@chakra-ui/react";
+import { HamburgerIcon, CloseIcon, ChevronRightIcon } from "@chakra-ui/icons";
+
+export default function Header() {
+  const { isOpen, onToggle } = useDisclosure();
+
+  return (
+    <Box>
+      <Flex
+        bg={useColorModeValue("white", "gray.800")}
+        color={useColorModeValue("gray.600", "white")}
+        minH={"60px"}
+        py={{ base: 2 }}
+        px={{ base: 4 }}
+        borderBottom={1}
+        borderStyle={"solid"}
+        borderColor={useColorModeValue("gray.200", "gray.900")}
+        align={"center"}
+      >
+        <Flex
+          flex={{ base: 1, md: "auto" }}
+          ml={{ base: -2 }}
+          display={{ base: "flex", md: "none" }}
+        >
+          <IconButton
+            onClick={onToggle}
+            icon={
+              isOpen ? <CloseIcon w={3} h={3} /> : <HamburgerIcon w={5} h={5} />
+            }
+            variant={"ghost"}
+            aria-label={"Toggle Navigation"}
+          />
+        </Flex>
+        <Flex flex={{ base: 1 }} justify={{ base: "center", md: "start" }}>
+          <Text
+            textAlign={useBreakpointValue({ base: "center", md: "left" })}
+            fontFamily={"heading"}
+            color={useColorModeValue("gray.800", "white")}
+          >
+            GURUPRASAD
+          </Text>
+
+          <Flex display={{ base: "none", md: "flex" }} ml={10}>
+            <DesktopNav />
+          </Flex>
+        </Flex>
+
+        <Stack
+          flex={{ base: 1, md: 0 }}
+          justify={"flex-end"}
+          direction={"row"}
+          spacing={6}
+        >
+          <Button
+            as={"a"}
+            fontSize={"sm"}
+            fontWeight={400}
+            variant={"link"}
+            href={"#"}
+          >
+            Sign In
+          </Button>
+          <Button
+            display={{ base: "none", md: "inline-flex" }}
+            fontSize={"sm"}
+            fontWeight={600}
+            color={"white"}
+            bg={"pink.400"}
+            href={"#"}
+            _hover={{
+              bg: "pink.300",
+            }}
+          >
+            Sign Up
+          </Button>
+        </Stack>
+      </Flex>
+
+      <Collapse in={isOpen} animateOpacity>
+        <MobileNav />
+      </Collapse>
+    </Box>
+  );
+}
+
+const DesktopNav = () => {
+  const linkColor = useColorModeValue("gray.600", "gray.200");
+  const linkHoverColor = useColorModeValue("gray.800", "white");
+  const popoverContentBgColor = useColorModeValue("white", "gray.800");
+
+  return (
+    <Stack direction={"row"} spacing={4}>
+      {NAV_ITEMS.map((navItem) => (
+        <Box key={navItem.label}>
+          <Popover trigger={"hover"} placement={"bottom-start"}>
+            <PopoverTrigger>
+              <Link
+                p={2}
+                href={navItem.href ?? "#"}
+                fontSize={"sm"}
+                fontWeight={500}
+                color={linkColor}
+                _hover={{
+                  textDecoration: "none",
+                  color: linkHoverColor,
+                }}
+              >
+                {navItem.label}
+              </Link>
+            </PopoverTrigger>
+
+            {navItem.children && (
+              <PopoverContent
+                border={0}
+                boxShadow={"xl"}
+                bg={popoverContentBgColor}
+                p={4}
+                rounded={"xl"}
+                minW={"sm"}
+              >
+                <Stack>
+                  {navItem.children.map((child) => (
+                    <DesktopSubNav key={child.label} {...child} />
+                  ))}
+                </Stack>
+              </PopoverContent>
+            )}
+          </Popover>
+        </Box>
+      ))}
+    </Stack>
+  );
+};
+
+const DesktopSubNav = ({ label, href, subLabel }: NavItem) => {
+  return (
+    <Link
+      href={href}
+      role={"group"}
+      display={"block"}
+      p={2}
+      rounded={"md"}
+      _hover={{ bg: useColorModeValue("pink.50", "gray.900") }}
+    >
+      <Stack direction={"row"} align={"center"}>
+        <Box>
+          <Text
+            transition={"all .3s ease"}
+            _groupHover={{ color: "pink.400" }}
+            fontWeight={500}
+          >
+            {label}
+          </Text>
+          <Text fontSize={"sm"}>{subLabel}</Text>
+        </Box>
+        <Flex
+          transition={"all .3s ease"}
+          transform={"translateX(-10px)"}
+          opacity={0}
+          _groupHover={{ opacity: "100%", transform: "translateX(0)" }}
+          justify={"flex-end"}
+          align={"center"}
+          flex={1}
+        >
+          <Icon color={"pink.400"} w={5} h={5} as={ChevronRightIcon} />
+        </Flex>
+      </Stack>
+    </Link>
+  );
+};
+
+const MobileNav = () => {
+  return (
+    <Stack
+      bg={useColorModeValue("white", "gray.800")}
+      p={4}
+      display={{ md: "none" }}
+    >
+      {NAV_ITEMS.map((navItem) => (
+        <MobileNavItem key={navItem.label} {...navItem} />
+      ))}
+    </Stack>
+  );
+};
+
+const MobileNavItem = ({ label, href }: NavItem) => {
+  const { isOpen, onToggle } = useDisclosure();
+
+  return (
+    <Stack spacing={4} onClick={onToggle}>
+      <Flex
+        py={2}
+        as={Link}
+        href={href ?? "#"}
+        justify={"space-between"}
+        align={"center"}
+        _hover={{
+          textDecoration: "none",
+        }}
+      >
+        <Text
+          fontWeight={600}
+          color={useColorModeValue("gray.600", "gray.200")}
+        >
+          {label}
+        </Text>
+      </Flex>
+    </Stack>
+  );
+};
+
+interface NavItem {
+  label: string;
+  subLabel?: string;
+  children?: Array<NavItem>;
+  href?: string;
+}
+
+const NAV_ITEMS: Array<NavItem> = [
+  {
+    label: "Home",
+  },
+  {
+    label: "Menu",
+    href: "#",
+  },
+  {
+    label: "Contact Us",
+    href: "#",
+  },
+  {
+    label: "Reviews",
+    href: "#",
+  },
+  {
+    label: "Cart",
+    href: "#",
+  },
+];
diff --git a/client/src/component/customer/Menu.js b/client/src/component/customer/Menu.js
new file mode 100644
index 0000000..1d96ffd
--- /dev/null
+++ b/client/src/component/customer/Menu.js
@@ -0,0 +1,166 @@
+import { useState, useEffect } from "react";
+import { getAllItem } from "../../api/categoryApi";
+
+import {
+  Box,
+  Flex,
+  Heading,
+  Text,
+  Stack,
+  Container,
+  Button,
+  Spacer,
+  useColorModeValue,
+  Icon,
+} from "@chakra-ui/react";
+
+import { FaRupeeSign } from "react-icons/fa";
+
+const ItemContent = ({ children }) => {
+  return (
+    <Stack
+      columns={{ sm: 2, md: 4 }}
+      bg={useColorModeValue("white", "gray.800")}
+      boxShadow={"lg"}
+      p={8}
+      rounded={"xl"}
+      align={"center"}
+      pos={"relative"}
+      _after={{
+        content: `""`,
+        w: 0,
+        h: 0,
+        borderLeft: "solid transparent",
+        borderLeftWidth: 16,
+        borderRight: "solid transparent",
+        borderRightWidth: 16,
+        borderTop: "solid",
+        // borderTopWidth: 16,
+        borderTopColor: useColorModeValue("white", "gray.800"),
+        pos: "absolute",
+        // bottom: "-16px",
+        left: "50%",
+        transform: "translateX(-50%)",
+      }}
+    >
+      {children}
+    </Stack>
+  );
+};
+
+export default function Menu() {
+  const [earlyBreakfast, setEarlyBreakfast] = useState([]);
+  const [breakfast, setBreakfast] = useState([]);
+  const [supper, setSupper] = useState([]);
+  const [beverages, setBeverages] = useState([]);
+
+  const getEarlyBreakfast = async () => {
+    setEarlyBreakfast(await getAllItem(1));
+  };
+
+  useEffect(() => {
+    getEarlyBreakfast();
+  }, []);
+
+  const getBreakfast = async () => {
+    setBreakfast(await getAllItem(2));
+  };
+
+  useEffect(() => {
+    getBreakfast();
+  }, []);
+
+  const getSupper = async () => {
+    setSupper(await getAllItem(3));
+  };
+
+  useEffect(() => {
+    getSupper();
+  }, []);
+
+  const getBeverages = async () => {
+    setBeverages(await getAllItem(4));
+  };
+
+  useEffect(() => {
+    getBeverages();
+  }, []);
+
+  console.log(earlyBreakfast);
+  let arr = [earlyBreakfast, breakfast, supper, beverages];
+  // console.log(arr);
+
+  return (
+    <>
+      {arr.map((category) => {
+        if (!category || !category.items) return null;
+        return (
+          <Box bg="gray.50" spacing="8" key={category.categoryId}>
+            <Container maxW={"7xl"} py={16} as={Stack} spacing={12}>
+              <Stack spacing={0} align={"center"}>
+                <Heading>{category.categoryName}</Heading>
+                <Text>{category.description}</Text>
+              </Stack>
+              <Stack
+                direction={{ base: "column", md: "row" }}
+                spacing={{ base: 10, md: 4, lg: 10 }}
+              >
+                {category.items.map((item) => {
+                  return (
+                    <Box key={item.id}>
+                      <ItemContent>
+                        <Heading size="md">{item.item_name}</Heading>
+                        <Flex
+                          minWidth="max-content"
+                          alignItems="center"
+                          gap="2"
+                        >
+                          <Box p="2">
+                            <Text size="md">
+                              <Icon as={FaRupeeSign} />
+                              {item.price}
+                            </Text>
+                          </Box>
+                          <Spacer />
+
+                          <Button colorScheme="teal">Order Now</Button>
+                        </Flex>
+                      </ItemContent>
+                    </Box>
+                  );
+                })}
+              </Stack>
+            </Container>
+          </Box>
+        );
+      })}
+    </>
+  );
+}
+
+//   const getCategory = async (id) => setItem(await getAllItem(id));
+//   useEffect(() => {
+//     category.forEach(getCategory);
+//   }, [category]);
+
+//   useEffect(() => {
+//     let controller = new AbortController();
+//     debugger;
+//     (async (id) => {
+//       try {
+//         const url = new URL("/api/getByCategories", document.location);
+//         [1, 2, 3, 4].forEach((id) => url.searchParams.append("categoryId", id));
+//         const response = await fetch(url.toString(), {
+//           signal: controller.signal,
+//         });
+//         setItem(await response.json());
+//         controller = null;
+//       } catch (e) {
+//         // Handle fetch error
+//         console.log(e);
+//       }
+//     })();
+//     return () => controller?.abort;
+//   }, []);
+
+//console.log(item);
diff --git a/client/src/component/customer/ReviewPage.js b/client/src/component/customer/ReviewPage.js
new file mode 100644
index 0000000..ac8c4c0
--- /dev/null
+++ b/client/src/component/customer/ReviewPage.js
@@ -0,0 +1,119 @@
+import { useState, useEffect } from "react";
+
+import { getReviews } from "../../api/googleApi.js";
+
+import { Box, Text } from "@chakra-ui/react";
+
+import { Avatar, Stack } from "@chakra-ui/react";
+import { StarIcon } from "@chakra-ui/icons";
+
+function ReviewPage() {
+  const [apiData, setApiData] = useState(null);
+
+  const getApiData = async () => {
+    setApiData(await getReviews());
+  };
+
+  useEffect(() => {
+    getApiData();
+  }, []);
+
+  return apiData ? (
+    <>
+      <Box
+        mt="1"
+        fontWeight="semibold"
+        as="h1"
+        fontSize="4xl"
+        // lineHeight="tight"
+        noOfLines={1}
+      >
+        Hotel GURUPRASAD
+      </Box>
+      <Box
+        color="gray.500"
+        fontWeight="semibold"
+        letterSpacing="wide"
+        fontSize="md"
+      >
+        Ujire, Karnataka 574240, India
+      </Box>
+      <Box display="flex" alignItems="baseline">
+        <Box display="flex" mt="2" alignItems="center">
+          {Array(5)
+            .fill("")
+            .map((_, i) => (
+              <StarIcon
+                key={i}
+                color={i < apiData.result.rating ? "orange.500" : "gray.300"}
+              />
+            ))}
+        </Box>
+        <Box as="span" ml="2" color="gray.600" fontSize="sm">
+          {apiData.result.user_ratings_total} reviews
+        </Box>
+      </Box>
+      {/* Mapping*/}
+
+      {apiData.result.reviews.map((review) => {
+        return (
+          <Box
+            borderWidth="1px"
+            borderRadius="lg"
+            overflow="hidden"
+            key={author.time}
+          >
+            {" "}
+            <Stack spacing={8} direction="row">
+              {" "}
+              <Box>
+                <Avatar
+                  mt="1"
+                  ml="1"
+                  size="md"
+                  name={author.author_name}
+                  src={author.author_url}
+                />{" "}
+              </Box>{" "}
+              <Box>
+                {" "}
+                <Box
+                  mt="1"
+                  fontWeight="semibold"
+                  as="h4"
+                  lineHeight="tight"
+                  noOfLines={1}
+                >
+                  {author.author_name}
+                </Box>
+                <Box
+                  color="gray.500"
+                  fontWeight="semibold"
+                  letterSpacing="wide"
+                  fontSize="xs"
+                >
+                  {author.relative_time_description}
+                </Box>
+                <Box display="flex" mt="2" alignItems="center">
+                  {Array(5)
+                    .fill("")
+                    .map((_, i) => (
+                      <StarIcon
+                        key={i}
+                        color={i < author.rating ? "orange.500" : "gray.300"}
+                      />
+                    ))}
+                </Box>
+                <Text>{author.text}</Text>
+              </Box>
+            </Stack>
+          </Box>
+        );
+      })}
+    </>
+  ) : (
+    <Text>Loading.....</Text>
+  );
+}
+
+export default ReviewPage;
diff --git a/package-lock.json b/package-lock.json
index 66057ca..555f3be 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -5,9 +5,18 @@
   "packages": {
     "": {
       "dependencies": {
+        "concurrently": "^7.5.0",
         "create-react-app": "^5.0.0"
       }
     },
+    "node_modules/ansi-regex": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/ansi-styles": {
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
@@ -72,6 +81,19 @@
         "url": "https://github.com/chalk/chalk?sponsor=1"
       }
     },
+    "node_modules/cliui": {
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz",
+      "integrity": "sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==",
+      "dependencies": {
+        "string-width": "^4.2.0",
+        "strip-ansi": "^6.0.1",
+        "wrap-ansi": "^7.0.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
     "node_modules/color-convert": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
@@ -101,6 +123,46 @@
       "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
       "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg=="
     },
+    "node_modules/concurrently": {
+      "version": "7.5.0",
+      "resolved": "https://registry.npmjs.org/concurrently/-/concurrently-7.5.0.tgz",
+      "integrity": "sha512-5E3mwiS+i2JYBzr5BpXkFxOnleZTMsG+WnE/dCG4/P+oiVXrbmrBwJ2ozn4SxwB2EZDrKR568X+puVohxz3/Mg==",
+      "dependencies": {
+        "chalk": "^4.1.0",
+        "date-fns": "^2.29.1",
+        "lodash": "^4.17.21",
+        "rxjs": "^7.0.0",
+        "shell-quote": "^1.7.3",
+        "spawn-command": "^0.0.2-1",
+        "supports-color": "^8.1.0",
+        "tree-kill": "^1.2.2",
+        "yargs": "^17.3.1"
+      },
+      "bin": {
+        "conc": "dist/bin/concurrently.js",
+        "concurrently": "dist/bin/concurrently.js"
+      },
+      "engines": {
+        "node": "^12.20.0 || ^14.13.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/open-cli-tools/concurrently?sponsor=1"
+      }
+    },
+    "node_modules/concurrently/node_modules/supports-color": {
+      "version": "8.1.1",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-8.1.1.tgz",
+      "integrity": "sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==",
+      "dependencies": {
+        "has-flag": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/supports-color?sponsor=1"
+      }
+    },
     "node_modules/core-util-is": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.3.tgz",
@@ -143,6 +205,18 @@
         "node": ">= 8"
       }
     },
+    "node_modules/date-fns": {
+      "version": "2.29.3",
+      "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.29.3.tgz",
+      "integrity": "sha512-dDCnyH2WnnKusqvZZ6+jA1O51Ibt8ZMRNkDZdyAyK4YfbDwa/cEmuztzG5pk6hqlp9aSBPYcjOlktquahGwGeA==",
+      "engines": {
+        "node": ">=0.11"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/date-fns"
+      }
+    },
     "node_modules/debug": {
       "version": "2.6.9",
       "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
@@ -159,6 +233,11 @@
         "readable-stream": "~1.1.9"
       }
     },
+    "node_modules/emoji-regex": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="
+    },
     "node_modules/envinfo": {
       "version": "7.8.1",
       "resolved": "https://registry.npmjs.org/envinfo/-/envinfo-7.8.1.tgz",
@@ -170,6 +249,14 @@
         "node": ">=4"
       }
     },
+    "node_modules/escalade": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.1.tgz",
+      "integrity": "sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==",
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/fs-extra": {
       "version": "10.1.0",
       "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-10.1.0.tgz",
@@ -212,6 +299,14 @@
         "minimatch": "^3.0.0"
       }
     },
+    "node_modules/get-caller-file": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
+      "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
+      "engines": {
+        "node": "6.* || 8.* || >= 10.*"
+      }
+    },
     "node_modules/glob": {
       "version": "7.2.3",
       "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz",
@@ -268,6 +363,14 @@
       "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
       "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ=="
     },
+    "node_modules/is-fullwidth-code-point": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
+      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/isarray": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
@@ -297,6 +400,11 @@
         "node": ">=6"
       }
     },
+    "node_modules/lodash": {
+      "version": "4.17.21",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
+      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
+    },
     "node_modules/lru-cache": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
@@ -395,6 +503,14 @@
         "string_decoder": "~0.10.x"
       }
     },
+    "node_modules/require-directory": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
+      "integrity": "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/rimraf": {
       "version": "2.7.1",
       "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
@@ -406,6 +522,14 @@
         "rimraf": "bin.js"
       }
     },
+    "node_modules/rxjs": {
+      "version": "7.5.7",
+      "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.5.7.tgz",
+      "integrity": "sha512-z9MzKh/UcOqB3i20H6rtrlaE/CgjLOvheWK/9ILrbhROGTweAi1BaFsTT9FbwZi5Trr1qNRs+MXkhmR06awzQA==",
+      "dependencies": {
+        "tslib": "^2.1.0"
+      }
+    },
     "node_modules/safe-buffer": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
@@ -444,16 +568,53 @@
         "node": ">=8"
       }
     },
+    "node_modules/shell-quote": {
+      "version": "1.7.4",
+      "resolved": "https://registry.npmjs.org/shell-quote/-/shell-quote-1.7.4.tgz",
+      "integrity": "sha512-8o/QEhSSRb1a5i7TFR0iM4G16Z0vYB2OQVs4G3aAFXjn3T6yEx8AZxy1PgDF7I00LZHYA3WxaSYIf5e5sAX8Rw==",
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/sisteransi": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/sisteransi/-/sisteransi-1.0.5.tgz",
       "integrity": "sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg=="
     },
+    "node_modules/spawn-command": {
+      "version": "0.0.2-1",
+      "resolved": "https://registry.npmjs.org/spawn-command/-/spawn-command-0.0.2-1.tgz",
+      "integrity": "sha512-n98l9E2RMSJ9ON1AKisHzz7V42VDiBQGY6PB1BwRglz99wpVsSuGzQ+jOi6lFXBGVTCrRpltvjm+/XA+tpeJrg=="
+    },
     "node_modules/string_decoder": {
       "version": "0.10.31",
       "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
       "integrity": "sha512-ev2QzSzWPYmy9GuqfIVildA4OdcGLeFZQrq5ys6RtiuF+RQQiZWr8TZNyAcuVXyQRYfEO+MsoB/1BuQVhOJuoQ=="
     },
+    "node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/strip-ansi": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/supports-color": {
       "version": "7.2.0",
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
@@ -563,6 +724,19 @@
         "url": "https://github.com/sponsors/isaacs"
       }
     },
+    "node_modules/tree-kill": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/tree-kill/-/tree-kill-1.2.2.tgz",
+      "integrity": "sha512-L0Orpi8qGpRG//Nd+H90vFB+3iHnue1zSSGmNOOCh1GLJ7rUKVwV2HvijphGQS2UmhUZewS9VgvxYIdgr+fG1A==",
+      "bin": {
+        "tree-kill": "cli.js"
+      }
+    },
+    "node_modules/tslib": {
+      "version": "2.4.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.4.1.tgz",
+      "integrity": "sha512-tGyy4dAjRIEwI7BzsB0lynWgOpfqjUdq91XXAlIWD2OwKBH7oCl/GZG/HT4BOHrTlPMOASlMQ7veyTqpmRcrNA=="
+    },
     "node_modules/uid-number": {
       "version": "0.0.6",
       "resolved": "https://registry.npmjs.org/uid-number/-/uid-number-0.0.6.tgz",
@@ -606,6 +780,22 @@
         "node": ">= 8"
       }
     },
+    "node_modules/wrap-ansi": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
+      "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
     "node_modules/wrappy": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
@@ -619,13 +809,51 @@
         "node": ">=0.4"
       }
     },
+    "node_modules/y18n": {
+      "version": "5.0.8",
+      "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
+      "integrity": "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==",
+      "engines": {
+        "node": ">=10"
+      }
+    },
     "node_modules/yallist": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
       "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
+    },
+    "node_modules/yargs": {
+      "version": "17.6.0",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-17.6.0.tgz",
+      "integrity": "sha512-8H/wTDqlSwoSnScvV2N/JHfLWOKuh5MVla9hqLjK3nsfyy6Y4kDSYSvkU5YCUEPOSnRXfIyx3Sq+B/IWudTo4g==",
+      "dependencies": {
+        "cliui": "^8.0.1",
+        "escalade": "^3.1.1",
+        "get-caller-file": "^2.0.5",
+        "require-directory": "^2.1.1",
+        "string-width": "^4.2.3",
+        "y18n": "^5.0.5",
+        "yargs-parser": "^21.0.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/yargs-parser": {
+      "version": "21.1.1",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz",
+      "integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==",
+      "engines": {
+        "node": ">=12"
+      }
     }
   },
   "dependencies": {
+    "ansi-regex": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ=="
+    },
     "ansi-styles": {
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
@@ -675,6 +903,16 @@
         "supports-color": "^7.1.0"
       }
     },
+    "cliui": {
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz",
+      "integrity": "sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==",
+      "requires": {
+        "string-width": "^4.2.0",
+        "strip-ansi": "^6.0.1",
+        "wrap-ansi": "^7.0.0"
+      }
+    },
     "color-convert": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
@@ -698,6 +936,32 @@
       "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
       "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg=="
     },
+    "concurrently": {
+      "version": "7.5.0",
+      "resolved": "https://registry.npmjs.org/concurrently/-/concurrently-7.5.0.tgz",
+      "integrity": "sha512-5E3mwiS+i2JYBzr5BpXkFxOnleZTMsG+WnE/dCG4/P+oiVXrbmrBwJ2ozn4SxwB2EZDrKR568X+puVohxz3/Mg==",
+      "requires": {
+        "chalk": "^4.1.0",
+        "date-fns": "^2.29.1",
+        "lodash": "^4.17.21",
+        "rxjs": "^7.0.0",
+        "shell-quote": "^1.7.3",
+        "spawn-command": "^0.0.2-1",
+        "supports-color": "^8.1.0",
+        "tree-kill": "^1.2.2",
+        "yargs": "^17.3.1"
+      },
+      "dependencies": {
+        "supports-color": {
+          "version": "8.1.1",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-8.1.1.tgz",
+          "integrity": "sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==",
+          "requires": {
+            "has-flag": "^4.0.0"
+          }
+        }
+      }
+    },
     "core-util-is": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.3.tgz",
@@ -731,6 +995,11 @@
         "which": "^2.0.1"
       }
     },
+    "date-fns": {
+      "version": "2.29.3",
+      "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.29.3.tgz",
+      "integrity": "sha512-dDCnyH2WnnKusqvZZ6+jA1O51Ibt8ZMRNkDZdyAyK4YfbDwa/cEmuztzG5pk6hqlp9aSBPYcjOlktquahGwGeA=="
+    },
     "debug": {
       "version": "2.6.9",
       "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
@@ -747,11 +1016,21 @@
         "readable-stream": "~1.1.9"
       }
     },
+    "emoji-regex": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="
+    },
     "envinfo": {
       "version": "7.8.1",
       "resolved": "https://registry.npmjs.org/envinfo/-/envinfo-7.8.1.tgz",
       "integrity": "sha512-/o+BXHmB7ocbHEAs6F2EnG0ogybVVUdkRunTT2glZU9XAaGmhqskrvKwqXuDfNjEO0LZKWdejEEpnq8aM0tOaw=="
     },
+    "escalade": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.1.tgz",
+      "integrity": "sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw=="
+    },
     "fs-extra": {
       "version": "10.1.0",
       "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-10.1.0.tgz",
@@ -788,6 +1067,11 @@
         "minimatch": "^3.0.0"
       }
     },
+    "get-caller-file": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
+      "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg=="
+    },
     "glob": {
       "version": "7.2.3",
       "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz",
@@ -835,6 +1119,11 @@
       "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
       "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ=="
     },
+    "is-fullwidth-code-point": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
+      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg=="
+    },
     "isarray": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
@@ -859,6 +1148,11 @@
       "resolved": "https://registry.npmjs.org/kleur/-/kleur-3.0.3.tgz",
       "integrity": "sha512-eTIzlVOSUR+JxdDFepEYcBMtZ9Qqdef+rnzWdRZuMbOywu5tO2w2N7rqjoANZ5k9vywhL6Br1VRjUIgTQx4E8w=="
     },
+    "lodash": {
+      "version": "4.17.21",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
+      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
+    },
     "lru-cache": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
@@ -936,6 +1230,11 @@
         "string_decoder": "~0.10.x"
       }
     },
+    "require-directory": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
+      "integrity": "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q=="
+    },
     "rimraf": {
       "version": "2.7.1",
       "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
@@ -944,6 +1243,14 @@
         "glob": "^7.1.3"
       }
     },
+    "rxjs": {
+      "version": "7.5.7",
+      "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.5.7.tgz",
+      "integrity": "sha512-z9MzKh/UcOqB3i20H6rtrlaE/CgjLOvheWK/9ILrbhROGTweAi1BaFsTT9FbwZi5Trr1qNRs+MXkhmR06awzQA==",
+      "requires": {
+        "tslib": "^2.1.0"
+      }
+    },
     "safe-buffer": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
@@ -970,16 +1277,44 @@
       "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz",
       "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A=="
     },
+    "shell-quote": {
+      "version": "1.7.4",
+      "resolved": "https://registry.npmjs.org/shell-quote/-/shell-quote-1.7.4.tgz",
+      "integrity": "sha512-8o/QEhSSRb1a5i7TFR0iM4G16Z0vYB2OQVs4G3aAFXjn3T6yEx8AZxy1PgDF7I00LZHYA3WxaSYIf5e5sAX8Rw=="
+    },
     "sisteransi": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/sisteransi/-/sisteransi-1.0.5.tgz",
       "integrity": "sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg=="
     },
+    "spawn-command": {
+      "version": "0.0.2-1",
+      "resolved": "https://registry.npmjs.org/spawn-command/-/spawn-command-0.0.2-1.tgz",
+      "integrity": "sha512-n98l9E2RMSJ9ON1AKisHzz7V42VDiBQGY6PB1BwRglz99wpVsSuGzQ+jOi6lFXBGVTCrRpltvjm+/XA+tpeJrg=="
+    },
     "string_decoder": {
       "version": "0.10.31",
       "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
       "integrity": "sha512-ev2QzSzWPYmy9GuqfIVildA4OdcGLeFZQrq5ys6RtiuF+RQQiZWr8TZNyAcuVXyQRYfEO+MsoB/1BuQVhOJuoQ=="
     },
+    "string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "requires": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      }
+    },
+    "strip-ansi": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "requires": {
+        "ansi-regex": "^5.0.1"
+      }
+    },
     "supports-color": {
       "version": "7.2.0",
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
@@ -1082,6 +1417,16 @@
         }
       }
     },
+    "tree-kill": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/tree-kill/-/tree-kill-1.2.2.tgz",
+      "integrity": "sha512-L0Orpi8qGpRG//Nd+H90vFB+3iHnue1zSSGmNOOCh1GLJ7rUKVwV2HvijphGQS2UmhUZewS9VgvxYIdgr+fG1A=="
+    },
+    "tslib": {
+      "version": "2.4.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.4.1.tgz",
+      "integrity": "sha512-tGyy4dAjRIEwI7BzsB0lynWgOpfqjUdq91XXAlIWD2OwKBH7oCl/GZG/HT4BOHrTlPMOASlMQ7veyTqpmRcrNA=="
+    },
     "uid-number": {
       "version": "0.0.6",
       "resolved": "https://registry.npmjs.org/uid-number/-/uid-number-0.0.6.tgz",
@@ -1113,6 +1458,16 @@
         "isexe": "^2.0.0"
       }
     },
+    "wrap-ansi": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
+      "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
+      "requires": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      }
+    },
     "wrappy": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
@@ -1123,10 +1478,34 @@
       "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz",
       "integrity": "sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ=="
     },
+    "y18n": {
+      "version": "5.0.8",
+      "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
+      "integrity": "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA=="
+    },
     "yallist": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
       "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
+    },
+    "yargs": {
+      "version": "17.6.0",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-17.6.0.tgz",
+      "integrity": "sha512-8H/wTDqlSwoSnScvV2N/JHfLWOKuh5MVla9hqLjK3nsfyy6Y4kDSYSvkU5YCUEPOSnRXfIyx3Sq+B/IWudTo4g==",
+      "requires": {
+        "cliui": "^8.0.1",
+        "escalade": "^3.1.1",
+        "get-caller-file": "^2.0.5",
+        "require-directory": "^2.1.1",
+        "string-width": "^4.2.3",
+        "y18n": "^5.0.5",
+        "yargs-parser": "^21.0.0"
+      }
+    },
+    "yargs-parser": {
+      "version": "21.1.1",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz",
+      "integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw=="
     }
   }
 }
diff --git a/package.json b/package.json
index 02bf444..7f7d6d1 100644
--- a/package.json
+++ b/package.json
@@ -1,5 +1,6 @@
 {
   "dependencies": {
+    "concurrently": "^7.5.0",
     "create-react-app": "^5.0.0"
   }
 }
diff --git a/server/.env.example b/server/.env.example
index 6569ce6..1a170ea 100644
--- a/server/.env.example
+++ b/server/.env.example
@@ -1 +1,3 @@
-DATABASE_URL="postgres://localhost:5432/guruprasad"
\ No newline at end of file
+DATABASE_URL="postgres://localhost:5432/guruprasad"
+GOOGLE_API=GoogleApiKeyGoesHere
+PLACE_ID=GooglePlaceIdGoesHere
\ No newline at end of file
diff --git a/server/api/googleApi.js b/server/api/googleApi.js
new file mode 100644
index 0000000..6ee742a
--- /dev/null
+++ b/server/api/googleApi.js
@@ -0,0 +1,34 @@
+import express from "express";
+import fetch from "node-fetch";
+
+import { mockGoogleApiData } from "./mockGoogleApiData .js";
+
+const router = express.Router();
+
+// MOCK-API-DATA FETCHING
+
+router.get("/reviews", async (req, res) => {
+  res.json(mockGoogleApiData);
+});
+
+/*
+// REAL API FETCHING --- Don't Delete
+
+router.get("/reviews", async (req, res) => {
+  const url = `https://maps.googleapis.com/maps/api/place/details/json?placeid=${process.env.PLACE_ID}&key=${process.env.GOOGLE_API}`;
+
+  try {
+    const googleApiResponse = await fetch(url);
+
+    if (!googleApiResponse.ok) throw await googleApiResponse.json();
+    console.log(googleApiResponse);
+    return res.json(await googleApiResponse.json());
+  } catch (error) {
+    console.log(error);
+    return res.status(400).json({ error: "Failed to get reviews" });
+  }
+});
+
+*/
+
+export default router;
diff --git a/server/api/mockGoogleApiData .js b/server/api/mockGoogleApiData .js
new file mode 100644
index 0000000..f363857
--- /dev/null
+++ b/server/api/mockGoogleApiData .js	
@@ -0,0 +1,420 @@
+export const mockGoogleApiData = {
+  html_attributions: [],
+  result: {
+    address_components: [
+      {
+        long_name: "Ujire",
+        short_name: "Ujire",
+        types: ["locality", "political"],
+      },
+      {
+        long_name: "Dakshina Kannada",
+        short_name: "Dakshina Kannada",
+        types: ["administrative_area_level_2", "political"],
+      },
+      {
+        long_name: "Karnataka",
+        short_name: "KA",
+        types: ["administrative_area_level_1", "political"],
+      },
+      {
+        long_name: "India",
+        short_name: "IN",
+        types: ["country", "political"],
+      },
+      {
+        long_name: "574240",
+        short_name: "574240",
+        types: ["postal_code"],
+      },
+    ],
+    adr_address:
+      '<span class="locality">Ujire</span>, <span class="region">Karnataka</span> <span class="postal-code">574240</span>, <span class="country-name">India</span>',
+    business_status: "OPERATIONAL",
+    curbside_pickup: false,
+    current_opening_hours: {
+      open_now: true,
+      periods: [
+        {
+          close: {
+            date: "2022-11-06",
+            day: 0,
+            time: "2000",
+          },
+          open: {
+            date: "2022-11-06",
+            day: 0,
+            time: "0600",
+          },
+        },
+        {
+          close: {
+            date: "2022-11-07",
+            day: 1,
+            time: "2000",
+          },
+          open: {
+            date: "2022-11-07",
+            day: 1,
+            time: "0600",
+          },
+        },
+        {
+          close: {
+            date: "2022-11-08",
+            day: 2,
+            time: "2000",
+          },
+          open: {
+            date: "2022-11-08",
+            day: 2,
+            time: "0600",
+          },
+        },
+        {
+          close: {
+            date: "2022-11-02",
+            day: 3,
+            time: "2000",
+          },
+          open: {
+            date: "2022-11-02",
+            day: 3,
+            time: "0600",
+          },
+        },
+        {
+          close: {
+            date: "2022-11-03",
+            day: 4,
+            time: "2000",
+          },
+          open: {
+            date: "2022-11-03",
+            day: 4,
+            time: "0600",
+          },
+        },
+        {
+          close: {
+            date: "2022-11-04",
+            day: 5,
+            time: "2000",
+          },
+          open: {
+            date: "2022-11-04",
+            day: 5,
+            time: "0600",
+          },
+        },
+        {
+          close: {
+            date: "2022-11-05",
+            day: 6,
+            time: "2000",
+          },
+          open: {
+            date: "2022-11-05",
+            day: 6,
+            time: "0600",
+          },
+        },
+      ],
+      weekday_text: [
+        "Monday: 6:00 AM – 8:00 PM",
+        "Tuesday: 6:00 AM – 8:00 PM",
+        "Wednesday: 6:00 AM – 8:00 PM",
+        "Thursday: 6:00 AM – 8:00 PM",
+        "Friday: 6:00 AM – 8:00 PM",
+        "Saturday: 6:00 AM – 8:00 PM",
+        "Sunday: 6:00 AM – 8:00 PM",
+      ],
+    },
+    delivery: true,
+    dine_in: true,
+    formatted_address: "Ujire, Karnataka 574240, India",
+    geometry: {
+      location: {
+        lat: 12.9958384,
+        lng: 75.3291491,
+      },
+      viewport: {
+        northeast: {
+          lat: 12.99711358029151,
+          lng: 75.3304780802915,
+        },
+        southwest: {
+          lat: 12.9944156197085,
+          lng: 75.32778011970849,
+        },
+      },
+    },
+    icon: "https://maps.gstatic.com/mapfiles/place_api/icons/v1/png_71/restaurant-71.png",
+    icon_background_color: "#FF9E67",
+    icon_mask_base_uri:
+      "https://maps.gstatic.com/mapfiles/place_api/icons/v2/restaurant_pinlet",
+    name: "Hotel GURUPRASAD",
+    opening_hours: {
+      open_now: true,
+      periods: [
+        {
+          close: {
+            day: 0,
+            time: "2000",
+          },
+          open: {
+            day: 0,
+            time: "0600",
+          },
+        },
+        {
+          close: {
+            day: 1,
+            time: "2000",
+          },
+          open: {
+            day: 1,
+            time: "0600",
+          },
+        },
+        {
+          close: {
+            day: 2,
+            time: "2000",
+          },
+          open: {
+            day: 2,
+            time: "0600",
+          },
+        },
+        {
+          close: {
+            day: 3,
+            time: "2000",
+          },
+          open: {
+            day: 3,
+            time: "0600",
+          },
+        },
+        {
+          close: {
+            day: 4,
+            time: "2000",
+          },
+          open: {
+            day: 4,
+            time: "0600",
+          },
+        },
+        {
+          close: {
+            day: 5,
+            time: "2000",
+          },
+          open: {
+            day: 5,
+            time: "0600",
+          },
+        },
+        {
+          close: {
+            day: 6,
+            time: "2000",
+          },
+          open: {
+            day: 6,
+            time: "0600",
+          },
+        },
+      ],
+      weekday_text: [
+        "Monday: 6:00 AM – 8:00 PM",
+        "Tuesday: 6:00 AM – 8:00 PM",
+        "Wednesday: 6:00 AM – 8:00 PM",
+        "Thursday: 6:00 AM – 8:00 PM",
+        "Friday: 6:00 AM – 8:00 PM",
+        "Saturday: 6:00 AM – 8:00 PM",
+        "Sunday: 6:00 AM – 8:00 PM",
+      ],
+    },
+    photos: [
+      {
+        height: 4000,
+        html_attributions: [
+          '<a href="https://maps.google.com/maps/contrib/100349982341522168328">Shivakiran Holla</a>',
+        ],
+        photo_reference:
+          "AcYSjRikn4NFLjsaCcAdFMyI57H_XNbQEU98oEeEefQ6up2pNZyuQYtsbmHtm9eydaurhC8B9pAtORgInXu05SaoCuVb9gR8PwPR5T7uvW9hUyjIwKEvtbBK4pUFP0MY-y7vYp5SFHgZPWPp7UzI1Y72zuJ0S5JNe1nI-sHyN8QEuCQ6JRuh",
+        width: 3000,
+      },
+      {
+        height: 2604,
+        html_attributions: [
+          '<a href="https://maps.google.com/maps/contrib/101109258941337353837">Hotel GURUPRASAD</a>',
+        ],
+        photo_reference:
+          "AcYSjRhl7qPLbzBefBVfH9rGuTRuFYS0mgw462s3l9ALHOmBOCgEZ5sFaaiHloe_rCcLAVjw70xpOdxlb1ysaKFFLZW0pRIPlPADmaU2kOq1e9o1EVqz4TwltolFGePSPHISIrHpQeSMQqSUy4Q8zqMDsPoX3Vwe27jpawMvRriS7j-Z8jAx",
+        width: 4624,
+      },
+      {
+        height: 2604,
+        html_attributions: [
+          '<a href="https://maps.google.com/maps/contrib/101109258941337353837">Hotel GURUPRASAD</a>',
+        ],
+        photo_reference:
+          "AcYSjRhlEsZGtl0DvHZ7HKNNpidLdRY9ni4-0sGkGYDSqQNX9UEF0y5rxzSPEShhJZfFDtCLKafLADiDdfqhh0qmBm3FiNyLjnQ20ZKdq7qWi_v10PyVvsRlrntipGmMDHstt-NV1wBpikAQD3JVPfXsmEE-Axzb0Ea4MXuJvegyN2IuktOP",
+        width: 4624,
+      },
+      {
+        height: 4624,
+        html_attributions: [
+          '<a href="https://maps.google.com/maps/contrib/101109258941337353837">Hotel GURUPRASAD</a>',
+        ],
+        photo_reference:
+          "AcYSjRiRsjqJQPjX1VSmW3zvXXTHOuTcsSfssWmrjmcz4-3U4OTcK761BOChDANvs44Wp6hDO6SlmTnLWD4xE9gODDP5_x5rGD5udknp5RqXvPytagDEr1sE1NyrjVSw_Ij9Ikz_aLHDUl9V7wU-3Q7EBsG1Mt-ppisRUqJvBQsC6r0jwYVf",
+        width: 2604,
+      },
+      {
+        height: 4624,
+        html_attributions: [
+          '<a href="https://maps.google.com/maps/contrib/101109258941337353837">Hotel GURUPRASAD</a>',
+        ],
+        photo_reference:
+          "AcYSjRhdDBzXIFrzwtvCj-S9ahWUIAk9ABR2lYN8eP6OyRyanjYbmGLEO6THNRi48hy9jBmLfxXjqP_fO9V6QaIp8kK3p3qpjgTACT5dcyE8gAKnMwuqBMYKFwBaeF_Bc7E5dBzxUpZYhxW54XUIZyCeDmWx1LvJTlL5amO5GgYfxk8Dew0A",
+        width: 2604,
+      },
+      {
+        height: 4624,
+        html_attributions: [
+          '<a href="https://maps.google.com/maps/contrib/101109258941337353837">Hotel GURUPRASAD</a>',
+        ],
+        photo_reference:
+          "AcYSjRhwvq3YA44DP6jTivUvyZgZxm4AP8L_e0DBKWO8yGpEpsNEAtyu6Fo2jS700VUtH_e0mENHos_AFn_87fVGVLynDbxPzze7CzbdHDmkw9plXjVxny4Z1zyCF-F_UjevoTsFT9OZHaS3YyLL7twvb_y7A5QvUiS1qwF4yc9Sjd4SytBF",
+        width: 2604,
+      },
+      {
+        height: 4624,
+        html_attributions: [
+          '<a href="https://maps.google.com/maps/contrib/101109258941337353837">Hotel GURUPRASAD</a>',
+        ],
+        photo_reference:
+          "AcYSjRgpARfEvLGUk87ow0m1YXGRhl9TbuDlzstUqiA7JsyvIQMfWFjpHhMPKeGk9xMp3cRapyH3KXyfO_Hm7ECudAZen711Su2IlpWHcbwBtQr_V4MtN4Dvc5YPhdl1KD2MbVFcOe0BIWAR5Z-CAmk6qWWs5w3BiJTECvE_oj9I80-FJD9r",
+        width: 2604,
+      },
+      {
+        height: 4624,
+        html_attributions: [
+          '<a href="https://maps.google.com/maps/contrib/101109258941337353837">Hotel GURUPRASAD</a>',
+        ],
+        photo_reference:
+          "AcYSjRh_YMsxrW9ZAS-R2F005-JIyNjZNJZ7fup3Bb_-qIdCnOpAz3bNdszKoLvAcl0KaxSdZrofBWTts7X5Oid5u3JaQKad5-c8te4ZpLAnhpuDIalNOei6TIy94u5t7TxBofLSxwHlaoPylz8rfXcZtvgcSnEtHB9UsS_VywB4hAS3THO7",
+        width: 2604,
+      },
+      {
+        height: 5632,
+        html_attributions: [
+          '<a href="https://maps.google.com/maps/contrib/115916068457797036131">Sanjay J Kamath</a>',
+        ],
+        photo_reference:
+          "AcYSjRgoVaSHU7s1ME01PUHhExvo7ikkDrqFzi19k248SkC-32rXtHQiIgmCE6EiRD8ClH2qcexz0-YBuWVsOMbIuJXYQ_xuXM1RTQgwnEU4YftFA6UyUDvBM4XZcIJkmJvKqu6Q-nPNhhVcJsCuqceYhLhsIUidbf9fcyanAOMFkl_Kxfq5",
+        width: 4224,
+      },
+      {
+        height: 4624,
+        html_attributions: [
+          '<a href="https://maps.google.com/maps/contrib/101109258941337353837">Hotel GURUPRASAD</a>',
+        ],
+        photo_reference:
+          "AcYSjRgZ1ThEtNnx9hXV7iUca9x1YtoAPs6PE_TrfVofftW2Sreex_2zb2zYI0w5hBTc8SguDMQHKmu2ux9HERs9l8JCSrRu6IvbJQeVbGrHwa22YB3fojpCSActC4lnV2XuHsm25aQa4eK9ktCHfQBeHQMIqceLbXerqClEWUTiVH6QNUoV",
+        width: 2604,
+      },
+    ],
+    place_id: "ChIJ0fA_NSW2pDsRrKtvt6ZQd0c",
+    plus_code: {
+      compound_code: "X8WH+8M Ujire, Karnataka, India",
+      global_code: "7J4QX8WH+8M",
+    },
+    rating: 4,
+    reference: "ChIJ0fA_NSW2pDsRrKtvt6ZQd0c",
+    reviews: [
+      {
+        author_name: "Prakash Md",
+        author_url:
+          "https://www.google.com/maps/contrib/102449743532023712387/reviews",
+        language: "en",
+        original_language: "en",
+        profile_photo_url:
+          "https://lh3.googleusercontent.com/a-/ACNPEu8jiVsvPI7MHMKW_WUK_pyu96dsycMimK9a56kv9Bk=s128-c0x00000000-cc-rp-mo-ba6",
+        rating: 5,
+        relative_time_description: "3 years ago",
+        text: "A good hotel for vegetarians near Bus Stand, OPP: Ujire Gate on NH73.\n\nVarieties of Breakfast in the Morning; South Indian Meals in the noon & night.",
+        time: 1567776828,
+        translated: false,
+      },
+      {
+        author_name: "Hareesh Prabhu",
+        author_url:
+          "https://www.google.com/maps/contrib/111588718623771069306/reviews",
+        language: "en",
+        original_language: "en",
+        profile_photo_url:
+          "https://lh3.googleusercontent.com/a/ALm5wu0mCJyd3sjh77uo9mA2jB9M9XsKDmNyNPWtdrXV=s128-c0x00000000-cc-rp-mo-ba4",
+        rating: 1,
+        relative_time_description: "4 months ago",
+        text: "Absolute third class hotel run by an arrogant and irrational owner who thinks customers are beggers. Idli was cold, Set dosa was black (it was charred and the owner says, adjust Maadi). I wonder how on earth this place is rated so high....\nCan't rate as zero since Google doesn't allow it",
+        time: 1654519242,
+        translated: false,
+      },
+      {
+        author_name: "Shivakiran Holla",
+        author_url:
+          "https://www.google.com/maps/contrib/100349982341522168328/reviews",
+        language: "en",
+        original_language: "en",
+        profile_photo_url:
+          "https://lh3.googleusercontent.com/a-/ACNPEu-Fsc_X51OTuJSOFdTG-dEpv9uaDdKCRtlq9PfNvh4=s128-c0x00000000-cc-rp-mo-ba3",
+        rating: 4,
+        relative_time_description: "5 months ago",
+        text: "Great food is your traveling early morning",
+        time: 1653976834,
+        translated: false,
+      },
+      {
+        author_name: "Suresh Anand",
+        author_url:
+          "https://www.google.com/maps/contrib/117866531534164440377/reviews",
+        language: "en",
+        original_language: "en",
+        profile_photo_url:
+          "https://lh3.googleusercontent.com/a-/ACNPEu--Wc2BUVuKL6YzaoUKEhh2hGGFk3BU1vO6QI4UYhg=s128-c0x00000000-cc-rp-mo-ba6",
+        rating: 5,
+        relative_time_description: "4 years ago",
+        text: "Good tasty food. Pure veg. Has car parking for 3-4 cars in front of the hotel. Good and fast  service.",
+        time: 1515344199,
+        translated: false,
+      },
+      {
+        author_name: "Sachin Koparde",
+        author_url:
+          "https://www.google.com/maps/contrib/116838527646794439420/reviews",
+        language: "en",
+        original_language: "en",
+        profile_photo_url:
+          "https://lh3.googleusercontent.com/a-/ACNPEu9RhoQ9qRzS63tXoI2daDasX-vK1bKdoX7w5ENRBdA=s128-c0x00000000-cc-rp-mo-ba5",
+        rating: 3,
+        relative_time_description: "3 years ago",
+        text: "You will get good for reasonable price. The special Mangaluru Buns are available here. You will get good food. When you down come from the Charmadi Ghats and if you are hungry visit this hotel which very near to the Ujire bus stop. If you want to travel towards Chikkamagaluru and wanna take some food this is the right hotel you get. The suppliers attitude may feel some what rigorous and hard. They will take much time to serve you the food. But overall you will get a good food here.",
+        time: 1555504454,
+        translated: false,
+      },
+    ],
+    takeout: true,
+    types: ["restaurant", "point_of_interest", "food", "establishment"],
+    url: "https://maps.google.com/?cid=5149673375893793708",
+    user_ratings_total: 17,
+    utc_offset: 330,
+    vicinity: "Ujire",
+  },
+  status: "OK",
+};
diff --git a/server/package-lock.json b/server/package-lock.json
index 2c3452c..dc26d45 100644
--- a/server/package-lock.json
+++ b/server/package-lock.json
@@ -11,6 +11,7 @@
       "dependencies": {
         "dotenv": "^16.0.3",
         "express": "^4.18.2",
+        "node-fetch": "^3.2.10",
         "pg": "^8.8.0"
       },
       "devDependencies": {
@@ -206,6 +207,14 @@
       "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz",
       "integrity": "sha512-QADzlaHc8icV8I7vbaJXJwod9HWYp8uCqf1xa4OfNu1T7JVxQIrUgOWtHdNDtPiywmFbiS12VjotIXLrKM3orQ=="
     },
+    "node_modules/data-uri-to-buffer": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/data-uri-to-buffer/-/data-uri-to-buffer-4.0.0.tgz",
+      "integrity": "sha512-Vr3mLBA8qWmcuschSLAOogKgQ/Jwxulv3RNE4FXnYWRGujzrRWQI4m12fQqRkwX06C0KanhLr4hK+GydchZsaA==",
+      "engines": {
+        "node": ">= 12"
+      }
+    },
     "node_modules/debug": {
       "version": "2.6.9",
       "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
@@ -306,6 +315,28 @@
         "node": ">= 0.10.0"
       }
     },
+    "node_modules/fetch-blob": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/fetch-blob/-/fetch-blob-3.2.0.tgz",
+      "integrity": "sha512-7yAQpD2UMJzLi1Dqv7qFYnPbaPx7ZfFK6PiIxQ4PfkGPyNyl2Ugx+a/umUonmKqjhM4DnfbMvdX6otXq83soQQ==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/jimmywarting"
+        },
+        {
+          "type": "paypal",
+          "url": "https://paypal.me/jimmywarting"
+        }
+      ],
+      "dependencies": {
+        "node-domexception": "^1.0.0",
+        "web-streams-polyfill": "^3.0.3"
+      },
+      "engines": {
+        "node": "^12.20 || >= 14.13"
+      }
+    },
     "node_modules/fill-range": {
       "version": "7.0.1",
       "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
@@ -335,6 +366,17 @@
         "node": ">= 0.8"
       }
     },
+    "node_modules/formdata-polyfill": {
+      "version": "4.0.10",
+      "resolved": "https://registry.npmjs.org/formdata-polyfill/-/formdata-polyfill-4.0.10.tgz",
+      "integrity": "sha512-buewHzMvYL29jdeQTVILecSaZKnt/RJWjoZCF5OW60Z67/GmSLBkOFM7qh1PI3zFNtJbaZL5eQu1vLfazOwj4g==",
+      "dependencies": {
+        "fetch-blob": "^3.1.2"
+      },
+      "engines": {
+        "node": ">=12.20.0"
+      }
+    },
     "node_modules/forwarded": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.2.0.tgz",
@@ -589,6 +631,41 @@
         "node": ">= 0.6"
       }
     },
+    "node_modules/node-domexception": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/node-domexception/-/node-domexception-1.0.0.tgz",
+      "integrity": "sha512-/jKZoMpw0F8GRwl4/eLROPA3cfcXtLApP0QzLmUT/HuPCZWyB7IY9ZrMeKw2O/nFIqPQB3PVM9aYm0F312AXDQ==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/jimmywarting"
+        },
+        {
+          "type": "github",
+          "url": "https://paypal.me/jimmywarting"
+        }
+      ],
+      "engines": {
+        "node": ">=10.5.0"
+      }
+    },
+    "node_modules/node-fetch": {
+      "version": "3.2.10",
+      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-3.2.10.tgz",
+      "integrity": "sha512-MhuzNwdURnZ1Cp4XTazr69K0BTizsBroX7Zx3UgDSVcZYKF/6p0CBe4EUb/hLqmzVhl0UpYfgRljQ4yxE+iCxA==",
+      "dependencies": {
+        "data-uri-to-buffer": "^4.0.0",
+        "fetch-blob": "^3.1.4",
+        "formdata-polyfill": "^4.0.10"
+      },
+      "engines": {
+        "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/node-fetch"
+      }
+    },
     "node_modules/nodemon": {
       "version": "2.0.20",
       "resolved": "https://registry.npmjs.org/nodemon/-/nodemon-2.0.20.tgz",
@@ -1096,6 +1173,14 @@
         "node": ">= 0.8"
       }
     },
+    "node_modules/web-streams-polyfill": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/web-streams-polyfill/-/web-streams-polyfill-3.2.1.tgz",
+      "integrity": "sha512-e0MO3wdXWKrLbL0DgGnUV7WHVuw9OUvL4hjgnPkIeEvESk74gAITi5G606JtZPp39cd8HA9VQzCIvA49LpPN5Q==",
+      "engines": {
+        "node": ">= 8"
+      }
+    },
     "node_modules/xtend": {
       "version": "4.0.2",
       "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz",
@@ -1250,6 +1335,11 @@
       "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz",
       "integrity": "sha512-QADzlaHc8icV8I7vbaJXJwod9HWYp8uCqf1xa4OfNu1T7JVxQIrUgOWtHdNDtPiywmFbiS12VjotIXLrKM3orQ=="
     },
+    "data-uri-to-buffer": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/data-uri-to-buffer/-/data-uri-to-buffer-4.0.0.tgz",
+      "integrity": "sha512-Vr3mLBA8qWmcuschSLAOogKgQ/Jwxulv3RNE4FXnYWRGujzrRWQI4m12fQqRkwX06C0KanhLr4hK+GydchZsaA=="
+    },
     "debug": {
       "version": "2.6.9",
       "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
@@ -1331,6 +1421,15 @@
         "vary": "~1.1.2"
       }
     },
+    "fetch-blob": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/fetch-blob/-/fetch-blob-3.2.0.tgz",
+      "integrity": "sha512-7yAQpD2UMJzLi1Dqv7qFYnPbaPx7ZfFK6PiIxQ4PfkGPyNyl2Ugx+a/umUonmKqjhM4DnfbMvdX6otXq83soQQ==",
+      "requires": {
+        "node-domexception": "^1.0.0",
+        "web-streams-polyfill": "^3.0.3"
+      }
+    },
     "fill-range": {
       "version": "7.0.1",
       "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
@@ -1354,6 +1453,14 @@
         "unpipe": "~1.0.0"
       }
     },
+    "formdata-polyfill": {
+      "version": "4.0.10",
+      "resolved": "https://registry.npmjs.org/formdata-polyfill/-/formdata-polyfill-4.0.10.tgz",
+      "integrity": "sha512-buewHzMvYL29jdeQTVILecSaZKnt/RJWjoZCF5OW60Z67/GmSLBkOFM7qh1PI3zFNtJbaZL5eQu1vLfazOwj4g==",
+      "requires": {
+        "fetch-blob": "^3.1.2"
+      }
+    },
     "forwarded": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.2.0.tgz",
@@ -1532,6 +1639,21 @@
       "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.3.tgz",
       "integrity": "sha512-+EUsqGPLsM+j/zdChZjsnX51g4XrHFOIXwfnCVPGlQk/k5giakcKsuxCObBRu6DSm9opw/O6slWbJdghQM4bBg=="
     },
+    "node-domexception": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/node-domexception/-/node-domexception-1.0.0.tgz",
+      "integrity": "sha512-/jKZoMpw0F8GRwl4/eLROPA3cfcXtLApP0QzLmUT/HuPCZWyB7IY9ZrMeKw2O/nFIqPQB3PVM9aYm0F312AXDQ=="
+    },
+    "node-fetch": {
+      "version": "3.2.10",
+      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-3.2.10.tgz",
+      "integrity": "sha512-MhuzNwdURnZ1Cp4XTazr69K0BTizsBroX7Zx3UgDSVcZYKF/6p0CBe4EUb/hLqmzVhl0UpYfgRljQ4yxE+iCxA==",
+      "requires": {
+        "data-uri-to-buffer": "^4.0.0",
+        "fetch-blob": "^3.1.4",
+        "formdata-polyfill": "^4.0.10"
+      }
+    },
     "nodemon": {
       "version": "2.0.20",
       "resolved": "https://registry.npmjs.org/nodemon/-/nodemon-2.0.20.tgz",
@@ -1900,6 +2022,11 @@
       "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
       "integrity": "sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg=="
     },
+    "web-streams-polyfill": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/web-streams-polyfill/-/web-streams-polyfill-3.2.1.tgz",
+      "integrity": "sha512-e0MO3wdXWKrLbL0DgGnUV7WHVuw9OUvL4hjgnPkIeEvESk74gAITi5G606JtZPp39cd8HA9VQzCIvA49LpPN5Q=="
+    },
     "xtend": {
       "version": "4.0.2",
       "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz",
diff --git a/server/package.json b/server/package.json
index 7e5ac41..94a1f67 100644
--- a/server/package.json
+++ b/server/package.json
@@ -5,6 +5,7 @@
   "main": "index.js",
   "type": "module",
   "scripts": {
+    "dev": "concurrently 'npm run server' 'cd .. && cd client && npm start'",
     "start": "node server.js",
     "server": "nodemon server.js"
   },
@@ -14,6 +15,7 @@
   "dependencies": {
     "dotenv": "^16.0.3",
     "express": "^4.18.2",
+    "node-fetch": "^3.2.10",
     "pg": "^8.8.0"
   },
   "devDependencies": {
diff --git a/server/server.js b/server/server.js
index eaccce0..c5eea9e 100644
--- a/server/server.js
+++ b/server/server.js
@@ -2,6 +2,7 @@ import express from "express";
 import dotenv from "dotenv";
 
 import itemRouter from "./src/routes/itemRoutes.js";
+import googleAPIrouter from "./api/googleApi.js";
 import { initDb } from "./src/models/itemModel.js";
 
 const app = express();
@@ -16,6 +17,7 @@ app.get("/", (req, res) => {
   res.json({ message: "Hello from ExpressJS" });
 });
 
+app.use("/place", googleAPIrouter);
 app.use("/api", itemRouter);
 
 // console.log that your server is up and running