Why architecture scales codebases in Android Kotlin - Build It to Prove It

Build: Architecture Explanation

This screen explains why using architecture helps scale Android codebases by showing a simple example with and without architecture.

Target UI

----------------------------------
| Architecture Scales Codebases   |
|--------------------------------|
| Without Architecture:           |
| - Code is tangled              |
| - Hard to add features         |
|                                |
| With Architecture:             |
| - Clear layers                 |
| - Easy to maintain            |
|                                |
| [Show Example]                 |
----------------------------------

Display a title at the top

Show two sections: 'Without Architecture' and 'With Architecture' with bullet points

Add a button labeled 'Show Example' at the bottom

When the button is tapped, show a simple dialog explaining how architecture separates concerns

Starter Code

Android Kotlin

package com.example.architecture

import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import android.widget.Button
import android.widget.TextView
import androidx.appcompat.app.AlertDialog

class ArchitectureActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_architecture)

        val showExampleButton: Button = findViewById(R.id.showExampleButton)
        // TODO: Add button click listener to show dialog
    }
}

Task 1

Task 2

Solution

Android Kotlin

package com.example.architecture

import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import android.widget.Button
import androidx.appcompat.app.AlertDialog

class ArchitectureActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_architecture)

        val showExampleButton: Button = findViewById(R.id.showExampleButton)
        showExampleButton.setOnClickListener {
            AlertDialog.Builder(this)
                .setTitle("Architecture Example")
                .setMessage("Architecture separates code into layers like UI, business logic, and data. This makes it easier to add features and fix bugs without breaking other parts.")
                .setPositiveButton("OK", null)
                .show()
        }
    }
}

This code adds a click listener to the button. When tapped, it shows a dialog explaining how architecture separates concerns into layers. This separation helps keep code organized and easier to maintain as the app grows.

Final Result

Completed Screen

----------------------------------
| Architecture Scales Codebases   |
|--------------------------------|
| Without Architecture:           |
| - Code is tangled              |
| - Hard to add features         |
|                                |
| With Architecture:             |
| - Clear layers                 |
| - Easy to maintain            |
|                                |
| [Show Example]                 |
----------------------------------

User taps 'Show Example' button

An alert dialog appears with title 'Architecture Example' and message explaining separation of concerns

User taps OK to dismiss the dialog

Stretch Goal

Add a dark mode toggle that switches the screen background and text colors

💡 Hint

Use AppCompatDelegate.setDefaultNightMode() and update UI colors accordingly

Practice

1. Why is using an architecture pattern important when building Android apps?

easy

A. It automatically writes code for you.

B. It makes the app run faster on all devices.

C. It organizes code into clear parts making it easier to manage.

D. It removes the need for testing the app.

Solution

1. Step 1: Understand the role of architecture

   Architecture divides the app into parts like UI, data, and logic to keep code organized.

2. Step 2: Recognize benefits of organization

   Organized code is easier to grow, fix, and share among team members.

3. Final Answer:

   It organizes code into clear parts making it easier to manage. -> Option C

4. Quick Check:

   Architecture = Organized code [OK]

Hint: Architecture means clear code parts for easier work [OK]

Common Mistakes:

• Thinking architecture speeds up app performance directly
• Believing architecture writes code automatically
• Assuming architecture removes testing needs

2. Which Kotlin syntax correctly defines a simple interface for a repository in an architecture pattern?

easy

A. interface UserRepository { fun getUser(id: Int): User }

B. class UserRepository { fun getUser(id: Int): User }

C. fun interface UserRepository { getUser(id: Int): User }

D. interface UserRepository { getUser(id: Int) User }

Solution

1. Step 1: Identify correct interface syntax

   Kotlin interfaces use the keyword 'interface' followed by function signatures with 'fun'.

2. Step 2: Check function declaration format

   Functions inside interfaces must have 'fun' and proper return type with parentheses.

3. Final Answer:

   interface UserRepository { fun getUser(id: Int): User } -> Option A

4. Quick Check:

   Interface + fun + return type = interface UserRepository { fun getUser(id: Int): User } [OK]

Hint: Interfaces need 'fun' before functions in Kotlin [OK]

Common Mistakes:

• Omitting 'fun' keyword inside interface
• Using class instead of interface
• Missing parentheses in function declaration

3. Given this simplified code snippet in an MVVM architecture, what will be printed?

class UserViewModel(private val repo: UserRepository) {
  fun loadUser(id: Int) = repo.getUser(id)
}

class FakeRepo : UserRepository {
  override fun getUser(id: Int) = "User$id"
}

fun main() {
  val vm = UserViewModel(FakeRepo())
  println(vm.loadUser(5))
}

medium

A. Error: getUser not implemented

B. User5

C. 5

D. User

Solution

1. Step 1: Trace the method calls

   Main creates UserViewModel with FakeRepo, then calls loadUser(5), which calls repo.getUser(5).

2. Step 2: Check FakeRepo implementation

   FakeRepo's getUser returns "User" + id, so getUser(5) returns "User5".

3. Final Answer:

   User5 -> Option B

4. Quick Check:

   FakeRepo returns "User" + id = User5 [OK]

Hint: Follow method calls and return values step-by-step [OK]

Common Mistakes:

• Ignoring the parameter passed to getUser
• Assuming getUser returns only id
• Thinking getUser is not implemented

4. What is the main problem in this code snippet that breaks the architecture pattern?

class UserViewModel {
  fun getUser(id: Int) = UserRepository().getUser(id)
}

class UserRepository {
  fun getUser(id: Int) = "User$id"
}

medium

A. UserViewModel creates UserRepository directly, causing tight coupling.

B. UserRepository does not implement an interface.

C. getUser function is missing return type.

D. UserViewModel should not have any functions.

Solution

1. Step 1: Identify dependency creation

   UserViewModel creates UserRepository inside its method, which tightly couples them.

2. Step 2: Understand architecture principle

   Architecture encourages passing dependencies from outside (dependency injection) to keep parts independent.

3. Final Answer:

   UserViewModel creates UserRepository directly, causing tight coupling. -> Option A

4. Quick Check:

   Direct creation = tight coupling = UserViewModel creates UserRepository directly, causing tight coupling. [OK]

Hint: Avoid creating dependencies inside classes; use injection [OK]

Common Mistakes:

• Thinking missing interface is the main issue
• Ignoring tight coupling caused by direct creation
• Believing functions are not allowed in ViewModel

5. You want to scale your Android app with many developers working on UI, data, and logic separately. Which architecture approach best supports this and why?

hard

A. Use a single Activity with all code inside to keep it simple.

B. Use no architecture and let each developer write code anywhere.

C. Write all code in one ViewModel to avoid confusion.

D. Use MVVM because it separates UI, business logic, and data layers clearly.

Solution

1. Step 1: Identify architecture benefits for teams

   MVVM separates UI (View), logic (ViewModel), and data (Model), allowing parallel work.

2. Step 2: Compare with other options

   Single Activity or no architecture mixes code, causing confusion and hard maintenance.

3. Final Answer:

   Use MVVM because it separates UI, business logic, and data layers clearly. -> Option D

4. Quick Check:

   Clear separation helps teams scale = Use MVVM because it separates UI, business logic, and data layers clearly. [OK]

Hint: Choose architecture that splits work clearly for teams [OK]

Common Mistakes:

• Thinking one big class is easier for teams
• Ignoring benefits of separation in architecture
• Believing no architecture scales better