Using Livebook to build and deploy internal tools @ ElixirConf 2024

I gave this talk at ElixirConf US 2024

Our primary job as developers is to deliver new features. As the product grows, a second job emerges: building internal tools.

In this talk, you’ll learn how to build internal tools fast with Livebook and Elixir and with zero to minimal HTML and CSS.

The presentation will cover:

- What are Livebook apps
- What you can build with Livebook apps
- How to deploy Livebook apps

By the end of this talk, you’ll understand how to leverage Livebook to transform scripts, SQL queries, and backend operations into web apps that anybody in your company can use. This will help make your co-workers more self-sufficient and free up your time.

Transcript

1. Using Livebook to build and deploy internal tools By Hugo Baraúna (@hugobarauna)
2. As developers our main job is to deliver new features
3. But over time a second job emerges
4. 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
5. “Should I do it myself, or should I build something to help them?” https://xkcd.com/1205/
6. Internal tools
7. livebook-dev/livebook
8. Apps
9. Hugo Baraúna @hugobarauna Dev advocate @ Livebook 🥑 Elixir Radar newsletter 📩 Elixir Patterns book with @akoutmos 📕 From Brazil 🇧🇷
10. Apps
11. What is a Livebook app?
12. A Livebook app is a way to run a Livebook notebook as an application
13. Examples from users
14. Dr. Mike Williams Owner @ QixSoft Interactive report in 450 LOC
16. 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
17. Examples from Livebook
18. Beta invites in 300 LOC
20. Dashboard in 610 LOC 610 OKC
22. How to build a Livebook app?
23. Live coding
24. How to deploy a Livebook app?
25. How to deploy a Livebook app? Livebook Teams Docker
26. How to deploy a Livebook app? Livebook Teams Docker
27. 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
28. Demo
29. How to deploy a Livebook app? Livebook Teams Docker
30. Livebook Teams free beta
31. 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
32. 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
33. Demo
34. Building blocks Building blocks for rapid development
35. Building blocks for rapid development Elixir-based UI components 1 Database integrations 2 Integration with your main Elixir/Phoenix app 3
36. UI components with Kino zero to minimal need for HTML and CSS
37. Forms and inputs
38. Data tables
39. Charts with Vega Lite
40. Maps with Map Libre
41. "What if there isn’t a built-in component for my needs?"
42. Options to build your own UI component Kino.HTML + CSS i Kino.HTML + CSS + Javascript ii Custom Kino iii
43. Demo
44. Database integrations
45. Database & Data Warehouse intregrations DuckDB PostgreSQL MySQL Microsoft SQL SQlite Google BigQuery Amazon Athena Snow fl ake
46. Demo
48. Integration with your Elixir/Phoenix app via Erlang distributed
49. 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
50. Integration with your main Elixir/Phoenix app your Livebook app your main Elixir/Phoenix app node a node b Erlang distribution :erpc.call
51. Demo
52. Next steps
53. Install Livebook https://livebook.dev
54. Build a Livebook App
55. Deploy a Livebook app https://www.youtube.com/@livebookdev
56. Notebook Demos https://github.com/hugobarauna/livebook-notebooks/tree/main/elixir-conf-2024
57. thank you / obrigado livebook-dev/livebook livebook.dev @livebookdev @hugobarauna