Slack Clone

431 stars
by Anmol Verma

Slack android clone with Jetpack Compose!

View on GitHub

Documentation

Slack Android Clone with Compose is now in Kotlin Multiplatform!

Status: Active Development happening here https://github.com/oianmol/SlackComposeMultiplatform

This is a jetpack compose sample app written in Kotlin following clean architecture principles.

The purpose of this app to showcase:

  • Implementation of Jetpack Android Architecture components with Dagger Android and jetpack compose
  • Creation of proper components and Subcomponents using Dagger Android and their injection into
    Activity, Compose Views, View Models and Helper Classes
  • Performing background task with Kotlin Coroutines

Screenshots

| Screenshots | In Progress |
|---------------- |------------------------------ |
|

drawing
|
drawing
|
|
drawing
|
drawing
|
|
drawing
| drawing |
|
drawing | drawing |
|
drawing | drawing |
|
drawing | drawing |
|
drawing | |
|
drawing | drawing |

TODOs and questions to self

  • Rewrite the Colors and light/dark mode compatibility!
  • Should we have separate theme for each UI module ?
  • How to handle dynamic theme colors ?

🏗️️ Built with ❤️ using Jetpack Compose 😁

| What | How |
|---------------- |------------------------------ |
| 🎭 User Interface (Android) | Jetpack Compose |
| 🏗 Architecture | Clean |
| 💉 DI (Android) | Hilt |
| 🌊 Async | Coroutines + Flow |
| 🌐 Networking | Retrofit |
| 📄 Parsing | KotlinX |

Languages, libraries and tools used

Architecture

SlackClone follows the principles of Clean Architecture with Android Architecture Components.

Architecture's layers & boundaries:

UI Layer contains UI (Activities, Composables, Fragments) that are coordinated by _
ViewModels which execute 1 or multiple UseCases._ Presentation Layer depends on Domain Layer.

Domain Layer is the most INNER part of the circle (no dependencies with other layers) and it
contains Entities, Use cases & Repository Interfaces. Use cases combine data from 1 or multiple
Repository Interfaces.

Data Layer contains Repository Implementations and 1 or multiple Data Sources. Repositories
are responsible to coordinate data from the different Data Sources. Data Layer depends on Domain
Layer.

Notes: Mapping between response models and transformed models will happen via extension
functions defined in transformed model file

When writing a new ui module

  • First, Create a new android library module
  • Make sure to copy build.gradle.kts from other ui module and paste it in your ui-module
  • We need one fragment to host the composables, this fragment will be added to main nav graph.
  • the routing within compose world is handled with Compose Navigator
  • and to move out of one ui module you need to use the fragment navigator!

Conventions:

Files are suffixed with be defined Class types.

  • ViewModels are suffixed with VM. Ex: LoginVM
  • UseCases are suffixed with UseCase. Ex: LoginUseCase
  • Sources are suffixed with Source. Ex: LoginRemoteSource, LoginLocalSource
  • Repositories are suffixed with Repo. Ex: LoginRepo

Conclusion

This project can be used as a template for new apps. This project is continually evolving to
integrate other libraries and techniques to keep it up to date.

Dispatch Newsletter
Be the first to discover new Compose libraries
Curated Insights
Digest in 5 minutes or less
Android Analysis
Entertaining takes on happenings
Insider Tips
From top Android developers
Hidden Gems
You won't find elsewhere
"
"I truly love this newsletter ❤️‍🔥 Spot on content and I know there's a lot of effort that goes behind it. Great work!"
theapache64
Staff Software Engineer @ Disney+ Hotstar
Join thousands of Android devs who look forward to Dispatch every week