From e93c98bb264e9d7ebdef84649b78d005be72985a Mon Sep 17 00:00:00 2001 From: Franciely Beckert Date: Tue, 5 Mar 2024 19:53:36 +0100 Subject: [PATCH 1/3] Do Bonus --- app.js | 26 ++++++++++++++++++++++++++ views/beers.hbs | 12 ++++++++++++ views/index.hbs | 5 +++++ views/layout.hbs | 24 ++++++++++++++++++++++++ views/random-beer.hbs | 15 +++++++++++++++ 5 files changed, 82 insertions(+) create mode 100644 views/beers.hbs create mode 100644 views/layout.hbs create mode 100644 views/random-beer.hbs diff --git a/app.js b/app.js index a206dd8d91..27f1db4fe2 100644 --- a/app.js +++ b/app.js @@ -22,4 +22,30 @@ app.get('/', (req, res) => { res.render('index'); }); +app.get('/beers', (req, res) => { + punkAPI + .getBeers() + .then(beersFromApi => { + res.render('beers', { beers: beersFromApi }); + console.log('Beers from the database: ', beersFromApi); + }) + .catch(error => { + res.status(500).send('Error fetching from the database'); + console.log(error); + }); +}); + +app.get('/random-beer', (req, res) => { + punkAPI + .getRandom() + .then(responseFromAPI => { + res.render('random-beer', { beer: responseFromAPI[0] }); + console.log(responseFromAPI[0]); + }) + .catch(error => { + res.status(500).send('Error fetching from the database'); + console.log(error); + }); +}); + app.listen(3000, () => console.log('🏃‍ on port 3000')); diff --git a/views/beers.hbs b/views/beers.hbs new file mode 100644 index 0000000000..bb23249160 --- /dev/null +++ b/views/beers.hbs @@ -0,0 +1,12 @@ +
+

All Beers

+
+ {{#each beers}} + {{name}} +

{{name}}

+

{{description}}

+

{{tagline}}

+ + {{/each}} +
+
\ No newline at end of file diff --git a/views/index.hbs b/views/index.hbs index 3a6cce8d18..7101cd011d 100644 --- a/views/index.hbs +++ b/views/index.hbs @@ -1,3 +1,8 @@
+ Beer Image +
\ No newline at end of file diff --git a/views/layout.hbs b/views/layout.hbs new file mode 100644 index 0000000000..06ec08c6ea --- /dev/null +++ b/views/layout.hbs @@ -0,0 +1,24 @@ + + + + + + Beer App + + +
+ +
+ +
+ {{{ body }}} +
+ + + \ No newline at end of file diff --git a/views/random-beer.hbs b/views/random-beer.hbs new file mode 100644 index 0000000000..83c3aad480 --- /dev/null +++ b/views/random-beer.hbs @@ -0,0 +1,15 @@ +
+ {{#with beer}} + {{name}} +

{{name}}

+

{{tagline}}

+

{{description}}

+

Food Pairing:

+ +

Brewer Tips:{{brewers_tips}}

+ {{/with}} +
\ No newline at end of file From 4e6391dde779aa4b6a566ca3a2b5dcd9a6e24ec0 Mon Sep 17 00:00:00 2001 From: Franciely Beckert Date: Tue, 5 Mar 2024 21:58:06 +0100 Subject: [PATCH 2/3] Add bonus 5 and 6 --- app.js | 19 +++++++++++++++++-- views/beer-details.hbs | 4 ++++ views/beers.hbs | 9 ++++----- views/partials/beerpartial.hbs | 6 ++++++ views/random-beer.hbs | 5 +---- 5 files changed, 32 insertions(+), 11 deletions(-) create mode 100644 views/beer-details.hbs create mode 100644 views/partials/beerpartial.hbs diff --git a/app.js b/app.js index 27f1db4fe2..abcb702bcc 100644 --- a/app.js +++ b/app.js @@ -13,8 +13,7 @@ app.set('views', path.join(__dirname, 'views')); app.use(express.static(path.join(__dirname, 'public'))); // Register the location for handlebars partials here: - -// ... +hbs.registerPartials(path.join(__dirname, 'views/partials')); // Add the route handlers here: @@ -48,4 +47,20 @@ app.get('/random-beer', (req, res) => { }); }); +app.get('/beers/:id', (req, res) => { + const beerId = req.params.id; + console.log('beerId', beerId); + // Call the getBeer(id) method to retrieve the details of the specific beer + punkAPI + .getBeer(beerId) + .then(responseFromAPI => { + console.log("beer", responseFromAPI[0]); + res.render('beer-details', { beer: responseFromAPI[0] }); + }) + .catch(error => { + console.log(error); + res.status(500).send('Error fetching from the database'); + }); +}); + app.listen(3000, () => console.log('🏃‍ on port 3000')); diff --git a/views/beer-details.hbs b/views/beer-details.hbs new file mode 100644 index 0000000000..e7737e228b --- /dev/null +++ b/views/beer-details.hbs @@ -0,0 +1,4 @@ +

Beer Details

+{{#with beer}} + {{> beerpartial}} +{{/with}} \ No newline at end of file diff --git a/views/beers.hbs b/views/beers.hbs index bb23249160..7a3d1acbd8 100644 --- a/views/beers.hbs +++ b/views/beers.hbs @@ -2,11 +2,10 @@

All Beers

{{#each beers}} - {{name}} -

{{name}}

-

{{description}}

-

{{tagline}}

- + {{!-- anchor to macke it clickable --}} + + {{> beerpartial}} + {{/each}}
\ No newline at end of file diff --git a/views/partials/beerpartial.hbs b/views/partials/beerpartial.hbs new file mode 100644 index 0000000000..d3bf202c34 --- /dev/null +++ b/views/partials/beerpartial.hbs @@ -0,0 +1,6 @@ +
+ {{name}} +

{{name}}

+

{{description}}

+

{{tagline}}

+
\ No newline at end of file diff --git a/views/random-beer.hbs b/views/random-beer.hbs index 83c3aad480..0fbb1730c7 100644 --- a/views/random-beer.hbs +++ b/views/random-beer.hbs @@ -1,9 +1,6 @@
{{#with beer}} - {{name}} -

{{name}}

-

{{tagline}}

-

{{description}}

+ {{> beerpartial}}

Food Pairing:

    {{#each food_pairing}} From 453c8951ccca16aa53530d55f79cb731cc0fd162 Mon Sep 17 00:00:00 2001 From: Franciely Beckert Date: Thu, 7 Mar 2024 00:02:47 +0000 Subject: [PATCH 3/3] add css --- public/stylesheets/styles.css | 18 ++++++++++++++++++ views/index.hbs | 12 +++++++----- views/layout.hbs | 34 +++++++++++++++++----------------- views/random-beer.hbs | 1 + 4 files changed, 43 insertions(+), 22 deletions(-) diff --git a/public/stylesheets/styles.css b/public/stylesheets/styles.css index 251470be83..61525f6d05 100644 --- a/public/stylesheets/styles.css +++ b/public/stylesheets/styles.css @@ -5,3 +5,21 @@ dark-blue: #0a2c42; grey: #bfbfbf; font-family: Arial, Helvetica, sans-serif; */ + +#ul { + display: flex; + background-color: #2081c3; + list-style-type: none; + padding-top: 15px; + padding-bottom: 15px; + box-shadow: 1px 2px 2px gr; +} + +.a { + text-decoration: none; + color: #f7f9f9; +} + +.li { + margin-right: 50px; +} diff --git a/views/index.hbs b/views/index.hbs index 7101cd011d..fbfa1754f0 100644 --- a/views/index.hbs +++ b/views/index.hbs @@ -1,8 +1,10 @@ + + \ No newline at end of file diff --git a/views/layout.hbs b/views/layout.hbs index 06ec08c6ea..c5710998f5 100644 --- a/views/layout.hbs +++ b/views/layout.hbs @@ -1,24 +1,24 @@ - - - - - + + + + + Beer App - - + +
    - +
    - {{{ body }}} + {{{body}}}
    - - + + \ No newline at end of file diff --git a/views/random-beer.hbs b/views/random-beer.hbs index 0fbb1730c7..1b45fa49a3 100644 --- a/views/random-beer.hbs +++ b/views/random-beer.hbs @@ -1,3 +1,4 @@ +
    {{#with beer}} {{> beerpartial}}