• Post category:StudyBullet-14
  • Reading time:6 mins read


Build an Android app that displays Marsian photos in Kotlin with ViewModel and Repositories tested with Unit Test

What you will learn

Create an modern Android application with Jetpack Compose in Kotlin

Organize the code with separate layers

Use Room and Retrofit

Understand the basic of Flow and Kotlin coroutine

Description

During this course, we will create an Android application that will display photos taken by the rovers on Mars.

This app will use all the latest Jetpack technologies :

  • Compose (no more XML)
  • Hilt (Dependency injection library)
  • Room (Jetpack component to create a lite database)
  • Retrofit (Simple libraries to make network request)
  • Coroutines and Flow (To create asynchronous tasks and request our database)

You also use ViewModels with Jetpack Compose.

With this example, you should be able to create an Android App to the industry standard.

Navigation with Jetpack Compose could be challenging, so we will create a simple example with 4 screens and a BottomNav to understand it.


Get Instant Notification of New Courses on our Telegram channel.


Your productivity will be improve as Jetpack Compose is easier to write and reuse.

You will improve your knowledge of Kotlin. If you still use Java, this course is an opportunity to learn.

Compose is a new way to create a UI on Android. It is more concise and reusable. Therefore, it helps to develop faster Android applications.

In this app we will use Jetpack Compose Components:

  • Card
  • LazyColumn
  • Column
  • Row
  • AsyncIamge (from the Coil lib to display an image from a server)
  • Text
  • Image
  • NavHost (to use navigation)
  • NavigationBar
  • NavigationBarItem

We will also see how we can use a modifier to define padding.

English
language

Content

Introduction

Project introduction
Project architecture
Android Studio setup

Basic Compose

How to use Jetpack Compose
Create basic compose item
Create a basic list

Compose Navigation

How to use navigation compose
Create a second screen

Display a compose list based on a network request

How to use Retrofit
How to use Hilt
Use Retrofit to get data from a remote server
Display the list in a compose list

Create a list with image

Add a third screen in the navigation
Create the network request
Display the list from the network
How to use coil
Use Coil to display the image

Create a bottom navigation

How to create a bottom navigation
Create a bottom nav component

Save data in the application

How to use Room
Create a database and add data
Display data from the database

Material3 : Update colors and fonts

How to update colors
Update colors
Update fonts

Unit test

Manifest Convertor Unit Test
Manifest ViewModel Test with mockk and MainCoroutineRule
Manifest Repo Test
Photo List ViewModel Test
Photo Repo Test