?
Outline
Introduction
Kino.Control
Enumerating controls
Kino.Frame and animations
Putting it all together
Running as a Livebook app
Docker deployment
Where to go next
New section
Expand/collapse all
Users
0 connected
Files
Add file
Add file
References
No files yet
Attachments
No files yet
Secrets
Available only to this session
New secret
🏠 Personal secrets
No secrets stored in this workspace so far
App
Slug
?
Session type
Single
Access
Password protected
Configure
Remote deployment
Deploy with Livebook Teams
Manual Docker deployment
Local preview
Launch preview
Runtime
Type
Embedded
Connect
Configure
Memory
230.0 GB available out of 251.8 GB
Connected nodes
No connected nodes
Code zen
Presentation
Custom
ins
Build a chat app with Kino
Export
Erase outputs
Fork
See on Dashboard
Close
Using
🏠
Personal
workspace
🏠
Personal
Add Organization
Setup
Notebook dependencies and setup
Python
Introduction
1 cell collapsed
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
Kino.Control
Introduction
7 cells collapsed
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
Evaluate
Evaluate on demand
Reevaluate automatically
Elixir
Erlang
Python
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
Evaluate
Evaluate on demand
Reevaluate automatically
Elixir
Erlang
Python
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
Evaluate
Evaluate on demand
Reevaluate automatically
Elixir
Erlang
Python
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
Enumerating controls
Introduction
Kino.Control
5 cells collapsed
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
Evaluate
Evaluate on demand
Reevaluate automatically
Elixir
Erlang
Python
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
Evaluate
Evaluate on demand
Reevaluate automatically
Elixir
Erlang
Python
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
Kino.Frame and animations
Introduction
Kino.Control
Enumerating controls
11 cells collapsed
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
Evaluate
Evaluate on demand
Reevaluate automatically
Elixir
Erlang
Python
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
Evaluate
Evaluate on demand
Reevaluate automatically
Elixir
Erlang
Python
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
Evaluate
Evaluate on demand
Reevaluate automatically
Elixir
Erlang
Python
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
Evaluate
Evaluate on demand
Reevaluate automatically
Elixir
Erlang
Python
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
Evaluate
Evaluate on demand
Reevaluate automatically
Elixir
Erlang
Python
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
Putting it all together
Introduction
Kino.Control
Enumerating controls
Kino.Frame and animations
7 cells collapsed
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
Evaluate
Evaluate on demand
Reevaluate automatically
Elixir
Erlang
Python
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
Evaluate
Evaluate on demand
Reevaluate automatically
Elixir
Erlang
Python
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
Evaluate
Evaluate on demand
Reevaluate automatically
Elixir
Erlang
Python
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
Running as a Livebook app
Introduction
Kino.Control
Enumerating controls
Kino.Frame and animations
Putting it all together
1 cell collapsed
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
Docker deployment
Introduction
Kino.Control
Enumerating controls
Kino.Frame and animations
Putting it all together
Running as a Livebook app
1 cell collapsed
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
Where to go next
Introduction
Kino.Control
Enumerating controls
Kino.Frame and animations
Putting it all together
Running as a Livebook app
Docker deployment
1 cell collapsed
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
+ Elixir
Elixir
Erlang
Python
+ Block
Markdown
Section
Branching section
MARKDOWN
Diagram
Image
CODE
Form
+ Smart
(esc)
User profile
?
Display name
Cursor color
Save
(esc)
App settings
Slug
Password-protected
Session type
Single-session
Multi-session
Shutdown after inactivity
Never
5 seconds
1 minute
1 hour
Show source
Only render rich outputs
Zero-downtime deployment
Save
Reset