ironhack-labs · pedrocuzzolin · May 22, 2024
diff --git a/app.js b/app.js
@@ -1,25 +1,79 @@
 const express = require('express');
-
+const app = express();
 const hbs = require('hbs');
 const path = require('path');
-const PunkAPIWrapper = require('punkapi-javascript-wrapper');
+/*
+app.set("view engine", "hbs");
+*/
+app.use(express.static(`${__dirname}/public`));
+
+hbs.registerPartials(__dirname + "/views/partials");
+
 
-const app = express();
-const punkAPI = new PunkAPIWrapper();
 
 app.set('view engine', 'hbs');
 app.set('views', path.join(__dirname, 'views'));
-
 app.use(express.static(path.join(__dirname, 'public')));
 
-// Register the location for handlebars partials here:
 
-// ...
 
-// Add the route handlers here:
+app.get("/", (req, res) => {
+
+  res.render("index");
+
+});
+app.get("/brewery", (req, res) => {
 
-app.get('/', (req, res) => {
-  res.render('index');
+  fetch("https://api.openbrewerydb.org/v1/breweries")
+  .then((response) => response.json())
+  .then((response) =>  {
+      res.render("beers", { breweries: response});
+  });
 });
 
+
+app.get("/random-brewery", (req, res) => {
+  fetch("https://api.openbrewerydb.org/v1/breweries/random")
+  .then((response) => response.json())
+  .then((response) => res.render("random-brewery", { brewery: response[0] })); 
+});
+
+/*app.get('/', (req, res) => {
+  res.render('home', { title: 'Home' });
+});*/
+
+
+/*app.get("/beers/:id" (req, res) => {
+  const id = req.params.id;
+  fetch("https://api.openbrewerydb.org/v1/breweries/${id}")
+  .then((response) => response.json())
+  .then((response) =>  res.render("reandom-brewerry",{beers : response}))
+});
+*/
+app.get("/breweries/:id", (req, res) => {
+  const id = req.params.id;
+   fetch(`https://api.openbrewerydb.org/v1/breweries/${id}`)
+   .then((response) => response.json())
+   .then((response) => res.render("random-brewery", { brewery: response }));
+});
+
+
 app.listen(3000, () => console.log('🏃‍ on port 3000'));
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+/*app.listen(3000, () => {
+    console.log("Server listening...")
+});*/
diff --git a/package.json b/package.json
@@ -4,7 +4,7 @@
   "main": "app.js",
   "scripts": {
     "start": "node app.js",
-    "dev": "nodemon app.js"
+    "dev": "nodemon app.js -e js,hbs"
   },
   "license": "ISC",
   "dependencies": {

diff --git a/public/stylesheets/styles.css b/public/stylesheets/styles.css
@@ -1,7 +1,16 @@
-/*
-white: #f7f9f9;
-light-blue: #2081c3;
-dark-blue: #0a2c42;
-grey: #bfbfbf;
-font-family: Arial, Helvetica, sans-serif;
-*/
+body {
+    font-family: Arial, Arial, Helvetica, sans-serif;
+}
+
+.grid {
+    display: grid;
+    grid-template-columns: 1fr 1fr 1fr;
+    grid-gap: 15px;
+}
+
+.card {
+    border: 1px solid #ccc;
+    border-radius: 5px;
+    padding: 10px;
+
+}
diff --git a/views/beers.hbs b/views/beers.hbs
@@ -0,0 +1,14 @@
+<h1>Breweries page</h1>
+
+
+<div class="grid">
+
+    {{#each breweries}}
+        <div class="card"> 
+            <h3><a href="/breweries/{{id}}">{{name}}</a></h3>
+            <p>{{brewery_type}}</p>
+
+        </div>
+    {{/each}}
+
+</div>
diff --git a/views/index.hbs b/views/index.hbs
@@ -1,3 +1,2 @@
-<div>
-
-</div>
+<button><a href="/brewery">Home Check the Beers!</a></button>
+<button><a href="/random-brewery">Check a Random Beer</a></button>
diff --git a/views/layout.hbs b/views/layout.hbs
@@ -0,0 +1,16 @@
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+    <link rel="stylesheet" href="/stylesheets/style.css">
+    <title>Breweries</title>
+</head>
+<body>
+    {{>navbar}}
+        {{{body}}}
+    {{>footer}}    
+</body>
+
+
+</html>
diff --git a/views/partials/footer.hbs b/views/partials/footer.hbs
@@ -0,0 +1 @@
+<p>Developed by Pedro</p>
diff --git a/views/partials/navbar.hbs b/views/partials/navbar.hbs
@@ -0,0 +1,5 @@
+<ul>
+    <li><a href="/">Home</a></li>
+    <li><a href="/brewery">Breweries</a></li>
+    <li><a href="/random-brewery">Random Brewery</a></li>
+</ul>
diff --git a/views/random-brewery.hbs b/views/random-brewery.hbs
@@ -0,0 +1,6 @@
+<h1>Random Brewery</h1>
+
+<h2>name: {{brewery.name}}</h2>
+<p>Address: {{brewery.address_1}}</p>
+<p>City: {{brewery.city}}</p>
+<p>Type: {{brewery.brewery_type}}</p>