Skip to content

Commit 93a1e9c

Browse files
author
Alejandro Figueroa
committed
Created site and netlify function
1 parent d4108ec commit 93a1e9c

File tree

12 files changed

+10878
-1106
lines changed

12 files changed

+10878
-1106
lines changed

‎README.md

Lines changed: 10 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,22 @@
1-
# Jekyll Tailwind template
1+
# Netlify Functions Workshop
22

3-
A minimal repo to create a static site using [Jekyll][jekyll] and [TailwindCSS][tailwind]. It uses the [jekyll-postcss](https://github.com/mhanberg/jekyll-postcss) plugin and a very basic `postcss.config.js` file which references the TailwindCSS plugin.
3+
This is a simple static website generated with Jekyll and deployed to Netlify, which use a serverless function to fetch some dyamic content.
44

5-
[jekyll]:https://jekyllrb.com/
6-
[tailwind]:https://tailwindcss.com/
5+
It's intended to show basic concepts around the JAMStack on Netlify, such as Static Site Generators, git-based deployment and Netlify functions as APIs.
76

87

9-
## Getting Started
8+
## Development
109

11-
Clone the repo and run the following:
10+
Install dependencies
1211

13-
`bundle install` -> This installs Ruby gems and jekyll plugins
12+
`bundle install && npm install`
1413

15-
`npm install` -> This installs postcss-cli and tailwindcss packages
1614

17-
`bundle exec jekyll serve` -> Generates the site with develop settings and listens on http://localhost:4000
15+
Run Jekyll in development mode
1816

17+
`bundle exec jekyll serve`
1918

20-
## Deployment
21-
22-
This repo is configured to be deployed on [Netlify](https://www.netlify.com).
23-
24-
The included `netlify.toml` file will override the default build command to install Node packages (PostCSS and TailwindCSS) before the Jekyll build.
25-
26-
27-
## Why another Jekyll + Tailwind starter/template?
2819

29-
This in an opinionated template where files are organized as I like. This is the setup I use on almost every static site project I work on.
30-
31-
All pages (except 404.html) are under a `pages` folder. I like to manually set the permalink for all content in my sites, and I don't like seeing actual content files at the root level.
32-
33-
34-
## Next steps
20+
## Deployment
3521

36-
- Integrate PurgeCSS to reduce the final css file size
22+
This repo is configured to be deployed on [Netlify](https://www.netlify.com). The included `netlify.toml` file contains the build commands that are required to generate the site.

‎_config.yml

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -18,16 +18,13 @@
1818
# You can create any custom variable you would like, and they will be accessible
1919
# in the templates via {{ site.myvariable }}.
2020

21-
title: "Jekyll + TailwindCSS template"
22-
email: your-email@example.com
21+
title: "Netlify Functions workshop"
22+
email: alexphi@gmail.com
2323
description: >- # this means to ignore newlines until "baseurl:"
24-
A minimal template to create a static site using Jekyll and TailwindCSS.
24+
Minimal site generated with Jekyll and using Netlify functions
2525
baseurl: "" # the subpath of your site, e.g. /blog
2626
url: "" # the base hostname & protocol for your site, e.g. http://example.com
2727

28-
# Google Analytics TrackingID - Leave blank to exclude the gtag scripts
29-
gtag_id: ""
30-
3128
# Build settings
3229
plugins:
3330
- jekyll-feed
@@ -49,6 +46,7 @@ exclude:
4946
- postcss.config.js
5047
- tailwind.config.js
5148
- netlify.toml
49+
- functions/
5250
- node_modules
5351
- vendor/bundle/
5452
- vendor/cache/

‎_includes/analytics.html

Lines changed: 0 additions & 15 deletions
This file was deleted.

‎_layouts/default.html

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,14 +9,13 @@
99

1010
<link rel="stylesheet" type="text/css" href="{{ site.baseurl }}/assets/css/main.css">
1111
<meta name="theme-color" content="#ffffff">
12+
13+
<link href="https://fonts.googleapis.com/css2?family=Merriweather+Sans:ital@0;1&family=Yeseva+One&display=swap" rel="stylesheet">
14+
<script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v2.3.5/dist/alpine.min.js" defer></script>
1215
</head>
1316

1417
<body>
1518
{{ content }}
16-
17-
{% if jekyll.environment == 'production' %}
18-
{% include analytics.html %}
19-
{% endif %}
2019
</body>
2120

2221
</html>

‎assets/css/main.css

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,5 +3,8 @@
33
---
44

55
@tailwind base;
6+
7+
body { @apply font-body; }
8+
69
@tailwind components;
710
@tailwind utilities;

‎assets/landscape.svg

Lines changed: 22 additions & 0 deletions
Loading

‎functions/quote.js

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
const http = require("http")
2+
const url = "http://quotes.rest/qod.json?category=inspire"
3+
4+
const buildOkResponse = (quote) => {
5+
return {
6+
statusCode: 200,
7+
body: JSON.stringify({
8+
success: true,
9+
quote: {
10+
text: quote.quote,
11+
author: quote.author
12+
}
13+
})
14+
}
15+
}
16+
17+
const buildErrorResponse = (message) => {
18+
return {
19+
statusCode: 200,
20+
body: JSON.stringify({
21+
success: false,
22+
error: message
23+
})
24+
}
25+
}
26+
27+
exports.handler = (event, context, callback) => {
28+
http.get(url, res => {
29+
res.setEncoding("utf8")
30+
let body = ""
31+
res.on("data", data => {
32+
body += data
33+
})
34+
res.on("end", () => {
35+
body = JSON.parse(body)
36+
37+
if (body.success)
38+
callback(null, buildOkResponse(body.contents.quotes[0]))
39+
else
40+
callback(null, buildErrorResponse(body.error.message))
41+
})
42+
})
43+
}

‎netlify.toml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
[build]
22
command = "npm install && jekyll build"
3+
functions = "functions"
34
publish = "_site/"
45

56
[context.production]

0 commit comments

Comments
 (0)