Full-Stack Android Quiz App: Ktor Backend & Jetpack Compose

Discover how a backend powers a quiz app by storing questions on a server, enabling secure user accounts, dynamic updates, and scalable data delivery beyond the app.

discover why ctr, a Kotlin-based backend, is best choice for our Android quiz app, offering an easy learning curve, small and fast performance, and flexible customization within the Kotlin ecosystem.

Set up the K2 project in IntelliJ IDEA Community, configure gradle kotlin with a version catalog, add back-end dependencies (cater server core, natty engine) and define module and mongodb driver.

Define routes in a Ktor backend with a routing function to create endpoints like categories, questions, and reports that act as addresses returning simple text.

Model a clean domain with topics, questions, and issue reports in domain and model packages for a full-stack android quiz app, using topic codes to link questions and json-ready routes.

Discover why plain text APIs are fragile and learn how JSON enables structured, cross-platform data exchange with key-value pairs and common data types.

Configure your Ktor backend to serve quiz questions in json by enabling content negotiation with Kotlin serialization, annotating data classes with @Serializable, and returning serialized questions via respond.

Test api endpoints with Postman, send requests and view json responses, and organize saved endpoints into a collection and folders, including a get all quiz questions request.

Explore http verbs for create, read, update, delete (crud) and how get, post, put/patch, and delete fetch, create, modify, and remove quiz questions on an API.

Create a post request to upsert quiz questions, sending a JSON body to a route, store questions in memory, and verify with a get request while preparing for request logging.

Enable call logging in a Ktor server to monitor API requests and responses, configure log levels and plugin dependencies, and review logs via logback.xml.

Explore request parameters and query parameters in APIs, showing how path parameters embed ids in the URL while query parameters add optional filters after the base URL.

Learn to extend a Ktor backend by adding delete and get quiz question by id routes, using path parameters, request parameters, and query filters like topic id and limit.

Explore how HTTP status codes categorize API responses into 1xx through 5xx, with examples like 200, 201, 204, 301, 400, 401, 403, 404, 500, and 503.

Modify the keto quiz API to return proper http status codes across routes, including 201 created, 400 bad request, 404 not found, and 204 no content.

Introduce a quiz question repository to separate data operations from routing. Define upsert, get all, get by id, and delete by id, with an in-memory repository wired into routes.

Understand databases by comparing SQL and NoSQL, and see why MongoDB, a NoSQL option, provides flexible, schema-less storage for quiz questions in our keto app.

Enable permanent storage by adding MongoDB Atlas to store quiz questions in a quiz time db collection, using a connection string and environment variable Mongo URI.

Create a quiz question entity to mirror database data and enable json responses, and implement mappers to convert between quiz question and its entity with correct id handling.

Use MongoDB Compass to connect to a MongoDB Atlas cluster, access the quiz time database and quiz collection, and implement the insert function for quiz questions.

Implement and explain MongoDB create, read, update, delete operations for the quiz app: find by id with filters, upsert for insert/update, and get all with topic code and limit.

Create a domain util result wrapper as a sealed interface with success and failure data classes to standardize error handling in the quiz question repository interface.

Improve error handling in the quiz backend by applying a result wrapper to upsert, get by id, and delete by id, returning data errors like not found or database error.

Apply request validation to all quiz question fields, enforcing non-empty inputs, a non-empty incorrect answers list, a positive topic code, and minimum length, with clear error messages.

Learn to implement type-safe routing for quiz questions using a resource plugin in a ktor backend, creating a roots path class and updating post, get, and delete routes.

Define a mongo-backed quiz topic repository with CRUD operations (get all, upsert, get by id, delete by id), map topics to entities, and sort by topic code.

Define quiz topic routes in the Ktor backend for the full-stack Android quiz app, including get all, upsert, get by id, and delete by id, with path and error handling.

Define and implement issue report operations in a Kotlin MongoDB backend: create an issue report repository, implement get all, insert, and delete functions, and map with a dedicated mapper.

Add issue report routes for MongoDB operations, including insert, get all, and delete by id. Validate issue report fields and connect routes to the repository with error handling.

Master Koin dependency injection by configuring a Koin module, binding repositories to interfaces, supplying a single database via singleton, and auto wiring objects in routing for streamlined testing and runtime.

Adopt clean architecture across data, domain, and presentation layers to keep the quiz app modular, scalable, and testable, using MongoDB models, mappers, repositories, and flexible interfaces.

Create a fetch jar that bundles your keto app and all dependencies for server deployment. Use Gradle to build the fat jar for deployment to AWS Elastic Beanstalk.

deploy the ktor app to aws elastic beanstalk by creating iam roles, uploading the jar, and configuring the mongo uri, port, and domain quiz time.

Understand AWS free tier limits for a full-stack android quiz app, including 1 GB monthly data transfer and 750 free EC2 hours. Track charges, set budgets, and enable two-factor authentication.

Update the Ktor backend with bulk insert and random quiz endpoints, enable atlas ip whitelisting, deploy the new jar, and refresh quiz topics and questions for the Android app.

Refactor the routing by consolidating quiz topic, quiz question, and issue report endpoints into single files with extension functions, move paths to a path package, and validate the API calls.

Explore a Spring Boot rest api overview for a Kotlin quiz backend, including controllers, services, repositories, MongoDB integration, validation, exception handling, and dependency injection.

We wrap up the back end section and invite feedback to improve the course and reach more learners, then we move on to the front end with Jetpack Compose.

Build the quiz time Android app interface with Jetpack Compose from design screenshots. The next video sets up the Android project and begins step by step UI development.

Set up an Android project in Android Studio, configure project and module Gradle files, apply plugins, and manage dependencies via a version catalog for a material theme with Jetpack Compose.

Design the dashboard interface by creating a reusable user statistics card and a progress bar using Jetpack Compose; structure components, apply gradient visuals, and prepare previews.

Build a dashboard screen header featuring a user statistics card in a column layout, manage state with a dashboard state data class, and enable name editing via an icon button.

Design a topic card with an icon, topic name, bottom-left placement, and a top-right image loaded via coil, using a placeholder and crossfade.

Design a dashboard grid for quiz topics using a lazy vertical grid with adaptive columns, topic cards, and clickable items, featuring padding, spacing, and a quiz topic data model.

Create a reusable shimmer effect for the dashboard when quiz topics load, animating a gradient box with an infinite transition to signal loading.

Create a reusable error screen composable for the dashboard and quiz topics, featuring a refresh icon and centered error message, with a nullable error message parameter and on refresh action.

Make dashboard responsive in landscape mode using a flow row to place the header on the left and user statistics on the right, with max width, padding, and space between.

Design and implement the dashboard's name edit dialog as a composable alert dialog with is open control, title, body text, a single-line outline text field, and confirm or cancel actions.

Design the quiz screen top bar and a question navigation row in Jetpack Compose. Create data models for quiz questions, user answers, and quiz state, with previews to illustrate interaction.

Design the quiz screen's question section with private composables for question and option items. Display the current question with its options as radio buttons, and handle selection via answers list.

Design a quiz screen with submit and navigation buttons, wire up previous and next icons, manage enabled states by question index, and add an error screen for failed fetches.

Add a quiz screen loading state with a circular progress indicator and a nullable loading message, and implement two dialogs: submit quiz and exit quiz.

Explore how the quiz screen adapts to landscape mode in a full-stack android app, using flow row for option buttons, dynamic width, and spacing to ensure two options per line.

Design the result screen scorecard in a Jetpack Compose Android quiz app. Use emoji drawables, a score percentage state, and data-driven text and icons.

Design a reusable question item for the quiz results screen in the full-stack android quiz app, render a dynamic questions list with a scorecard, explanations, and color-coded correct/incorrect feedback.

Design and implement the issue report screen in Jetpack Compose, including a top bar with back navigation and an expandable question card that animates expansion, color changes, and selectable text.

Design an issue report screen with a reusable issue type section, radio options, and a conditional other text field, plus additional comment and follow-up email inputs in a scrollable layout.

Learn to implement in-app navigation in an Android quiz app by wiring dashboard, quiz, result, and issue report screens with topic code passing, back stack control, and dynamic routes.

Use scaffold in Jetpack Compose to manage system bar padding and edge-to-edge layouts, propagate padding from the nav graph to the nav host, and apply window insets zero for bars.

Add a splash screen as the app’s first launch screen, showing branding while resources load, using the splash dependency, themed for light and dark modes, and auto-dismissal after initialization.

Learn to customize your Android app icon by overriding launcher icons in mipmap, selecting a drawable image asset, resizing for variants, and applying a background layer.

Transform your Figma designs into a Jetpack Compose UI for Quiz Time Android app and prepare to add ViewModel logic, API data fetching, and persistence with Room and Preference datastore.

Fetch quiz topics from the API using a Ktor HTTP client and map quiz topic DTOs to domain models. Display them in the dashboard with a ViewModel and state flow.

Decouple the dashboard view model from data sources by introducing quiz topic and quiz question repositories, map DTOs to domain models, and fetch quiz questions via a remote data source.

Implement navigation and answer tracking for quiz screen using a view model and quiz actions, with next/prev buttons, tab and swipe navigation, and an answers list updated on option selection.

Learn dependency injection with Koin to decouple viewmodels from repositories by binding interfaces to implementations. Start the app with Koin to provide repositories, viewmodels, and data sources.

Discover how to enable offline access by adding local data persistence with Room in Android, storing quiz topics via entity, Dao, and database patterns, and mapping dto to entity.

Apply graceful error handling with a result wrapper and data error types (timeout, no internet, server, serialization) via a Safe Call utility in the remote data source.

Enhance the quiz screen by handling loading states, fetch questions by an optional topic code, update the top bar with the topic name, and show one-time toast errors via events.

Enhance the quiz screen with submit and exit dialogs, onClick actions, view model state updates, and navigation to the dashboard or the result screen, plus no internet and refresh handling.

Shows saving quiz questions to a room database by creating a quiz question entity and dao, using json converters for options, and persisting network data via a view model.

Save user answers to the room local database before submitting the quiz, then fetch those answers on the result screen to calculate and display the score.

Implement get quiz question by id in the issue report flow, fetch from local database, map to a question, and handle success or error with UI state and toast.

Build issue report form in a Jetpack Compose Android app, enabling selectable issue types, text fields for other issues, additional comments, and a follow up email, with ViewModel state updates.

Learn to submit issue reports by building a repository and remote data source, mapping domain to dto, validating input, and posting to a report issues endpoint.

Save user statistics with a preference data store by recording questions attempted and correct answers as integers, exposing get and save functions and updating the dashboard.

Save a username with the preferences data store in a full-stack Android quiz app, featuring a name edit dialog, real-time validation, and whitespace trimming.