Build your modern android app from scratch

Slide 1

Slide 1 text

George Town Su Myat Senior Android Developer, Lomotif.SG Building your modern app from scratch

Slide 2

Slide 2 text

What ’ll talk about today 1. Android: overview things need to know before we build our Android app from scratch 2. Importance: the problem with the way we build apps without architecture and why it will tire you out 3. App in Action: let’s get our hands dirty ;)

Slide 3

Slide 3 text

What ’ll talk about today 1. What do we need to know before we build our Android app from scratch a. Android : brief overview b. Language : for developing our apps c. Android Studio : we use it to build apps 2. Hands on simply app in MAD way :)

Slide 4

Slide 4 text

Android Overview

Slide 5

Slide 5 text

Overview of Android 1. Mobile Operating System designed by Google 2. Support many different devices such as Phones/ Tablets/ TVs/ Wears and even Cars. 3. Career Demanding since most use in the world 4. Easy to start, probably easier than you think, plenty of fress courses including google official videos/ codelabs/ gudile will guide you along the way

Slide 6

Slide 6 text

What will you need 1. Powerful computer >= 8GB run 2. Stable Internet connection 3. Download and Install Android Studio 4. Need to have any experience with Android,you can even start learn with programming knowledge in general

Slide 7

Slide 7 text

Download and Install Android Studio https://developer.android.com/studio

Slide 8

Slide 8 text

Go this link if you need more detail setup https://bit.ly/3EgdmQs

Slide 9

Slide 9 text

Importance Why do we need an architecture?

Slide 10

Slide 10 text

The common problem with how we do things 1. Retrofit: REST Api communication 2. Coroutine: managing background work like fetching movie list 3. ViewModel: store UI-related that survive configuration changes such as rotate screen 4. Stateflow: reacts UI when the underlying data has updates 5. Coil: Image Preview

Slide 11

Slide 11 text

1. All code inside activities/fragments 2. The views unnecessarily complex and massive 3. A small changes have to redo entire views 4. The views aren’t easy to test because of massive size and complexity 5. The code cannot be reused,tested,refactored and easily debugged. The common problem with how we do things

Slide 12

Slide 12 text

Why an architecture will make you life easier 1. Complex tasks are split into simpler tasks and are easier to solve. 2. Smaller objects, less bugs,easier to debug 3. View and UI state holders like ViewModel classes stay neat and classy 4. Readability, Scalability and Portability,Testability 5. if requirements change, usually it’s quite easy to pinpoint exactly you need to change in your code with minimal implications

Slide 13

Slide 13 text

App in Action Let’s make our hands on dirty

Slide 14

Slide 14 text

Example Feature Display latest movies Add to favorite

Slide 15

Slide 15 text

App’s dependencies 1. Retrofit: REST Api communication 2. Coroutine: managing background work like fetching movie list 3. ViewModel: store UI-related that survive configuration changes such as rotate screen 4. Stateflow: reacts UI when the underlying data has updates 5. Coil: Image Preview

Slide 16

Slide 16 text

Architecture Perform Business logic Obtains and exposes app data Data UI

Slide 17

Slide 17 text

Architecture Perform Business logic Obtains and exposes app data Data UI expose data Reactive UI Display data on the screen

Slide 18

Slide 18 text

Architecture Perform Business logic Obtains and exposes app data Data UI expose data Reactive UI Display data on the screen Events UI layer does not pull data, only collect. Data layer handles events, updating underlying data and omitting any changes back.

Slide 19

Slide 19 text

Architecture Perform Business logic Obtains and exposes app data Data UI expose data Reactive UI Display data on the screen Events Reactive UI Single source of truth Unidirectional flow

Slide 20

Slide 20 text

Example Feature Display latest movies Add to favorite

Slide 21

Slide 21 text

Architecture in Example coroutine store movie list Data UI movie list Display move list on screen

Slide 22

Slide 22 text

Architecture in Example coroutine store movie list Data UI movie list Display move list on screen

Slide 23

Slide 23 text

Architecture in Example coroutine store movie list Data UI movie list Display move list on screen Save/ Unsave Favorite Movie

Slide 24

Slide 24 text

Data Layer Repository Data source Obtains data Centralizes data changes

Slide 25

Slide 25 text

Data Layer in Example MovieRepository NetworkDatasource movie list load movie list

Slide 26

Slide 26 text

Data Layer MovieRepository NetworkDatasource movie list load movie list REST API

Slide 27

Slide 27 text

Example Feature Data UI Display Movie list movie list

Slide 28

Slide 28 text

UI Layer Screen ViewModel Hold UI state Display UI State

Slide 29

Slide 29 text

UI state composition MovieRepository MovieViewModel MovieUiState Jetpack Compose

Slide 30

Slide 30 text

UI design LazyColumn Card View

Slide 31

Slide 31 text

Modularization MainActivity MovieViewModel MovieScreen MovieRepository NetworkDatasource app:module UI Data

Slide 32

Slide 32 text

Types of module :app :feature :core Responsible for Bringing features together Single user-facing functionality Single area of common functionality

Slide 33

Slide 33 text

Modules :app :feature:movie :core:data :core:network NetworkDataSource MainActivity MovieScreen, MovieViewModel MoviewRepository

Slide 34

Slide 34 text

Keep learning: goo.gle/android-arch https://github.com/android/ nowinandroid goo.gle/android-local-tests