LogoCoUI

시작하기

CoUI 설치 및 설정 가이드

시작하기#

사전 준비#

  • Flutter: 3.41.0 이상
  • Dart: 3.11.0 이상
  • Jaspr (Web): 0.22.3 이상

설치#

Flutter 프로젝트#

flutter pub add coui_flutter

또는 pubspec.yaml에 직접 추가:

dependencies:
  coui_flutter: ^0.0.1

Jaspr Web 프로젝트#

dart pub add coui_web

또는 pubspec.yaml에 직접 추가:

dependencies:
  coui_web: ^0.0.1

기본 설정#

Flutter#

import 'package:coui_flutter/coui_flutter.dart';

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        extensions: [
          ComponentThemeData(),
        ],
      ),
      home: MyHomePage(),
    );
  }
}

Jaspr Web#

import 'package:coui_web/coui_web.dart';

// 컴포넌트를 직접 사용
div([
  Button(
    onClick: () => print('Hello'),
    child: text('Click me'),
  ),
])

첫 번째 컴포넌트#

Button#

Button(
  variant: ButtonVariant.primary,
  size: ButtonSize.md,
  onPressed: () => print('Pressed'),
  child: Text('Primary Button'),
)

Button(
  style: [Button.primary, Button.md],
  onClick: () => print('Clicked'),
  child: text('Primary Button'),
)

Input#

Input(
  placeholder: 'Enter text...',
  onChanged: (value) => print(value),
)

Input(
  placeholder: 'Enter text...',
  onChanged: (value) => print(value),
)

다음 단계#