serene - GitLite

KO | EN

gitlite — search

#python #typescript #go #android #machine-learning #deep-learning #docker #nodejs #windows #kubernetes #vue #security #ios #open-source

serene

(★ 321)

An expressive Compose Multiplatform UI library with polished, reusable components for Android, iOS, desktop, and web.

파일 탐색기

최종 버전 다운로드 (.zip)

- - bug_report.md
  - feature_request.md
- - deploy-pages.yml
- - Project_Default.xml
- .gitignore
- .name
- AndroidProjectSystem.xml
- appInsightsSettings.xml
- compiler.xml
- copilot.data.migration.agent.xml
- deploymentTargetDropDown.xml
- deviceManager.xml
- gradle.xml
- kotlinc.xml
- markdown.xml
- migrations.xml
- misc.xml
- planningMode.xml
- runConfigurations.xml
- vcs.xml
- build.gradle.kts
- .gitignore
- build.gradle.kts
- consumer-rules.pro
- proguard-rules.pro
- - gradle-wrapper.jar
  - gradle-wrapper.properties
- libs.versions.toml
- image1.webp
- image2.webp
- build.gradle.kts
.gitignore
build.gradle.kts
CONTRIBUTING.md
gradlew
gradlew.bat
LICENSE
README.md
settings.gradle.kts
wrangler.toml

# 설치 가이드

1. 코드 내려받기

git clone https://github.com/cinkhangin/serene

깃허브에서 프로젝트 코드 전체를 내 컴퓨터로 내려받습니다.

cd serene

방금 내려받은 프로젝트 폴더 안으로 이동합니다.

2. Gradle (Java/Kotlin)

보통 추천

사전 준비물

Git GitHub에서 프로젝트 코드를 내려받으려면 필요합니다.
JDK (Java) Java/Kotlin 프로젝트를 빌드/실행하려면 필요합니다.
Gradle 레포에 포함된 gradlew(Gradle Wrapper)를 쓰면 Gradle을 따로 설치할 필요가 없습니다.

./gradlew :composeApp:compileDebugKotlinAndroid

Gradle로 빌드를 진행합니다.

./gradlew :composeApp:compileKotlinIosSimulatorArm64

Gradle로 빌드를 진행합니다.

./gradlew :composeApp:run

Gradle로 빌드를 진행합니다.

./gradlew :composeApp:wasmJsBrowserDevelopmentRun

Gradle로 빌드를 진행합니다.

./gradlew :composeApp:wasmJsBrowserDistribution

Gradle로 빌드를 진행합니다.

✅ BUILD SUCCESSFUL 메시지가 뜨면 성공입니다. build/ 폴더에 결과물이 생성됩니다.

이 레포의 README에 적힌 실제 명령어를 그대로 가져왔습니다.

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# Serene

**An expressive Compose Multiplatform UI library for Android, iOS, desktop,
and web.**

Serene is a growing collection of polished, reusable components built for real
interfaces. Every component uses shared Compose APIs and is presented in a
responsive documentation experience with live previews, source examples,
installation guidance, and API details.

The visual language pairs practical component design with expressive motion,
shape, color, and interaction—so multiplatform products can feel consistent
without feeling generic.

![Serene component library preview](https://github.com/user-attachments/assets/8f4f522e-3242-4f11-afc7-ea9d4e225ae3)

## Highlights

* Shared Compose components from `commonMain`
* Live component previews and source browsing
* Animated, interactive, and structural component collections
* Responsive showcase for desktop and mobile screens
* Android, iOS, desktop JVM, and WebAssembly targets
* MIT licensed and designed for extension

## Install

After the first Maven Central release, add the library to `commonMain`:

```kotlin
kotlin {
    sourceSets {
        commonMain.dependencies {
            implementation("com.ckgin:serene-ui:0.1.0")
        }
    }
}
```

Components use regular Compose APIs and can be called directly from shared
code:

```kotlin
import com.ckgin.serene.component.acc.TypingText

TypingText(text = "Compose once, use everywhere")
```

## Supported Targets

* Android
* iOS device and simulator
* Desktop JVM
* Web (Wasm)

## Modules

| Module | Purpose |
| --- | --- |
| `:ui` | Publishable KMP/CMP component library and shared resources |
| `:composeApp` | Multiplatform component catalog and platform demos |
| `:core` | Existing Android support module |

Reusable source is under
`ui/src/commonMain/kotlin/com/ckgin/serene/component`. The showcase
consumes `:ui` as a normal project dependency, which keeps the local demo on the
same API that library users receive.

## Run the Documentation Site

```bash
./gradlew :composeApp:compileDebugKotlinAndroid
./gradlew :composeApp:compileKotlinIosSimulatorArm64
./gradlew :composeApp:run
./gradlew :composeApp:wasmJsBrowserDevelopmentRun
```

The web development server is available at `http://localhost:8080`.

## Deploy the Web Showcase

Pushes to `main` deploy the production Wasm build to Cloudflare Pages through
GitHub Actions. Create a Pages project named `serene`, then add these
repository secrets:

* `CLOUDFLARE_ACCOUNT_ID`
* `CLOUDFLARE_API_TOKEN`

The API token needs Cloudflare Pages edit permission. Build locally with:

```bash
./gradlew :composeApp:wasmJsBrowserDistribution
```

The deployable files are generated in
`composeApp/build/dist/wasmJs/productionExecutable`. To deploy them manually:

```bash
npx wrangler pages deploy composeApp/build/dist/wasmJs/productionExecutable --project-name=serene
```

If the Pages project uses another name, update it in `wrangler.toml` and
`.github/workflows/deploy-pages.yml`.

## Publish to Maven Central

The `:ui` module is configured with the Vanniktech Maven Publish plugin and the
coordinates `com.ckgin:serene-ui:0.1.0`.

Before publishing, create a Central Portal account, verify the `com.ckgin`
namespace, and provide these Gradle properties outside the repository:

```properties
mavenCentralUsername=your-token-username
mavenCentralPassword=your-token-password
signingInMemoryKey=your-armored-gpg-private-key
signingInMemoryKeyPassword=your-gpg-password
```

They can also be supplied as `ORG_GRADLE_PROJECT_...` environment variables.
Never commit credentials or signing keys.

Publish with:

```bash
./gradlew :ui:publishToMavenCentral
```

See the [Central Portal registration guide](https://central.sonatype.org/register/central-portal/)
and [publishing plugin guide](https://vanniktech.github.io/gradle-maven-publish-plugin/central/)
for account, namespace, and GPG setup.

## Contributing

Components must be visually polished, useful in real applications, reusable,
accessible, responsive, and compatible with every supported target. Read
[CONTRIBUTING.md](CONTRIBUTING.md) before opening a pull request.

## License

Serene is available under the [MIT License](LICENSE).