This project is forked from https://github.com/Kotlin/kotlin-wasm-examples under Apache-2.0 license
This example demonstrates a web-based image gallery for viewing images from a remote server. This application is built with Compose Multiplatform and Kotlin/Wasm.
Note: Web support is in Alpha. It may be changed at any time. You can use it in scenarios before production. We would appreciate your feedback in GitHub.
Compose Multiplatform for web enables sharing your mobile or desktop UIs on the web. Compose Multiplatform for web is based on Kotlin/Wasm, the newest target for Kotlin Multiplatform projects.
Compose Multiplatform for web allows you to run your Kotlin code in the browser, leveraging all WebAssembly's benefits like high and consistent application performance.
Follow the instructions in the sections below to try out this Kotlin/Wasm application.
Before starting, ensure you have the necessary IDE and browser setup to run the application.
We recommend using IntelliJ IDEA 2023.1 or later to work with the project. It supports Kotlin/Wasm out of the box.
To run Kotlin/Wasm applications in a browser, you need a browser supporting the Wasm Garbage Collection (GC) feature:
Chrome and Chromium-based
-
For version 119 or later:
Works by default.
Firefox
-
For version 120 or later:
Works by default.
Safari/WebKit
Wasm GC support is currently under active development.
Note: For more information about the browser versions, see the Troubleshooting documentation.
To build and run the application:
- In IntelliJ IDEA, open the repository.
- Navigate to the
compose-imageviewer
project folder. - Run the application by typing one of the following Gradle commands in the terminal:
-
Web version:
./gradlew :web:wasmJsRun
Once the application starts, open the following URL in your browser:
http://localhost:8080
Note: The port number can vary. If the port 8080 is unavailable, you can find the corresponding port number printed in the console after building the application.
-
Desktop version:
./gradlew :desktopApp:run
-
Android application:
./gradlew :androidApp:installDebug
Give it a try and share your feedback or questions in our #compose-web Slack channel. Get a Slack invite. You can also share your comments with @bashorov on X (Twitter).