Kotlin/JS 프레임워크
Kotlin/JS 프레임워크
웹 개발을 단순화하는 다양한 Kotlin/JavaScript 프레임워크를 활용해 보세요. 이 프레임워크들은 사용 가능한 컴포넌트, 라우팅, 상태 관리, 현대적인 웹 애플리케이션 구축에 필요한 기타 도구를 제공합니다.
본문
커뮤니티에서 제공하는 몇 가지 Kotlin/JS 웹 프레임워크를 소개할게요.
Kobweb
Kobweb은 Compose HTML로 웹사이트와 웹 애플리케이션을 만드는 Kotlin 프레임워크예요. 빠른 개발을 위한 라이브 리로딩(live-reloading)을 지원합니다. Next.js에서 영감을 받아, Kobweb은 위젯, 레이아웃, 페이지를 추가하기 위한 표준 구조를 권장해요.
기본적으로 Kobweb은 페이지 라우팅, 라이트/다크 모드, CSS 스타일링, Markdown 지원, 백엔드 API 등을 제공합니다. 또한 현대적인 UI를 위한 다양한 위젯 세트를 갖춘 UI 라이브러리인 Silk도 포함돼 있어요.
Kobweb은 SEO와 자동 검색 인덱싱을 위한 페이지 스냅샷을 생성해 사이트를 내보내는 것도 지원합니다. 또한 상태 변화에 효율적으로 대응하는 DOM 기반 UI를 만들 수 있게 해 줍니다.
자세한 내용과 예시는 Kobweb 문서를 확인하세요. 프레임워크에 대한 업데이트와 토론은 Kotlin Slack의 #kobweb 및 #compose-web 채널에 참여해 보아요.
Kilua
Kilua는 Compose Runtime 위에 구축된 구성 가능한(composable) 웹 프레임워크로, compose-html 라이브러리와 비슷해요. compose-html과 달리 Kilua는 Kotlin/Wasm과 Kotlin/JS 대상을 모두 지원합니다.
Kilua는 선언형 UI 컴포넌트를 만들고 그 상태를 관리하기 위한 모듈식 API를 제공해요. 일반적인 웹 애플리케이션 사용 사례에 바로 사용할 수 있는 컴포넌트 세트도 포함하고 있습니다.
Kilua는 KVision 프레임워크의 후속작이에요. Compose 사용자(@Composable 함수, 상태 관리, 코루틴/플로우 통합)와 KVision 사용자(UI 컴포넌트와 약간의 명령형 상호작용을 허용하는 컴포넌트 기반 API) 모두에게 친숙하게 설계되었습니다.
자세한 내용과 예시는 Kilua 문서를 확인하세요. 프레임워크에 대한 업데이트와 토론은 Kotlin Slack의 #kilua 채널에 참여해 보아요.
Summon
Summon은 JVM, Kotlin/JS, Kotlin/Wasm에서 고성능 애플리케이션을 구축하기 위한 Kotlin Multiplatform 프론트엔드 프레임워크예요. 컴포넌트 기반 UI 개발, HTML 스트리밍을 지원하는 일급(first-class) 서버 사이드 렌더링(SSR), 깔끔한 CSS로 컴파일되는 수정자(modifier) 기반 스타일링을 지원합니다.
Summon은 접근성과 고급 동작을 위한 런타임 인지 컴포넌트에도 집중하면서, 플랫폼 전반에서 통일된 코드베이스를 유지해요.
자세한 내용과 예시는 Summon 문서를 확인하세요.
Kinetica
Kinetica는 웹 앱의 실용적인 결과에 초점을 맞춘 Kotlin UI 프레임워크예요. 서버 렌더링을 통한 빠른 초기 페이지 전달, SEO 친화적인 HTML 출력, 페이지 로드 후 대화형 클라이언트 사이드 UI로의 부드러운 전환을 제공합니다. 또한 전체 브라우저 환경에 의존하지 않고 UI 동작을 빠르고 안정적으로 테스트하는 데 도움이 되는 헤드리스(headless) 테스트도 지원해요.
기본적으로 Kinetica에는 라우팅, 폼, 영속성(persistence) 모듈이 포함되어 있어서, 팀이 일반적인 앱 기능을 더 빨리 출시할 수 있어요. 그 업데이트 모델은 최소한의 DOM 패치를 적용해 상태가 변해도 상호작용이 반응적으로 유지되도록 돕고, 일관된 반응형 모델은 더 큰 앱에서 예기치 않은 동작을 줄이도록 설계되었습니다.
자세한 내용과 예시는 Kinetica 문서를 확인하세요.
Kotlin React
React는 웹 및 네이티브 사용자 인터페이스에 널리 사용되는 컴포넌트 기반 라이브러리예요. 방대한 컴포넌트 생태계, 학습 자료, 활발한 커뮤니티를 제공합니다.
Kotlin React는 React 생태계와 Kotlin의 타입 안전성과 표현력을 결합한 React용 Kotlin 래퍼입니다.
라이브러리에 대한 업데이트와 토론은 Kotlin Slack의 #react 및 #javascript 채널에 참여해 보아요.
KVision
KVision은 사용 가능한 UI 컴포넌트로 Kotlin/JS 애플리케이션을 구축하기 위한 객체지향 웹 프레임워크예요. 이 컴포넌트들은 애플리케이션의 사용자 인터페이스를 위한 구성 요소가 될 수 있습니다.
이 프레임워크로 반응형과 명령형 프로그래밍 모델을 모두 사용해 프론트엔드를 구축할 수 있어요. 또한 Ktor, Spring Boot 등 다른 프레임워크용 커넥터를 사용해 백엔드 애플리케이션과 통합할 수 있습니다. 추가로 Kotlin Multiplatform을 사용해 코드를 공유할 수도 있어요.
자세한 내용, 튜토리얼, 예시는 KVision 문서를 확인하세요. 프레임워크에 대한 업데이트와 토론은 Kotlin Slack의 #kvision 및 #javascript 채널에 참여해 보아요.
fritz2
fritz2는 반응형 웹 사용자 인터페이스를 구축하기 위한 독립형 프레임워크예요. HTML 요소를 만들고 렌더링하기 위한 자체적인 타입 안전 DSL을 제공하며, 컴포넌트와 데이터 바인딩을 정의하는 데 Kotlin의 코루틴과 플로우를 사용합니다.
기본적으로 fritz2는 상태 관리, 검증, 라우팅 등을 제공해요. 또한 Kotlin Multiplatform 프로젝트와 통합됩니다.
자세한 내용, 튜토리얼, 예시는 fritz2 문서를 확인하세요. 프레임워크에 대한 업데이트와 토론은 Kotlin Slack의 #fritz2 및 #javascript 채널에 참여해 보아요.
Doodle
Doodle은 Kotlin/JS용 벡터 기반 UI 프레임워크예요. Doodle 애플리케이션은 DOM, CSS, JavaScript에 의존하지 않고 브라우저의 그래픽 기능을 사용해 사용자 인터페이스를 그립니다. 이 접근 방식 덕분에 임의의 UI 요소, 벡터 도형, 그라디언트, 사용자 정의 시각화의 렌더링을 제어할 수 있어요.
자세한 내용, 튜토리얼, 예시는 Doodle 문서를 확인하세요. 프레임워크에 대한 업데이트와 토론은 Kotlin Slack의 #doodle 및 #javascript 채널에 참여해 보아요.