Kotlin/JS provides the ability to transpile your Kotlin code, the Kotlin standard library, and any compatible dependencies to JavaScript. The current implementation of Kotlin/JS targets ES5.
The recommended way to use Kotlin/JS is via the kotlin.js
and kotlin.multiplatform
Gradle plugins. They provide a central and convenient way to set up and control Kotlin projects targeting JavaScript. This includes essential functionality such as controlling the bundling of your application, adding JavaScript dependencies directly from npm, and more. To get an overview of the available options, check out the Kotlin/JS project setup documentation.
There are numerous ways that Kotlin/JS can be used. To provide you some inspiration, here's a non-exhaustive list of scenarios in which you can use Kotlin/JS.
canvas
or WebGL components, and enjoy access to many more of the features supported in modern browsers.kotlin-wrappers
provided by JetBrains, which provide convenient abstractions and deep integrations for one of the most popular JavaScript frameworks. kotlin-wrappers
also provides support for a select number of adjacent technologies like react-redux
, react-router
, or styled-components
. Interoperability with the JavaScript ecosystem also means that you can also use third-party React components and component libraries.kotlinx-nodejs
, you have typesafe access to the Node.js API directly from your Kotlin code.multiplatform
Gradle plugin.Of course, this is not a complete list of how you can use Kotlin/JS to your advantage, but merely a selection of cherry-picked cases. We invite you to experiment with combinations of these use cases, and find out what works best for your project.
Regardless of your specific use case, Kotlin/JS projects can use compatible libraries from the Kotlin ecosystem, as well as third-party libraries from the JavaScript and TypeScript ecosystems. To use the latter from Kotlin code, you can either provide your own typesafe wrappers, use community-maintained wrappers, or let Dukat automatically generate Kotlin declarations for you. Using the Kotlin/JS-exclusive dynamic type allows you to loosen the constraints of Kotlin's type system, allowing you to skip creating detailed library wrappers - at the expense of type safety.
Kotlin/JS is also compatible with the most common module systems: UMD, CommonJS, and AMD. Being able to produce and consume modules means that you can interact with the JavaScript ecosystem in a structured manner.
Want to know more about Kotlin/JS?
In this video, Kotlin Developer Advocate Sebastian Aigner will explain the main Kotlin/JS benefits to you, share some tips and use cases, and also tell you about the plans and upcoming features for Kotlin/JS.
If you're new to Kotlin, a good first step would be to familiarise yourself with the Basic Syntax of the language.
To start using Kotlin for JavaScript, please refer to the Setting up a Kotlin/JS project, or pick a hands-on lab from the next section to work through.
Hands-on labs are long-form tutorials that help you get to know a technology by guiding you through a self-contained project related to a specific topic.
They include sample projects, which can serve as jumping-off points for your own projects, and contain useful snippets and patterns.
For Kotlin/JS, the following hands-on labs are currently available:
Building Web Applications with React and Kotlin/JS guides you through the process of building a simple web application using the React framework, shows how a typesafe Kotlin DSL for HTML makes it convenient to build reactive DOM elements, and illustrates how to use third-party React components, and how to obtain information from APIs, while writing the whole application logic in pure Kotlin/JS.
Building a Full Stack Web App with Kotlin Multiplatform teaches the concepts behind building an application that targets Kotlin/JVM and Kotlin/JS by building a client-server application that makes use of common code, serialization, and other multiplatform paradigms. It also provides a brief introduction into working with Ktor both as a server- and client-side framework.
The new Kotlin/JS IR compiler (currently with Alpha stability) comes with a number of improvements over the current default compiler. For example, it improves the size of generated executables via dead code elimination and makes it smoother to interoperate with the JavaScript ecosystem and its tooling. By generating TypeScript declaration files (d.ts) from Kotlin code, the new compiler makes it easier to create “hybrid” applications that mix TypeScript and Kotlin code, and leverage code-sharing functionality using Kotlin Multiplatform.
To learn more about the available features in the new Kotlin/JS IR compiler and how to try it for your project, visit the documentation.
You can also join #javascript channel in the official Kotlin Slack and chat with the community and the team.
© 2010–2020 JetBrains s.r.o. and Kotlin Programming Language contributors
Licensed under the Apache License, Version 2.0.
https://kotlinlang.org/docs/reference/js-overview.html