0:00:00.080,0:00:06.960
okay okay excellent sorry okay so
0:00:03.120,0:00:10.080
uh hello everyone um and um
0:00:06.960,0:00:12.400
uh nice meeting you and let me
0:00:10.080,0:00:13.920
thank the the organizer for all the
0:00:12.400,0:00:15.200
organization and all the work they are
0:00:13.920,0:00:18.400
doing to support us
0:00:15.200,0:00:19.920
my name is adolfo villaferita
0:00:18.400,0:00:21.920
i'm teaching at the university of
0:00:19.920,0:00:24.480
trenton i'm also
0:00:21.920,0:00:26.240
work will shortly be working at
0:00:24.480,0:00:29.359
shared.tech which is a comp
0:00:26.240,0:00:30.530
a non-profit organization developing an
0:00:29.359,0:00:32.399
applications to
0:00:30.530,0:00:35.680
[Music]
0:00:32.399,0:00:38.960
recover surplus food but the the
0:00:35.680,0:00:40.079
reason of the talk today and the reason
0:00:38.960,0:00:42.719
i'm here today
0:00:40.079,0:00:44.000
is to talk about my experience in moving
0:00:42.719,0:00:47.200
from jekyll uh
0:00:44.000,0:00:49.200
static website generator to org mode and
0:00:47.200,0:00:52.079
the reason
0:00:49.200,0:00:53.039
i move to work mode is to have better
0:00:52.079,0:00:56.800
support for
0:00:53.039,0:00:58.399
literary programming on the websites
0:00:56.800,0:01:00.480
at the university of trento where we
0:00:58.399,0:01:04.720
make available the content for the
0:01:00.480,0:01:08.000
the students okay so
0:01:04.720,0:01:10.080
first of all what is a static website
0:01:08.000,0:01:11.360
generator it is basically a tool which
0:01:10.080,0:01:15.360
allows you to
0:01:11.360,0:01:17.439
generate html files out of text files
0:01:15.360,0:01:19.280
containing basically two types of
0:01:17.439,0:01:23.119
information metadata
0:01:19.280,0:01:26.159
and content metadata is let's say a
0:01:23.119,0:01:28.560
set of key pairs describing the the
0:01:26.159,0:01:30.000
content of the file such as the title
0:01:28.560,0:01:31.759
author
0:01:30.000,0:01:34.560
tags and so on and so forth and the
0:01:31.759,0:01:37.040
content is what you actually want to to
0:01:34.560,0:01:38.880
get published on the on the internet in
0:01:37.040,0:01:41.439
the html file
0:01:38.880,0:01:44.240
and usually the content is written in
0:01:41.439,0:01:44.240
some kind of
0:01:44.560,0:01:49.759
markup language such as markdown or
0:01:47.520,0:01:53.200
possibly
0:01:49.759,0:01:55.759
org mode and well jackie is a very
0:01:53.200,0:01:58.719
popular website uh
0:01:55.759,0:01:59.840
a static website generator it is written
0:01:58.719,0:02:03.280
in a ruby
0:01:59.840,0:02:06.840
and what it does it it it systematically
0:02:03.280,0:02:09.440
let's say transforms all the input files
0:02:06.840,0:02:11.599
by making the content into
0:02:09.440,0:02:14.000
html and systematically applying a
0:02:11.599,0:02:17.120
template in order to generate the
0:02:14.000,0:02:19.840
html files which you can then deploy
0:02:17.120,0:02:22.160
on your server of choice to make them
0:02:19.840,0:02:26.160
available on the on the internet
0:02:22.160,0:02:28.480
and one of the features uh most
0:02:26.160,0:02:30.239
well i would say all static website
0:02:28.480,0:02:32.560
generators have
0:02:30.239,0:02:34.879
is a debt of being able to let's say
0:02:32.560,0:02:38.400
collect the metadata information
0:02:34.879,0:02:39.440
uh of the files being part of your of
0:02:38.400,0:02:45.280
your project
0:02:39.440,0:02:47.840
and the reason they do that is because
0:02:45.280,0:02:49.280
you sometimes want to generate pages
0:02:47.840,0:02:53.200
based on the content
0:02:49.280,0:02:56.239
of your um of your projects
0:02:53.200,0:02:59.040
such as for instance the the list of
0:02:56.239,0:03:00.400
posts you have recently published or
0:02:59.040,0:03:03.840
maybe the list of tags
0:03:00.400,0:03:07.280
uh you uh have defined for your post and
0:03:03.840,0:03:09.760
so on and so forth so so
0:03:07.280,0:03:12.400
dracula gives the possibility of
0:03:09.760,0:03:15.760
generating this kind of dynamic
0:03:12.400,0:03:18.800
content by using liquid which is a
0:03:15.760,0:03:21.840
templating language which
0:03:18.800,0:03:24.879
looks like these
0:03:21.840,0:03:26.879
so basically you you have all the
0:03:24.879,0:03:29.120
constructs you can
0:03:26.879,0:03:29.920
expect in a programming language this
0:03:29.120,0:03:33.360
for instance
0:03:29.920,0:03:37.440
is a fourth cycle which
0:03:33.360,0:03:39.599
iterates over all the post or the
0:03:37.440,0:03:41.040
files in a specific directory of the
0:03:39.599,0:03:45.040
jacket project
0:03:41.040,0:03:48.400
and for each post it takes the the title
0:03:45.040,0:03:51.840
and the url and generates a link
0:03:48.400,0:03:55.200
okay so dracule is
0:03:51.840,0:03:57.760
nice and sweet but over the years
0:03:55.200,0:03:59.519
i started using more and more
0:03:57.760,0:04:02.959
systematically
0:03:59.519,0:04:05.439
or mode to write all my files and i
0:04:02.959,0:04:07.439
moved from markdown to word mode i am a
0:04:05.439,0:04:09.680
long time emacs user so i've been using
0:04:07.439,0:04:12.799
imax for 30 years now so
0:04:09.680,0:04:15.280
or mode is a more recent discovery
0:04:12.799,0:04:16.239
but it is a very nice uh let's say
0:04:15.280,0:04:19.680
discovery i
0:04:16.239,0:04:22.320
i made and the reason i like org mode
0:04:19.680,0:04:23.600
is because for instance you can write
0:04:22.320,0:04:26.639
formulas using
0:04:23.600,0:04:30.320
mac jacks and you can generate diagrams
0:04:26.639,0:04:32.240
or plots with new plots and
0:04:30.320,0:04:34.080
also important is the fact that you have
0:04:32.240,0:04:35.919
the possibility of let's say publishing
0:04:34.080,0:04:39.520
your documents
0:04:35.919,0:04:40.400
to multiple ends backhands such as pdf
0:04:39.520,0:04:43.600
or
0:04:40.400,0:04:47.199
maybe a review presentations or
0:04:43.600,0:04:50.479
or html and this is all made possible
0:04:47.199,0:04:52.560
by bubble which is
0:04:50.479,0:04:54.639
exactly what we just saw in the the
0:04:52.560,0:04:57.440
previous talk
0:04:54.639,0:04:59.520
namely the possibility of executing a
0:04:57.440,0:05:02.560
snippet of code
0:04:59.520,0:05:06.400
embedded in in your pages
0:05:02.560,0:05:09.600
um and our model can also be used
0:05:06.400,0:05:10.720
within let's say jackie and in fact
0:05:09.600,0:05:15.199
there is a
0:05:10.720,0:05:18.880
a nice gem a nice library called jackie
0:05:15.199,0:05:19.680
org which allows you to use org modifies
0:05:18.880,0:05:22.880
directly
0:05:19.680,0:05:26.560
into jekyll but when you start using
0:05:22.880,0:05:30.560
org mode when i started using
0:05:26.560,0:05:34.240
mode i realized i could move
0:05:30.560,0:05:36.840
all my workflow to or my publishing
0:05:34.240,0:05:39.520
workflow to image
0:05:36.840,0:05:41.600
and and and in fact
0:05:39.520,0:05:42.880
org mode is also static website
0:05:41.600,0:05:46.240
generator because
0:05:42.880,0:05:50.880
it has got the possibility of publishing
0:05:46.240,0:05:53.840
um projects made of org mode files
0:05:50.880,0:05:55.759
and one of the nice things about let's
0:05:53.840,0:05:56.479
say that the publishing features of work
0:05:55.759,0:05:58.880
mode
0:05:56.479,0:05:59.840
is that it allows you to define in the
0:05:58.880,0:06:03.199
org publish
0:05:59.840,0:06:06.479
project a list of the components
0:06:03.199,0:06:07.520
which are part of your project and in a
0:06:06.479,0:06:10.479
sense it is
0:06:07.520,0:06:12.400
also more flexible than jackie lee's
0:06:10.479,0:06:12.880
because it also allows you for instance
0:06:12.400,0:06:15.120
to
0:06:12.880,0:06:17.440
let's say publish a single file rather
0:06:15.120,0:06:20.080
than having to recompile everything
0:06:17.440,0:06:23.919
every time you want to publish your
0:06:20.080,0:06:25.840
your project to your website however
0:06:23.919,0:06:27.120
there are some short comments i would
0:06:25.840,0:06:29.520
say or some some
0:06:27.120,0:06:30.400
areas of improvement improvement let me
0:06:29.520,0:06:32.720
say
0:06:30.400,0:06:33.600
the first is that let's say support for
0:06:32.720,0:06:36.639
templating
0:06:33.600,0:06:39.280
is not so obvious as it is let's say
0:06:36.639,0:06:40.560
in jackie or even though there are some
0:06:39.280,0:06:44.560
let's say
0:06:40.560,0:06:46.160
nice extensions such as argo t html
0:06:44.560,0:06:48.400
for instance which allows you to use
0:06:46.160,0:06:51.840
templates and
0:06:48.400,0:06:54.080
more important to me was the fact that
0:06:51.840,0:06:55.520
apparently there is little support for
0:06:54.080,0:06:58.240
the creation of dynamic
0:06:55.520,0:06:59.360
content so i was very curious and very
0:06:58.240,0:07:02.800
keen to use
0:06:59.360,0:07:05.440
or mode for let's say publishing my blog
0:07:02.800,0:07:08.720
and my the the courses at the university
0:07:05.440,0:07:11.440
but then uh i had to find a way
0:07:08.720,0:07:13.599
to let's say being able to publish these
0:07:11.440,0:07:16.000
dynamic pages finding some kind of
0:07:13.599,0:07:16.720
replacement so to speak for uh the
0:07:16.000,0:07:19.759
liquid
0:07:16.720,0:07:20.160
the liquid engine and and the solution
0:07:19.759,0:07:24.160
was
0:07:20.160,0:07:27.280
that at hand actually because
0:07:24.160,0:07:30.800
basically i realized i could use bubble
0:07:27.280,0:07:32.720
for exactly this purpose so rather than
0:07:30.800,0:07:35.759
using bubble for generating
0:07:32.720,0:07:37.919
plots or let's say my other computation
0:07:35.759,0:07:41.039
or whatever i was using them for
0:07:37.919,0:07:42.080
i realized they could use bubble to
0:07:41.039,0:07:45.120
generate
0:07:42.080,0:07:48.960
html which could be let's say
0:07:45.120,0:07:52.720
uh then published uh uh
0:07:48.960,0:07:53.680
in the project so uh so all i needed to
0:07:52.720,0:07:56.240
do then
0:07:53.680,0:07:58.319
was defining some kind of functions some
0:07:56.240,0:08:01.840
kind of code in order to read
0:07:58.319,0:08:02.400
all the org mode uh the metadata of all
0:08:01.840,0:08:05.759
the
0:08:02.400,0:08:09.680
opmod files of my web project so that
0:08:05.759,0:08:13.280
i could let's say then publish uh
0:08:09.680,0:08:17.440
generate the dynamic content and
0:08:13.280,0:08:17.440
this is a snippet taken from
0:08:18.080,0:08:24.800
one of my html projects
0:08:21.759,0:08:27.599
which basically shows the way in which
0:08:24.800,0:08:29.360
i generate the um the list of posts on
0:08:27.599,0:08:32.560
my on my page it is uh
0:08:29.360,0:08:34.320
exactly how the the liquid that we saw
0:08:32.560,0:08:35.680
in a couple of a couple of slides
0:08:34.320,0:08:39.200
earlier that looks like
0:08:35.680,0:08:42.320
uh in inner mode
0:08:39.200,0:08:46.720
and basically what i'm doing i'm using i
0:08:42.320,0:08:49.680
wrote a ruby script which
0:08:46.720,0:08:51.040
reads all the metadata so this uh
0:08:49.680,0:08:53.440
highlighted code
0:08:51.040,0:08:54.240
basically loads the script which is
0:08:53.440,0:08:56.800
stored
0:08:54.240,0:08:58.320
externally and then it collects all the
0:08:56.800,0:09:00.880
metadata from the
0:08:58.320,0:09:02.240
org mode files in the current uh in the
0:09:00.880,0:09:04.800
current directory
0:09:02.240,0:09:06.480
and then the the following the the code
0:09:04.800,0:09:09.839
you can see here
0:09:06.480,0:09:12.959
basically iterate over all the
0:09:09.839,0:09:16.399
past red the at the previous step
0:09:12.959,0:09:19.519
and it generates um
0:09:16.399,0:09:22.959
a list with the title and uh
0:09:19.519,0:09:27.440
and the urls and so basically
0:09:22.959,0:09:30.240
replicating what jackie does so
0:09:27.440,0:09:32.399
okay so there are some some other things
0:09:30.240,0:09:33.200
i have to to deal with in order to let's
0:09:32.399,0:09:36.480
say
0:09:33.200,0:09:39.200
accommodate my workflow and but that was
0:09:36.480,0:09:40.240
relatively easy in the sense that one of
0:09:39.200,0:09:43.279
the
0:09:40.240,0:09:45.360
uh problem one of the issue i had to
0:09:43.279,0:09:48.480
solve was that of let's say having
0:09:45.360,0:09:51.040
a common navigation on all my
0:09:48.480,0:09:51.920
pages uh but that was easily solved
0:09:51.040,0:09:54.959
using
0:09:51.920,0:09:56.000
uh the include feature so i basically
0:09:54.959,0:09:57.839
made available
0:09:56.000,0:10:00.560
and include with all the navigation
0:09:57.839,0:10:01.839
which is uh embedded in all the pages of
0:10:00.560,0:10:04.959
my websites
0:10:01.839,0:10:06.160
uh through the could include and another
0:10:04.959,0:10:08.560
nice feature which
0:10:06.160,0:10:09.760
jackie las is the possibility of
0:10:08.560,0:10:12.800
previewing
0:10:09.760,0:10:13.200
a website before deploying it and but
0:10:12.800,0:10:16.079
then
0:10:13.200,0:10:17.839
emacs also has got a node which allows
0:10:16.079,0:10:21.200
you to
0:10:17.839,0:10:24.320
launch a web server and in fact
0:10:21.200,0:10:26.959
i wrote a quick ack
0:10:24.320,0:10:28.000
which allows you to which allows to
0:10:26.959,0:10:31.519
basically
0:10:28.000,0:10:34.720
invoke a node on a on our
0:10:31.519,0:10:37.920
mode project and start a local preview
0:10:34.720,0:10:43.680
and then use rsync
0:10:37.920,0:10:43.680
in order to deploy the the website
0:10:44.839,0:10:48.720
um
0:10:46.240,0:10:51.200
five minutes left okay okay more than
0:10:48.720,0:10:53.200
enough okay
0:10:51.200,0:10:55.440
thanks thank you thank you very much i'm
0:10:53.200,0:10:56.480
nearly done so then i can take some some
0:10:55.440,0:11:00.560
questions
0:10:56.480,0:11:03.680
so okay just to give you maybe
0:11:00.560,0:11:06.480
a slightly more in-depth uh
0:11:03.680,0:11:07.200
view of what the pages look like so
0:11:06.480,0:11:11.120
these are
0:11:07.200,0:11:14.720
one of the pages or the source files
0:11:11.120,0:11:18.480
of one of the websites it is
0:11:14.720,0:11:20.399
in literate programming so basically uh
0:11:18.480,0:11:22.640
you see there is some metadata here i
0:11:20.399,0:11:26.640
mean this is a regular old mod file
0:11:22.640,0:11:29.920
and this part here
0:11:26.640,0:11:31.519
basically defines some common options
0:11:29.920,0:11:35.920
for publication
0:11:31.519,0:11:41.120
and these two includes here
0:11:35.920,0:11:44.480
put some extra html in the head part and
0:11:41.120,0:11:48.079
the navigation and here as you can see
0:11:44.480,0:11:50.160
is the code generating the
0:11:48.079,0:11:52.240
the list in chronological order it is
0:11:50.160,0:11:53.839
slightly more complex than the example i
0:11:52.240,0:11:56.240
made in the slide
0:11:53.839,0:11:57.839
because uh there is some more
0:11:56.240,0:11:59.760
elaboration to
0:11:57.839,0:12:01.839
uh to do including putting some
0:11:59.760,0:12:05.120
javascript to identify
0:12:01.839,0:12:08.160
according to let's say the the tags
0:12:05.120,0:12:11.200
so to go back to the to the presentation
0:12:08.160,0:12:13.600
um so the okay so
0:12:11.200,0:12:14.560
i i managed this migration uh a few
0:12:13.600,0:12:17.680
months ago
0:12:14.560,0:12:20.399
and then uh all my workflow is within
0:12:17.680,0:12:23.079
with old mode and within imax and um
0:12:20.399,0:12:24.240
i'm very happy with it because it's
0:12:23.079,0:12:26.800
simplified
0:12:24.240,0:12:28.480
uh quite a bit let's say my public
0:12:26.800,0:12:31.839
publication process
0:12:28.480,0:12:34.240
and uh one of the advantages so another
0:12:31.839,0:12:36.959
advantage so the first advantage is that
0:12:34.240,0:12:38.160
everything is in ork mode and dmax
0:12:36.959,0:12:41.680
second advantage
0:12:38.160,0:12:44.880
is that everything is based on the
0:12:41.680,0:12:47.760
standard machinery provided by orb mode
0:12:44.880,0:12:50.079
so in a sense it is kind of let's say
0:12:47.760,0:12:53.040
more robust with respect to
0:12:50.079,0:12:54.320
dependencies and possible errors and so
0:12:53.040,0:12:56.639
on and so forth
0:12:54.320,0:12:58.240
and um and the fact that the old mode
0:12:56.639,0:13:00.880
allows you to publish
0:12:58.240,0:13:03.839
a single file in a project is is also
0:13:00.880,0:13:07.839
very interesting because
0:13:03.839,0:13:11.040
it allows to let's say be more robust to
0:13:07.839,0:13:14.079
problems you might introduce when
0:13:11.040,0:13:14.959
you're changing when i'm changing the
0:13:14.079,0:13:16.880
setup
0:13:14.959,0:13:18.320
and another interesting thing which i
0:13:16.880,0:13:21.519
realized that i
0:13:18.320,0:13:23.600
uh i could have is that
0:13:21.519,0:13:24.880
in a sense the specification of the
0:13:23.600,0:13:27.360
website
0:13:24.880,0:13:28.480
is uh can be embedded in the website
0:13:27.360,0:13:30.800
itself
0:13:28.480,0:13:31.839
so in a sense this is some kind of let's
0:13:30.800,0:13:35.120
say self
0:13:31.839,0:13:37.200
the command it's a real set documenting
0:13:35.120,0:13:38.560
uh what i'm actually doing so for
0:13:37.200,0:13:42.800
instance
0:13:38.560,0:13:42.800
uh here on my
0:13:43.199,0:13:48.240
website you can see let's say the
0:13:46.399,0:13:51.519
specification of the
0:13:48.240,0:13:52.320
of the of the project which is uh loaded
0:13:51.519,0:13:55.519
from my
0:13:52.320,0:13:56.320
initialization file but then it is also
0:13:55.519,0:13:59.440
published
0:13:56.320,0:14:01.360
together with my home page and it leaves
0:13:59.440,0:14:05.360
with the repository where
0:14:01.360,0:14:08.079
i keep all the sources of my website
0:14:05.360,0:14:09.839
which is kind of nice because it
0:14:08.079,0:14:14.079
basically isolates
0:14:09.839,0:14:16.880
everything in a single in a single place
0:14:14.079,0:14:18.000
okay so there are some examples i'm
0:14:16.880,0:14:20.320
showing them
0:14:18.000,0:14:21.760
more because of the let's say source
0:14:20.320,0:14:25.519
code which
0:14:21.760,0:14:26.160
you can grab from the git repositories
0:14:25.519,0:14:28.399
if you are
0:14:26.160,0:14:30.079
interested of course i'm also available
0:14:28.399,0:14:32.959
to provide some
0:14:30.079,0:14:34.480
support and help if you are interested
0:14:32.959,0:14:37.760
in this kind of stuff
0:14:34.480,0:14:38.560
the the next step for me will be that of
0:14:37.760,0:14:41.600
let's say trying
0:14:38.560,0:14:45.199
making this kind of machinery available
0:14:41.600,0:14:47.120
for more general use at the moment
0:14:45.199,0:14:48.800
if you are interested in trying out my
0:14:47.120,0:14:49.839
suggestion is let's say grabbing the
0:14:48.800,0:14:52.959
sources
0:14:49.839,0:14:56.000
or one of the let's say websites to see
0:14:52.959,0:14:56.720
what how they look like and maybe try
0:14:56.000,0:15:00.160
and
0:14:56.720,0:15:02.720
customize it for your purposes
0:15:00.160,0:15:03.839
and this is basically the content of my
0:15:02.720,0:15:06.959
talk so
0:15:03.839,0:15:07.279
i'm open to two questions and thank you
0:15:06.959,0:15:10.880
for
0:15:07.279,0:15:12.880
your attention you are now unmuted uh
0:15:10.880,0:15:14.480
thank you very much adolfo for your
0:15:12.880,0:15:17.360
awesome presentation
0:15:14.480,0:15:19.360
um i think we have time for maybe like
0:15:17.360,0:15:21.279
one or two questions
0:15:19.360,0:15:22.880
um and then the rest maybe you could
0:15:21.279,0:15:26.639
take up um
0:15:22.880,0:15:30.000
after the stream after sure
0:15:26.639,0:15:31.839
uh i we should do um would you like me
0:15:30.000,0:15:35.199
to read you the questions
0:15:31.839,0:15:40.399
uh yeah probably better because
0:15:35.199,0:15:42.480
i kind of lost there okay no problem um
0:15:40.399,0:15:45.440
okay so someone asks do you have any
0:15:42.480,0:15:48.639
opinion on fern
0:15:45.440,0:15:51.839
fan i i don't know fans
0:15:48.639,0:15:55.040
so i'll give it a try and uh and uh
0:15:51.839,0:15:57.839
and check it out okay
0:15:55.040,0:15:59.680
thanks and um people are also asking do
0:15:57.839,0:16:01.279
you discuss this for example in a blog
0:15:59.680,0:16:02.800
or anywhere else they could find more
0:16:01.279,0:16:05.600
about it
0:16:02.800,0:16:08.560
oh yes i'm going to publish the let's
0:16:05.600,0:16:11.120
say the talk and the content on the
0:16:08.560,0:16:12.320
on my website and then i'll link it from
0:16:11.120,0:16:14.720
the max conf
0:16:12.320,0:16:15.680
conference so that it will be easier for
0:16:14.720,0:16:19.040
people to
0:16:15.680,0:16:22.880
to reach it so i will shortly make it
0:16:19.040,0:16:25.440
available right after the conference
0:16:22.880,0:16:26.160
wonderful and i think that's all for the
0:16:25.440,0:16:28.560
questions
0:16:26.160,0:16:29.600
thank you very much okay thank you very
0:16:28.560,0:16:34.800
much thank you
0:16:29.600,0:16:34.800
and cheers bye cheers bye
