A minimal notes app built with Jetpack Compose and Firebase Firestore , implementing full CRUD operations with a clean dark-themed UI.
NotesApp lets you create, read, update, and delete notes that sync to the cloud via Firebase Firestore. No local storage, every note is fetched live from the database. Built to learn how Firebase integrates with a Jetpack Compose UI in a real project.
- Create Notes -> Add a title and content via the Insert Note screen
- Read Notes -> All notes fetched live from Firestore and displayed on the home screen
- Update Notes -> Edit any existing note via the MoreVert (⋮) menu
- Delete Notes -> Remove notes with a single tap from the options menu
- Splash Screen -> Clean branded entry screen with a short delay
- Loading State -> Progress indicator while Firestore data is being fetched
| Splash | Home | Insert Note |
|---|---|---|
![]() |
![]() |
![]() |
| Layer | Technology |
|---|---|
| Language | Kotlin |
| UI | Jetpack Compose |
| Database | Firebase Firestore |
| Navigation | Navigation Compose |
| Architecture | Single activity, screen-based |
com.example.notesapp/
├── Models/
│ └── Notes.kt
├── Navigation/
│ ├── NotesNavigation.kt
│ └── NotesNavigationItem.kt
├── Screens/
│ ├── SplashScreen.kt
│ ├── NotesScreen.kt
│ └── InsertNotesScreen.kt
├── ui/
│ └── theme/
│ ├── Color.kt
│ ├── Theme.kt
│ └── Type.kt
└── MainActivity.kt
This app uses Firebase, you'll need your own Firebase project to run it.
- Create a Firebase project at console.firebase.google.com
- Add an Android app with package name
com.example.notesapp - Download
google-services.json-> place it in the/appfolder - Enable Cloud Firestore in your Firebase console
- Build and run
- Integrating Firebase Firestore for real-time cloud CRUD operations
- Navigation Compose with a sealed class for type-safe routes
- Handling loading and error states during async Firestore calls
- Building a dark-themed UI from scratch with Jetpack Compose
- Managing unique document IDs for update and delete operations


