►
Description
Speakers: Alessandro Segala
What if the JAMstack (JavaScript, APIs, Markup) could run on the distributed web? Meet IPFS, or the Inter-Planetary File System, a new way to serve static files and apps in a distributed way.
Come to this session and see how you can run your own static JavaScript apps on IPFS, and make them ready for primetime. You’ll learn how to ensure high availability for your app, making it accessible to anyone over HTTPS (thanks Cloudflare!), and how to enable Continuous Integration and Continuous Delivery (using Azure Pipelines).
A
A
This
is
a
talk
about
the
distributed
web,
but
I
promise.
There
will
not
be
any
blockchain
in
this
talk
so
before
we
start
can
I
see
quick,
raise
of
hands
who
has
heard
or
used
the
ipfs
before
so
it
seems
like
this
is
a
new
topic
for
most
people.
So
let's
see
how
I
can
learn
about
this,
so
what
is
ipfs
so
the
definition
that
you
see
here
this
is
actually
my
definition.
It's
not
exactly
their
their
own,
but
I
describe
it
as
a
distributed
peer-to-peer
protocol
and
network
for
accessing
documents.
A
The
concept
of
peer-to-peer
is
in
opposition
of
the
traditional
client-server
method.
As
you
can
see
here,
this
is
the
full
extent
of
my
illustrator
skills,
but
in
a
traditional
model
like
most
of
us,
have
been
building
up
forever.
There
is
a
centralized
server
or
a
cluster
of
servers
and
all
the
clients
connect
to
that
server
and
the
service
serve
the
content,
do
all
the
processing
etc
in
a
pure
peer-to-peer
model,
which
is
something
that
you
might
have
heard
before.
A
If
you
have
used
things
like
BitTorrent,
which
I've
never
absolutely
ever
never
heard,
but
every
node
in
the
network
has
the
same
documents
and
every
single
node
that
is
trying
to
access
a
document
can
request
it
from
every
other
node
in
the
network.
So
it's
essentially
think
of
you
acting
as
a
client,
but
also
as
a
server
at
the
same
time,
keep
in
mind
that
peer-to-peer
does
not
mean
serverless.
In
fact,
as
you
can
see
here
in
this
graphic,
there
is
a
server
in
here.
A
This
is
because
nodes
clients
can
come
and
go
can
join
the
network
and
disappear
at
any
time
they
might
or
might
not
have
the
documents
you're
trying
to
share,
and
so
it's
important
to
keep
one
server
up
and
running
4:7
as
a
sitter
for
your
files
that
are
in
the
peer-to-peer
network.
One
particular
characteristic
of
ipfs
is
that
every
time
a
node
accesses
a
file,
it
also
starts
seeding
it.
A
So
this
means
that
the
more
popular
a
file
is
the
more
people
request
that
file
the
more
spread
out
at
throughout
the
network
is
and
the
more
available
it
is,
which
also
means
that
it
becomes
faster
and
that
it's
really
really
really
hard
to
do
a
DDoS
on
ipfs
because
has
people
try
to
attack
the
network,
they
request
the
fires
and
they
actually
start
seeding
it
too.
So
it's
literally
the
opposite
of
what
people
are
trying
to
do
before
we
get
into
the
next
part.
A
One
important
thing
that
I
want
to
point
out
is
that
ipfs,
when
you
think
of
this,
you
hear
the
name
file
system,
a
lot
of
people,
think
that
is
a
sort
of
Nass.
It's
not
I.
Actually
think
that
that
is
the
bad
stuff
about
the
name,
but
ipfs
is
not
enough.
You
don't
just
upload
your
files
into
this
network
and
then
the
and
then
the
the
network
keeps
your
files
forever.
It's
more
of
a
CDN
literally.
You
just
use
ipfs
to
distribute
your
content,
but
you
must
always
keep
one
node
up
with
your
data
24/7.
A
If
you
want
to
make
sure
that
there's
always
at
least
some
one
seed
in
your
files,
I'm
going
to
go
in
a
demo
in
just
a
moment,
but
before
we
get
into
that,
there's
another
concept
that
I
need
to
explain,
which
is
the
content
IDs.
So
inside
the
ipfs
network
files
are
addressed
using
their
country
ID.
It
starts
with
slash
ipfs
slash,
something
that's
something
is
simply
fine
a
little
bit
it's
a
sort
of
the
sha-256
hash
of
the
file,
and
so
each
file
in
the
network
is
addressed
by
its
own
hash.
A
I
can
also
request
a
folder
in
this
case,
as
you
can
see
in
the
second
example
down
there
in
this
case
I'm
requesting
the
readme
file
inside
a
folder,
and
that
is
the
hash
of
the
folder.
The
hash
of
the
folder
is
calculated
from
the
hash
of
every
single
file.
It's
not
extracted
the
sha-256,
it's
a
little
bit
more
complex
than
that,
but
we
don't
have
a
lot
of
time
today
to
get
into
the
actual
details
of
the
network,
but
these
two
addresses
are
Bob.
They
actually
point
to
the
very
same
file.
A
So
if
one
of
the
nodes
in
the
spirit
of
pure
Network
were
to
send
tampered
content
like
media,
malicious
actor
wants
to
do
a
man-in-the-middle
and
serve
you
modified
content,
then
the
client
would
be
immediately
able
to
understand
that
the
file
was
tampered
with
and
will
reject
that
block.
The
the
other
benefit
of
addressing
content
via
the
counter
IDs
or
the
hash
and
but
which
is
also
challenged,
is
that
the
content
is
immutable.
A
A
Let's
get
into
the
demo
right
away
and
let's
see
how
ipfs
works
so
have
my
machine
here
and
I
have
ipfs
installed
and
I
can
show
that
it's
in
store
by
running
ipfs
version,
and
the
very
first
thing
I
want
to
do
is
run
in
either
PFS
node
into
inside
my
machine,
so
I'm,
starting
it
with
ipfs
daemon.
This
should
take
just
a
second
and
it
will
start
now.
It's
ready,
let's
open
under
terminal
and,
let's
request
a
file
from
the
network.
Most
commands
and
ipfs
are
inspired
by
the
standard
unix
commands.
A
So
in
order
to
request
a
file,
for
example,
the
command
is
ipfs
cat
and
then
the
address
of
the
file.
So
let's
request
that
with
me,
fire
I
was
talking
about
a
moment
ago
and
you
can
see
that
the
file
is
loaded.
So
this
is
me
requested.
I'd
read
me
and
I
requested
it
with
a
peer-to-peer
network
and
some
people
somewhere
in
the
world
scientist
fire
to
me.
I
can
also
list
the
content
of
a
folder,
so
this
file
is
inside
a
folder
and
again
the
command
is
ipfs.
Ls.
A
S4
and
you
can
see
that
this
is
a
folder-
it
contains
a
bunch
of
different
files.
Each
file
also
has
the
hash
of
the
individual
file.
Of
course,
I
can
request
a
file
inside
the
form.
So
let's
do
I
PFS
cat
inside
the
folder
I
want
the
readme
file
and
you
can
see
it's
exactly
the
same
file,
but
this
time
I
access
it
through
the
folder.
Rather
than
the
file
itself.
We
can
publish
documents
on
a
PFS,
so
I
have
a
folder
on
my
desktop
called
good
boys.
A
You
can
probably
imagine
what's
in
here
and
there's
a
bunch
of
files.
So
let's
add
ipfs
had
one
of
these
files
to
the
network
with
the
ipfs
add
command.
You
can
see
that
my
machine
hash
the
file
and
then
publish
it
in
Ella,
PFS
Network.
So
now
everyone
in
the
world
with
this
address
can
retrieve
this
file
from
my
machine.
I
can
also
publish
entire
folders
with
ipfs,
add
dash
R
for
recursive
and
the
folder
name,
and
now
I'm
publish
the
entire
folder.
A
So
this
is
how
you
retrieve
and
add
files
from
the
AP
FS
Network.
Some
of
these
things
that
are
published
are
documents
like
images
that
do
not
really
work
well
inside
the
terminal.
I,
don't
think
you
can
really
look
at
her
images
at
a
terminal.
Thankfully,
there
is
a
better
way
for
that
and
every
single
ipfs
node
every
time
you
start
an
app
EFS
demon
inside
your
machine.
A
So
inside
here
I
have
a
folder
and
I
can
click
on
the
folder
and
oblique
here
it's
that
of
list
in
the
files
this
folder
had
an
index.
Dot
HTML
file
and
I
can
use
this
to
to
publish
more
than
just
just
lists
of
files.
If
I
look
at
the
contents
of
the
folder,
you
will
see
that
there
is
an
index
of
HTML
and
this
fire
inside
is
linking
to
an
image
that
was
in
the
directory
one
level.
A
Above
so,
even
though
every
file
is
identified
by
its
hash,
when
you
put
a
file
inside
that
folder,
you
can
also
reference
file,
but
their
name
and
every
single
path.
As
long
as
it's
relative
can
work
when
I
say
as
long
as
it's
relative
I
mean
you
cannot
start
with
a
slash,
but
you
can
start
with
a
period
or
just
the
path
of
the
fire.
A
So
if
you're
thinking
like
I'm
thinking
when
you
saw
that
I
can
run
index,
dot,
HTML
files
and
they're
actually
rendered
the
next
thing,
your
your
mind
is
going
to
is
jump
stack.
Applications,
I'm
I,
think
that
John
stack
ups
are
quite
familiar
concept
for
many
people
in
this
room.
Those
are
apps
that
are
built
with
jump,
stack
means
Java,
Script,
API
is,
and
pre-rendered
markups
and
they're
very
common
right
now,
when
you're
building
an
app,
for
example,
we'd
react
views,
weld,
angular,
etc.
The
app
is
completely
static.
A
A
If
you
want
to
really
be
fancy,
and-
and
you
can
do
a
lot,
if
you
think
of
modern
junkstock
ups
well,
Facebook
is
being
rebuilt
with
react
and
it's
going
to
be
jump
stack,
Twitter
just
republish
their
app
as
a
jump
stack
up,
you
think
of
Gmail
outlook.com
and
a
bunch
of
other
apps,
it
they're
very,
very
popular.
How
is
this
relevant
for
us
used
in
IP
FS?
Well,
we
could
obviously
serve
these
apps
through
ipfs
as
well.
A
So,
rather
than
having
the
apps
stored
inside
object,
storage
and
a
CDN,
we
use
IP
FS
as
a
content
distribution
network.
The
API
is,
as
you
can
see,
are
still
here.
These
don't
have
to
be
your
api's,
like
you
can,
for
example,
interact
with
third-party
api's
to
provide
value
to
your
users,
so
you
still
do
not
have
to
manage
the
backend
and.
A
A
Is
a
pretty
normal
application
written
in
using
the
svelte
framework?
You
could
use
react,
you
could
use
anything
else
and
it's
compiled
with
webpack.
This
application
is
configured
to
interact
with
imagine.
This
was
an
enterprise
application
and
this
income
is
configured
to
interact
with
the
office.
365
ap
is
and
he
can
show
what's
next
on
my
calendar,
there
is
absolutely
no
server-side
processing
that
I
manage
no
API
that
I
manage,
but
if
I
go
to
a
local
lost
3000,
you
will
see
that
oops.
He
didn't
ask
me
to
authenticate
I
forgot
to
sign
out
anyways.
A
This
is
showing
the
next
appointment
on
my
calendar
tomorrow,
I'm
going
to
get
lunch.
This
place
is
really
good
here
in
Montreal.
If
you
don't
know
that
it's
great
in
your
key
they're,
not
paying
me
for
saying
this,
I
really
love
this
place,
and
so
this
app
is
now
running
locally,
with
just
a
normal
and
p.m.
run
dev.
So
it's
there's
a
web
pack
server.
It's
a
vides
up.
A
The
next
thing
we
want
to
do
is,
as
you
would
normally
do,
stop
the
server
and
actually
run
npm
build
to
build
the
app
and
stage
it.
This
would
take
just
a
second
and
then
my
app
will
be
inside
this
folder.
You
will
see
here
that
we
have
the
index
of
HTML
and
the
JavaScript
CSS
I
can
now
publish
this
up
into
ipfs
as
exactly
as
I
did
before
so
ipfs
ad
air
and
the
content
of
the
dist
folder.
This
app
is
published,
and
now
everyone
can.
A
A
There
is
a
GUI
for
that,
but
still
then,
instead
of
typing
a
URL
like
example.com
that
I
would
have
to
pay
to
type
the
URL
gateway
and
that
very
long
string,
which
is
the
address.
So
thankfully
there
is
a
solution
for
that.
The
first
thing
is
that
your
users,
don't
necessarily
need
to
run
a
PFS
on
their
machine
and
they
can
use
a
third-party
gateway.
There
are
a
few
public
gateways
here.
A
You
see
two
examples:
gateway
dot
appear
faster
IO,
which
is
the
quote:
unquote
official
one
and
a
third
one
and
a
third
party
ones,
or
by
CloudFlare
at
CloudFlare,
ipfs,
dot-com
and
I
am
highlighting
cloud
four
in
particular,
and
we'll
see
that
in
a
moment
why?
So,
by
using
this
rather
than
going
to
localhost
8080,
you
can
go
directly
to
the
same
to
these
addresses
and
you
don't
rip
and
you
don't
need
to
run
a
daemon
locally.
A
The
next
thing
is
the
URL
is
pretty
complicated,
like
imagine
turning
over
someone
over
the
phone
that
they
have
to
go
to
cloud:
fair,
ipfs,
dot-com,
/,
IP,
FS,
/,
q,
my
etc,
etc.
This
is
absolutely
not
nice.
There
is
a
solution
of
ever
and
that
really
relies
on
the
IP
NS
on
the
inn
or
the
interplanetary
names
name
service
and
on
DNS
link.
So
we
can
create
a
txt
record
on
a
domain
and
that
txt
record
can
contain
the
address
of
document
aside
ipfs.
A
So,
for
example,
if
I
want
my
app
to
be
available
on
next
dot,
it
a
lapel
dot
me,
I
will
create
the
txt
record
on
underscore
DRS
link
dot
the
address
and
that
txt
record
contains
the
content.
As
you
see
here
now
that
I've
done
that
anyone,
even
you
right
now
on
your
laptops
or
phones,
you
can
go
to
cloud
for
ipfs,
comm,
/,
IP
and
as
watch
out
for
the
end,
this
time
and
type
the
domain
next
of
Italy
peridot
me
and
that
will
load
your
app
the
very
same
app.
A
Then
very
last
step
is
how
we
can
make
this
even
easier.
So
the
reason
why
I
was
talking
about
the
cloud
fair
gateway
specifically,
is
because
they
have
a
really
cool
feature
which
lets
you
map
a
domain
name
to
the
IPF
to
the
cloud
for
a
PFS
gateway,
and
it
lets
you
visit
the
website
directly
without
having
to
type
CloudFlare
ipfs
calm.
A
A
Like
I
was
saying
a
moment
ago,
this
app
is
now
available
on
cloud
for
ipfs,
calm,
/,
ipfs
/
the
address,
but
I
can
also
change
this
to
IP
NS
/
next
dot,
ETA
pair
here
dot
me
and
it's
a
very
same
app
big,
because
I
mapped
my
domain
to
cloud
4
I
can
actually
use
next
dot
e
3
parallel
dot
me
you
can
see
here.
There
is
the
txt
record
with
the
address,
and
then
there
is
another
cname
that
points
next
dot
it
repaired
at
me:
Clara
ipfs
dot-com.
A
So
if
I
go
to
next
dot,
ETA
parallel
that
me
again
the
very
same
app.
The
other
team
that
I
wanted
to
show.
You
is
how
you
can
actually
move
the
next
step,
which
is
you
don't
normally
as
I'm
sure
all
of
us
know.
We
don't
really
recommend
doing
things
on
the
developer
machine
like
running
NPM,
build
than
ipfs
adder,
and
then
you
have
to
do,
distribute
the
harsh,
updated,
DNS,
etc.
We
can
use
continuous
integration
and
continuous
delivery.
Excuse
me.
A
So
in
this
get
repo,
where
my
code
is
Austin,
which
is
public-
and
you
can
take
a
look
at
that-
these
are
the
code
of
the
application.
I
set
up
continuous
integration
using
Azure
pipelines,
I'm
going
to
make
a
change
and,
for
example,
change
the
title
of
the
page,
which
is
coming
up
on
my
calendar.
But
it
is
the
only
way
where
I'm,
using
that
and
I'm
going
to
change
it
to
next.
On
my
calendar.
A
Committing
the
changes-
and
this
should
trigger
the
continuous
integration
immediately
using
Azure
pipe
and
the
CI
will
take
a
minute.
So
while
the
CI
runs
I'm
going
to
show
you
exactly
what
is
happening
inside
the
CIA
definition,
the
first
step
on
the
CI
is
to
run
npm,
install
it's
good,
npm,
install
and
then
run
npm
build.
This
builds
the
application
as
if
it
were
any
other
application,
then
we
can
scroll
down,
and
this
takes
the
application
and
copies
it
copies.
A
The
compiled
files
to
my
IP
FS
server
using
SSH
this
IP
FS
server,
is
something
that
I
am
running
24/7
and
it
is
running
the
ipfs
daemon
using
docker
I'm
not
going
to
get
into
the
detail
of
how
you
can
set
it
up,
but
these
structures
are
in
that
git
repo
that
you
saw
a
moment
ago.
So,
if
I
run
docker
PS
a
you
can
see
sorry,
you
can
see
that
I
have
an
IP
FS
note:
the
resign
go
ipfs
here.
This
node
is
sudo.
A
A
Because
of
that
you
might
end
up
in
a
situation
in
which
you're
not
is
sitting
the
entire
world
or
like
a
significant
amount
of
data,
so
the
ipfs
daemon
can
periodically
do
garbage
collection.
Instead,
when
you
add
the
file
using
IP
FS
ad
or
when
you
pin
it
using
the
IP
FS
pin
command.
This
file
is
pinned
to
your
node,
and
the
garbage
collection
will
never
remove
that.
A
A
So
the
next
step
in
the
CI
is
actually
the
next
relevant
step
is
that
it
goes
and
automatically
uses
the
cloud
Ferrer
API
to
modify
the
DNS
that
the
value
of
the
txt
record
and
to
automatically
point
my
users
to
the
latest
version
of
the
application.
For
this,
my
domain
is
Austin
on
cloud
for
that
the
dns
is
Austin
on
cloud
4.
If
you
have
another
DNS
provider,
you
can
do
that
as
well.
So
this
guy,
let's
see,
should
have
run
by
now,
and
you
can
see
here
the
CI
was
completed.
A
A
One
other
thing
that
I
wanted
to
say
is
that
I've
been
showing
how
you
can
use
your
own
server,
your
own
Linux
VM,
to
pin
the
files.
There
are
actually
some
third-party
services
that
offer
ipfs
pinning
as
a
service
I'm
not
going
to
name
names.
Those
are
valid
options
at
the
moment
they
do
not
have
any
SLA,
so
I
would
still
prefer
personally.
I
still
prefer
having
my
own
server,
maybe
in
addition
to
using
those
third-party
services.
A
A
So
one
of
the
question
is:
why
would
I
want
to
do
that
like
what
are
the
benefits?
I
have
highlighted
some
of
the
benefits
before,
but
one
other
important
benefit.
That
really
impacted
me
also
personally,
is
that
this
can
really
scale
so
I
had
one
up
one
static
website
that
was
deployed
on
deployed
to
ipfs
and
through
Clara
on
March
13
2019
in
one
day
that
the
app
somehow
got
viral
and
the
traffic
spike
5060
percent.
That
doesn't
mean
5,000
requests,
but
5060
percent
requests
compared
to
the
previous
day.
A
A
That
was
doing
caching,
but,
as
you
know,
a
CDN
also
still
needs
to
go
and
grab
content
from
from
an
from
no
region
and
by
using
IP
FS
I
was
able
to
really
distribute
the
traffic
really
effectively
so
what's
next,
the
first
thing
is
I
would
invite
you
to
be
creative
and
think
of
ways
of
more
and
more
things
that
you
can
do
using
a
gem
stack.
I'll
show
you
before
a
moment
ago.
A
This
demo,
this
demo
had
no
back-end
whatsoever,
and
yet
I
was
able
to
show
my
calendar
as
an
example
and
make
me
up
very
interactive.
I
authenticated
using
Azure
ad
most
organizations
that
are
using
office.
365
already
excuse
me
already,
you
are
on
Azure
ad.
The
other
alternative
is
Google,
Apps
or
G
suite.
So
chances
are
that
if
you're
building
an
enterprise
app,
you
can
totally
rely
on
authentication
on
one
of
those
two
and
you
can
use
those
api's
to
do
a
lot.
You
can
still
date.
You
can
store
data
on
onedrive.
A
A
You
remember
that
the
image
before
the
pristine
API
is
even
if
we're
using
IP,
FS
well,
I
would
say
that
not
quite
yet,
however,
we
are
working
in
a
distributed
web.
Some
people
that
are
much
much
smarter
than
me
are
looking
for
solution
into
that.
However,
I
promise
at
the
beginning,
I
would
not
be
talking
about
blockchain
and
so
I'm
not
going
to
say
anything
else
about
this,
and
so
thank
you
and
you
can
find
the
sample
code
on
github.
My
username
on
Twitter
and
github
is
Italy
pol.