Add Sculpin slides

This commit is contained in:
Oliver Davies 2021-08-19 21:12:39 +01:00
parent a266b46fc1
commit 78e1ccbd03
5 changed files with 337 additions and 0 deletions

View file

@ -0,0 +1,4 @@
Building static websites with Sculpin
#####################################
https://www.oliverdavies.uk/talks/building-static-websites-sculpin

View file

@ -0,0 +1,6 @@
---
title: My talk
foo: bar
menu_links:
- { title: About, href: / }
- { title: Talks, href: /talks/ }

View file

@ -0,0 +1,6 @@
---
layout: default
title: Hello!
---
Hello, World!

View file

@ -0,0 +1,129 @@
pageSetup:
firstTemplate: coverPage
height: 18cm
margin-bottom: 0cm
margin-gutter: 0cm
margin-left: 0cm
margin-right: 0cm
margin-top: 0cm
size: null
spacing-footer: 2mm
spacing-header: 2mm
width: 32cm
pageTemplates:
coverPage:
# background: images/title.png
frames: []
[12%, 10%, 76%, 75%]
showFooter: false
showHeader: false
titlePage:
alignment: TA_CENTER
frames: []
[8%, 8%, 85%, 65%]
showFooter: true
showHeader: false
standardPage:
frames: []
[3%, 3%, 92%, 92%]
showFooter: true
showHeader: false
imagePage:
alignment: TA_CENTER
frames: []
[12%, 10%, 76%, 80%]
showFooter: true
showHeader: false
outputPage:
frames: []
[8%, 10%, 82%, 65%]
showFooter: false
showHeader: false
linkColor: #24608a
fontsAlias:
stdMono: Inconsolata-Regular
stdMonoBold: Inconsolata-Regular
stdMonoBoldItalic: Inconsolata-Regular
stdMonoItalic: Inconsolata-Regular
styles:
normal:
fontSize: 24
leading: 32
textColor: #383745
bodytext:
alignment: TA_LEFT
heading:
fontSize: 20
spaceAfter: 16
textColor: #24608a
title:
fontSize: 300%
parent: heading
bullet-list:
commands: []
[LEFTPADDING, [0, 0], [1, -1], 10]
[RIGHTPADDING, [0, 0], [1, -1], 0]
[VALIGN, [0, 0], [-1, -1], TOP]
colWidths: ["20", null]
textColor: #aaaaaa
bullet-list-item:
spaceBefore: 14
spaceAfter: 0
titleslideinfo:
alignment: TA_CENTER
fontSize: 140%
parent: normal
footer:
alignment: TA_RIGHT
fontName: stdMono
fontSize: 20
textColor: #24608a
rightIndent: 16
spaceBefore: 0
literal:
backColor: white
fontName: stdMono
code:
backColor: white
borderWidth: 0
fontSize: 20
leading: 24
parent: literal
spaceBefore: 4
blockquote:
parent: normal
fontName: stdItalic
leading: 36
attribution:
parent: normal
textColor: #66666
centred:
alignment: TA_CENTER
parent: normal
centredtitle:
alignment: TA_CENTER
fontName: stdBold
fontSize: 48
leading: 64
parent: heading

View file

@ -0,0 +1,192 @@
.. footer:: @opdavies
Building static websites with Sculpin
#####################################
|
.. class:: titleslideinfo
Oliver Davies (@opdavies)
.. page:: imagePage
.. image:: druplicon.png
:width: 10cm
.. page::
.. image:: sculpin.png
:width: 10cm
.. page:: standardPage
What is Sculpin?
================
* Static site generator
* CLI tool
* Built on Symfony's HttpKernel
* HTML + Markdown + Twig = Static site
What do I use it for?
=====================
* My personal website
* Some client websites
* HTML prototypes and testing
* Learning YAML and Twig (and maybe some Symfony)
Installation
============
``composer require sculpin/sculpin``
Using Sculpin
=============
* Configuration lives in ``app/config``
* Source code lives in ``source``.
Generate a site
===============
* ``sculpin generate``
* ``--server``
* ``--watch``
* ``--env``
source/index.md
===============
.. code-block:: markdown
:include: code/index.md.txt
Configuration
=============
- Stored in ``app/config``
- ``sculpin_site.yml``
- ``sculpin_site_{env}.yml``
- Key-value pairs
.. code-block:: markdown
:include: code/configuration.txt
YAML front matter
=================
.. code-block:: yaml
---
layout: post
title: New blog post
draft: yes
---
# My new blog post
More front matter
=================
.. code-block:: yaml
---
layout: post
title: New blog post
draft: yes
tags:
- drupal
- php
- sculpin
---
# My new blog post
Even more front matter
======================
.. code-block:: yaml
---
layout: post
title: New blog post
draft: yes
tags:
- drupal
- php
- sculpin
tweets: yes
foo: bar
---
# My new blog post
Using on pages
==============
.. code-block:: twig
---
...
testimonials:
- { name: ..., role: ..., text: ..., url: ... }
- { name: ..., role: ..., text: ..., url: ... }
- { name: ..., role: ..., text: ..., url: ... }
---
{% for testimonial in page.testimonials %}
<h2>{{ testimonial.name }} - {{ testimonial.role }}</h2>
<p>{{ testimonial.text }}</p>
{% endfor %}
Content types
=============
.. code-block:: yaml
# app/config/sculpin_kernel.yml
sculpin_content_types:
projects:
permalink: projects/:slug_title/
Accessing custom content types
==============================
.. code-block:: yaml
---
title: My Projects
layout: default
use:
- projects
---
{% for project in data.projects %}
<h2>{{ project.title }}</h2>
{% endfor %}
Extending Sculpin
=================
* Custom (Symfony) bundles
* Twig extensions
* Other Symfony components or PHP libraries
Thanks!
=======
References:
* https://sculpin.io
* https://github.com/sculpin/sculpin
* https://github.com/opdavies/sculpin-skeleton
* https://github.com/opdavies/docker-image-sculpin-serve
|
Me:
* https://www.oliverdavies.uk