Using Livebook
to build and deploy
internal tools
By Hugo Baraúna (@hugobarauna)
Slide 2
Slide 2 text
As developers
our main job is to
deliver new features
Slide 3
Slide 3 text
But over time
a second job
emerges
Slide 4
Slide 4 text
But over time
a second job
emerges
{
{"Can you pull this report for me?”
- product
"Can you run the refund script for me?”
- support
“How did you do that in production?
- engineering
Slide 5
Slide 5 text
“Should I do it myself, or
should I build something to
help them?”
https://xkcd.com/1205/
Slide 6
Slide 6 text
Internal tools
Slide 7
Slide 7 text
livebook-dev/livebook
Slide 8
Slide 8 text
Apps
Slide 9
Slide 9 text
Hugo Baraúna
@hugobarauna
Dev advocate @ Livebook
🥑
Elixir Radar newsletter
📩
Elixir Patterns book with @akoutmos
📕
From Brazil
🇧🇷
Slide 10
Slide 10 text
Apps
Slide 11
Slide 11 text
What is a
Livebook app?
Slide 12
Slide 12 text
A Livebook app is
a way to run a Livebook notebook
as an application
Slide 13
Slide 13 text
Examples
from users
Slide 14
Slide 14 text
Dr. Mike Williams
Owner @ QixSoft
Interactive
report
in 450 LOC
Slide 15
Slide 15 text
No content
Slide 16
Slide 16 text
Rodolfo Silva
CTO @ In
fl
eet
Discord bot
Hey team, just sharing some relevant facts:
Analysis of Submissions and Goal Status
Goal On target Outside target
Goal status
Goal achieved
Analysis generated on: 2024-08-20 13:43:00Z
95% 97% 3%
in 164 LOC
Slide 17
Slide 17 text
Examples
from Livebook
Slide 18
Slide 18 text
Beta invites
in 300 LOC
Slide 19
Slide 19 text
No content
Slide 20
Slide 20 text
Dashboard
in 610 LOC
610 OKC
Slide 21
Slide 21 text
No content
Slide 22
Slide 22 text
How to build a
Livebook app?
Slide 23
Slide 23 text
Live
coding
Slide 24
Slide 24 text
How to deploy a
Livebook app?
Slide 25
Slide 25 text
How to deploy a Livebook app?
Livebook Teams
Docker
Slide 26
Slide 26 text
How to deploy a Livebook app?
Livebook Teams
Docker
Slide 27
Slide 27 text
How to deploy with Docker
Copy the Docker
fi
le generated via Livebook
1
Generate a Docker image
2
Run the Docker image in a container hosting service
(Fly.io, Amazon AWS, Google Cloud, Kubernetes etc)
3
Slide 28
Slide 28 text
Demo
Slide 29
Slide 29 text
How to deploy a Livebook app?
Livebook Teams
Docker
Slide 30
Slide 30 text
Livebook Teams
free
beta
Slide 31
Slide 31 text
How to deploy with Livebook Teams
Create a deployment group inside your Teams organization
1
Install the Livebook app server docker image in your infra-structure
2
Click the “deploy" button
3
Slide 32
Slide 32 text
How to deploy with Livebook Teams
Create a deployment con
fi
g inside your Teams organization
Install the Livebook app server docker image inside your infra-structure
Click the “deploy" button
1
Once the setup is done
Slide 33
Slide 33 text
Demo
Slide 34
Slide 34 text
Building blocks
Building blocks
for rapid development
Slide 35
Slide 35 text
Building blocks for rapid development
Elixir-based UI components
1
Database integrations
2
Integration with your main Elixir/Phoenix app
3
Slide 36
Slide 36 text
UI components with Kino
zero to minimal need for HTML and CSS
Slide 37
Slide 37 text
Forms and inputs
Slide 38
Slide 38 text
Data tables
Slide 39
Slide 39 text
Charts
with Vega Lite
Slide 40
Slide 40 text
Maps
with Map Libre
Slide 41
Slide 41 text
"What if there isn’t a built-in
component for my needs?"
Slide 42
Slide 42 text
Options to build your own UI component
Kino.HTML + CSS
i
Kino.HTML + CSS + Javascript
ii
Custom Kino
iii
Slide 43
Slide 43 text
Demo
Slide 44
Slide 44 text
Database integrations
Slide 45
Slide 45 text
Database & Data Warehouse intregrations
DuckDB
PostgreSQL MySQL Microsoft SQL SQlite
Google BigQuery Amazon Athena Snow
fl
ake
Slide 46
Slide 46 text
Demo
Slide 47
Slide 47 text
No content
Slide 48
Slide 48 text
Integration with
your Elixir/Phoenix app
via Erlang distributed
Slide 49
Slide 49 text
Integration with your main Elixir/Phoenix app
using a No Code tool
internal tool
with
No Code
your main
Elixir/Phoenix
app
HTTP HTTP
API
Slide 50
Slide 50 text
Integration with your main Elixir/Phoenix app
your
Livebook
app
your main
Elixir/Phoenix
app
node a node b
Erlang distribution
:erpc.call
Slide 51
Slide 51 text
Demo
Slide 52
Slide 52 text
Next steps
Slide 53
Slide 53 text
Install
Livebook
https://livebook.dev
Slide 54
Slide 54 text
Build a
Livebook
App
Slide 55
Slide 55 text
Deploy a
Livebook app
https://www.youtube.com/@livebookdev