Редактировать на GitHub
Оригинал

Kotlin для JavaScript

Kotlin/JS предоставляет возможность переноса вашего кода Kotlin, стандартной библиотеки Kotlin и любых совместимых зависимостей в JavaScript. Текущая реализация Kotlin/JS ориентирована на ES5.

Рекомендуемый способ использования Kotlin/JS - через kotlin.js и плагины Gradle kotlin.multiplatform. Они позволяют в одном месте легко настраивать и управлять проектами Kotlin, ориентированными на JavaScript. Вы можете использовать все основные функции: управление билдингом вашего приложения, добавление зависимостей JavaScript непосредственно из npm и многое другое. Чтобы ознакомиться с доступными опциями, ознакомьтесь с документацией по настройке проекта Kotlin/JS.

Примеры использования Kotlin/JS

Существует множество способов использования Kotlin/JS. Вот неполный список некоторых из них:

  • Написание фронтенда веб-приложений с использованием Kotlin/JS

    • Kotlin/JS позволяет использовать мощные браузерные и веб-API типобезопасным способом. Создавайте, изменяйте и взаимодействуйте с элементами в Document Object Model (DOM), используйте Kotlin-код для управления отображением компонентов canvas или WebGL и наслаждайтесь многими другими функциями, поддерживаемыми современными браузерами.
    • Пишите полноценные, типобезопасные React-приложения с Kotlin/JS, используя kotlin-wrappers, предоставляемую JetBrains, которая обеспечивает удобные абстракции и глубокую интеграцию React и других популярных фреймворков JavaScript. kotlin-wrappers также обеспечивает поддержку ряда смежных технологий, таких как react-redux, react-router и styled-components. Совместимость с экосистемой JavaScript означает, что вы также можете использовать сторонние React-компоненты и библиотеки компонентов.
    • Используйте фреймворки Kotlin/JS, которые в полной мере используют концепции Kotlin, его выразительную мощь и лаконичность.

  • Написание серверных и бессерверных приложений с использованием Kotlin/JS

    • Возможность использования Node.js, предоставляемая Kotlin/JS, позволяет создавать приложения, которые выполняются на сервере или выполняются в бессерверной инфраструктуре. Это дает вам все преимущества JavaScript, такие как быстрый запуск и малый объем памяти. С помощью kotlinx-nodejs у вас есть типобезопасный доступ к Node.js API непосредственно из вашего Kotlin-кода.

  • Мультиплатформенные проекты Kotlin для использования одного кода на нескольких платформах

    • Все функциональные возможности Kotlin/JS также доступны при использовании плагина Gradle multiplatform.
    • Если ваш бэкенд написан на Kotlin, вы можете использовать общий код, такой как модели данных или логика валидации. С бэкендом, написанным на Kotlin/JS, вы можете разрабатывать и поддерживать фулстек веб-приложения.
    • Вы также можете использовать одну бизнес-логику в веб-интерфейсе и мобильном приложении для Android и iOS и избегать дублирования часто используемых функций, таких как предоставление абстракций вокруг REST API endpoint’ов, аутентификации пользователей или моделей вашего домена.

  • Создание библиотеки для использования с JavaScript и TypeScript

    • Вам не нужно писать все свое приложение на Kotlin/JS – вместо этого вы можете создавать библиотеки из своего Kotlin-кода, которые можно использовать в качестве модулей из любой базы кода, написанной на JavaScript или TypeScript, независимо от других фреймворков или технологий, которые вы используете. Такой подход к созданию гибридных приложений позволяет вам использовать компетенции, которыми вы и ваша команда, возможно, уже обладаете в области веб-разработки, помогая при этом сократить объем дублируемой работы.

Конечно, это не полный список всего того, где вы можете использовать Kotlin/JS, а лишь некоторые тщательно отобранные варианты использования. Мы предлагаем вам поэкспериментировать с различными комбинациями и выяснить, что лучше всего подходит для вашего проекта.

Независимо от того, как вы используете Kotlin/JS, ваши проекты могут использовать совместимые библиотеки из экосистемы Kotlin, а также сторонние библиотеки из экосистем JavaScript и TypeScript. Чтобы использовать последнее из Kotlin-кода, вы можете либо предоставить свои типобезопасные собственные обертки, использовать обертки, поддерживаемые сообществом, либо позволить Dukat автоматически генерировать объявления Kotlin. Использование Kotlin/JS-exclusive динамических типов позволяет ослабить ограничения системы типов Kotlin и отказаться от создания подробных библиотечных оболочек, хотя это происходит за счет безопасности типов.

Kotlin/JS также совместим с наиболее распространенными модульными системами: UMD, CommonJS и AMD. Возможность производить и потреблять модули означает, что вы можете взаимодействовать с экосистемой JavaScript структурированным образом.

Kotlin/JS фреймворки

Современная веб-разработка значительно выигрывает от фреймворков, которые упрощают создание веб-приложений. Вот несколько примеров популярных веб-фреймворков для Kotlin/JS, написанных разными авторами:

KVision

KVision - это объектно-ориентированный веб-фреймворк, позволяющий писать приложения на Kotlin/JS с ready-to-use компонентами, которые можно использовать в качестве строительных блоков для пользовательского интерфейса вашего приложения. Вы можете использовать как реактивные, так и императивные модели программирования для создания своего интерфейса, использовать соединители для Ktor, Spring Boot и других фреймворков для интеграции с вашими серверными приложениями и обмениваться кодом с Kotlin Multiplatform.

Чтобы изучить документацию, учебные пособия и примеры, посетите https://kvision.io.

Для обсуждения и получения обновлений фреймворка присоединяйтесь к каналам #kvision и #javascript в Kotlin Slack.

fritz2

fritz2 - это независимый фреймворк для создания реактивных веб-пользовательских интерфейсов. Он предоставляет собственный типобезопасный DSL для создания и визуализации HTML-элементов, а также использует корутины и потоки Kotlin для представления компонентов и их привязок к данным. Он “из коробки” обеспечивает управление состоянием, валидацию, маршрутизацию и многое другое и интегрируется с Kotlin Multiplatform проектами.

Чтобы изучить документацию, учебные пособия и примеры, посетите https://www.fritz2.dev.

Для обсуждения и получения обновлений фреймворка присоединяйтесь к каналам #fritz2 и #javascript в Kotlin Slack.

Doodle

Doodle - это векторный UI фреймворк для Kotlin/JS. Приложения Doodle используют графические возможности браузера для рисования пользовательских интерфейсов вместо того, чтобы полагаться на DOM, CSS или Javascript. Используя этот подход, Doodle дает вам точный контроль над визуализацией произвольных UI элементов, векторных фигур, градиентов и пользовательских визуализаций.

Чтобы изучить документацию, учебные пособия и примеры, посетите https://nacular.github.io/doodle/.

Для обсуждения и получения обновлений фреймворка присоединяйтесь к каналам #doodle и #javascript в Kotlin Slack.

Compose for Web

Compose for Web, часть Compose Multiplatform, добавляет в ваш браузер UI инструментарий Google Jetpack Compose. Это позволяет создавать реактивные веб-пользовательские интерфейсы, используя концепции, представленные Jetpack Compose. Он предоставляет DOM API для описания вашего веб-сайта, а также экспериментальный набор примитивов мультиплатформенной компоновки. Compose for Web также дает вам возможность делиться частями UI кода и логики на Android, десктопе и в web.

Здесь вы можете найти более подробную информацию о Compose Multiplatform.

Присоединяйтесь к каналу #compose-web в Kotlin Slack, чтобы обсудить Compose for Web, или #compose для обсуждения Compose Multiplatform.

Kotlin/JS, Today and Tomorrow

В этом видео Kotlin-разработчик Себастьян Айгнер объясняет основные преимущества Kotlin/JS, делится некоторыми советами и примерами использования, а также рассказывает о планах и планируемых функциях для Kotlin/JS.

Начните работу с Kotlin/JS

Если вы только начали изучать Kotlin, хорошим первым шагом будет ознакомление с базовым синтаксисом языка.

Чтобы начать использовать Kotlin для JavaScript, пожалуйста, ознакомьтесь с разделом Настройка проекта Kotlin/JS. Вы также можете выбрать практические занятия для прорабатывания или ознакомиться со списком примеров проектов Kotlin/JS для вдохновения. Они содержат полезные сниппеты и паттерны и могут послужить хорошей отправной точкой для ваших собственных проектов.

Практические занятия Kotlin/JS

  • Создание веб-приложений с помощью React и Kotlin/JS проведет вас через процесс создания простого веб-приложения с использованием React, покажет, как типобезопасный Kotlin DSL для HTML упрощает создание реактивных элементов DOM и иллюстрирует, как использовать сторонние компоненты React и получать информацию из API, и все это при написании всей логики приложения в чистом Kotlin/JS;
  • Создание фулстек веб-приложения с помощью Kotlin Multiplatform обучает концепциям создания приложения, ориентированного на Kotlin/JVM и Kotlin/JS, путем создания клиент-серверного приложения, использующего общий код, сериализацию и другие мультиплатформенные парадигмы. В нем также содержится краткое введение в работу с Ktor как с серверным, так и с клиентским фреймворком.

Примеры проектов Kotlin/JS

  • Фулстек список дел для совместной работы Spring показывает, как создать список дел для совместной работы с использованием kotlin-multiplatform, таргетированный на JS и JVM, Spring для бэкэнда, Kotlin/JS с React для фронтеда и RSocket;
  • Список дел Kotlin/JS и React Redux реализует список дел React Redux с использованием библиотек JS (react, react-dom, react-router, redux и react-redux) из npm и Webpack для объединения, минимизации и запуска проекта;
  • Фулстек демонстрационное приложение проведет вас через процесс создания приложения с лентой, содержащей созданные пользователями сообщения и комментарии. Все данные берутся из сервисов-заполнителей fakeJSON и JSON Placeholder.

Новый IR-компилятор Kotlin/JS

Новый IR-компилятор Kotlin/JS (в настоящее время находится в бета-версии) содержит ряд улучшений по сравнению с текущим компилятором по умолчанию. Например, он уменьшает размер создаваемых исполняемых файлов за счет устранения мертвого кода и обеспечивает более плавную совместимость с экосистемой JavaScript и ее инструментами. Генерируя файлы объявлений TypeScript (d.ts) из Kotlin-кода, новый компилятор упрощает создание “гибридных” приложений, в которых сочетаются TypeScript-код и Kotlin-код, и позволяет использовать функции Kotlin Multiplatform.

Чтобы узнать больше о доступных функциях нового IR-компилятора Kotlin/JS и о том, как его использовать в вашем проекте, посетите страницу документации IR-компилятора Kotlin/JS и руководство по переносу проектов.

Присоединяйтесь к сообществу Kotlin/JS

Вы также можете присоединиться к каналу #javascript на официальном сайте Kotlin Slack, чтобы пообщаться с сообществом и командой.