Slide 1
Slide 1 text
Founder Fridays
Jetpack Compose: A declarative
future for building Android apps
Founder Fridays
Lightning Talk
Slide 2
Slide 2 text
Founder Fridays
Vinay Gaba
Google Developers Expert
Slide 3
Slide 3 text
My background
● Google Developer Expert for Android
● Building Android apps since 2011
● Creator of JetpackCompose.app, Showkase & Learn Jetpack Compose By
Example. Passionate about open source and often seen at tech conferences.
● Was recently featured at Google I/O
● I’ve helped build some of your favorite apps
Slide 4
Slide 4 text
What is Jetpack
Compose?
Slide 5
Slide 5 text
noun
Jetpack Compose
/ jetᐧpak kuhmᐧpowz/
Jetpack Compose is a declarative & modern toolkit for
building native Android UI. It simplifies and accelerates UI
development on Android.
Slide 6
Slide 6 text
What is Jetpack Compose?
● What React did for web, Jetpack Compose aims to do that for Android
● Paradigm shift to Android development as we know it
● Complete rewrite from the ground up!!! Massive investment by Google
● The community is embracing it with open arms. Here to stay!
Slide 7
Slide 7 text
Why was it needed?
Slide 8
Slide 8 text
Why was it needed?
● Existing UI Toolkit was tied to the Operating System
● Lots of context switching
● Simple things required a lot of code
● State management was tricky
Slide 9
Slide 9 text
Hello World
Slide 10
Slide 10 text
@Composable
fun HelloWorld() {
Text("Hello World")
}
Slide 11
Slide 11 text
No content
Slide 12
Slide 12 text
@Composable
fun HelloWorld() {
}
It’s a Function
Slide 13
Slide 13 text
@Composable
fun HelloWorld() {
}
It’s a Function
It’s a View
Slide 14
Slide 14 text
@Composable
fun HelloWorld() {
}
It’s a Function
It’s a View
It’s a Layout
Slide 15
Slide 15 text
@Composable
fun HelloWorld() {
}
It’s a Function
It’s a View
It’s a Layout
It’s a Custom View
Slide 16
Slide 16 text
@Composable
fun HelloWorld() {
}
It’s a Function
It’s a View
It’s a Layout
It’s a Custom View
It’s a Screen
Slide 17
Slide 17 text
@Composable
fun HelloWorld() {
}
@Composable is the
magic sauce that
allows it to
transform from a
simple function to
something that
renders UI on the
screen
Slide 18
Slide 18 text
@Preview
@Composable
fun MyCustomComponentPreview() {
MyCustomComponent(“HelloWorld”)
}
Slide 19
Slide 19 text
No content
Slide 20
Slide 20 text
Implementing simple
components
Slide 21
Slide 21 text
No content
Slide 22
Slide 22 text
No content
Slide 23
Slide 23 text
No content
Slide 24
Slide 24 text
No content
Slide 25
Slide 25 text
@Composable
fun ImageWithTitleSubtitleComponent() {
}
Slide 26
Slide 26 text
@Composable
fun ImageWithTitleSubtitleComponent() {
Row() {
Column() {
}
}
}
Slide 27
Slide 27 text
@Composable
fun ImageWithTitleSubtitleComponent() {
Row(...) {
Image(R.drawable.landscape)
Column(...) {
CustomTextComponent(displayText = "Title")
CustomTextComponent(displayText = "Subtitle")
}
}
}
Slide 28
Slide 28 text
Displaying a list
Slide 29
Slide 29 text
No content
Slide 30
Slide 30 text
How it started?
Slide 31
Slide 31 text
@Composable
fun ListComponent(superheroList: List) {
}
Slide 32
Slide 32 text
No content
Slide 33
Slide 33 text
@Composable
fun ListComponent(superheroList: List) {
LazyColumn(items = superheroList) { person ->
}
}
Slide 34
Slide 34 text
@Composable
fun ListComponent(superheroList: List) {
LazyColumn(items = superheroList) { person ->
SimpleRowComponent(
person.name,
person.age,
person.profilePictureUrl
)
}
}
Slide 35
Slide 35 text
@Composable
fun ListComponent(superheroList: List) {
LazyColumn(items = superheroList) { person ->
SimpleRowComponent(
person.name,
person.age,
person.profilePictureUrl
)
}
}
Slide 36
Slide 36 text
Kotlin first
Less code == Better build times
Reduces development time
Interoperable with the existing way
Brings declarative programming to Android
Intuitive and powerful APIs
Slide 37
Slide 37 text
No content
Slide 38
Slide 38 text
The Android community has
embraced Jetpack Compose
with open arms
Slide 39
Slide 39 text
Takeaways
Slide 40
Slide 40 text
Takeaways for Students
● If you are new to Android development, I’d recommend directly learning
Jetpack Compose instead of trying to learn the old Android UI Toolkit (View
system) first.
● The whole industry is a beginner when it comes to Compose. It’s a great
equalizer and it has levelled the playing field. Amazing opportunity to
accelerate your career and put it on the fast track.
Slide 41
Slide 41 text
Takeaways for Designers
● If you haven’t dabbled with programming before, Jetpack Compose is a
relatively easier framework to pick up as it reads like English.
● Great for prototyping, if you prefer doing it on a real device.
● Has a lot of similarities with how Figma thinks about components. For example,
the idea of slots.
● Your engineer counterparts will be talking about Jetpack Compose a lot over
the next couple years. Would be valuable to at least be familiar with it .
Slide 42
Slide 42 text
Takeaways for Developers
● Every company around you will start using Jetpack Compose over the next
couple years.
● Learning Compose is going to be the most efficient use of your time if you want
to be an Android developer
● First mover advantage is real. Industry leaders are often created early on in the
journey of a new technology. You have the opportunity to take one of those
spots.
● Barrier to entry is also much lower right now. Easier to stand out. Make the
most of this opportunity. Lots of low hanging fruit.
Slide 43
Slide 43 text
Takeaways for Engineering Leaders
● Migration/Introduction of Jetpack Compose in your codebase is inevitable.
● You will have to be thoughtful and careful about how you introduce it in your
app.
● Compose does have a steep learning curve and it’s important that you support
your team in embracing this paradigm shift.
● I can help in upleveling your Android team! Please reach out to learn more.
Slide 44
Slide 44 text
Takeaways for Founders
● If you are starting a greenfield Android app, I strongly recommend using only
Jetpack Compose.
● Using Compose is going to be a recruiting advantage over the next few years.
Developers want to work with tools that make their life easier. Jetpack
Compose promises to be that (at least all the early signs are super positive)
● Hiring is probably your #1 problem. If you are looking for Android developers, I
can help. I run a popular Jetpack Compose/Android focused Job Board. Please
reach out to learn more.