@imcat-ckim/catui

v1.1.1

Published

11 days ago

Lightweight, zero-build, ES6+ JavaScript web framework with dynamic module loading and integrated SPA routing

0High
0Medium
0Low

imcat-ckim

framework spa zero-build lightweight es6 dynamic-loading xss-protection

IMCAT UI

Lightweight, Zero-Build, ES6+ JavaScript Web Framework

⚡ 특징

제로 빌드 - NPM, Webpack 불필요
경량 - 코어 < 15KB (gzipped)
동적 모듈 로딩 - 필요한 것만 로드
SPA 라우팅 - 내장 라우터
보안 우선 - XSS 자동 방어
순수 ES6+ - TypeScript 불필요

📦 설치

CDN (unpkg)

<link rel="stylesheet" href="https://unpkg.com/@imcat-ckim/[email protected]/dist/imcat-ui.css">
<script src="https://unpkg.com/@imcat-ckim/[email protected]/dist/imcat-ui.js"></script>

CDN (jsDelivr)

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@imcat-ckim/[email protected]/dist/imcat-ui.css">
<script src="https://cdn.jsdelivr.net/npm/@imcat-ckim/[email protected]/dist/imcat-ui.js"></script>

NPM

npm install @imcat-ckim/catui

🚀 빠른 시작

<!DOCTYPE html>
<html lang="ko">
<head>
  <meta charset="UTF-8">
  <title>IMCAT UI</title>
  <link rel="stylesheet" href="./dist/imcat-ui.css">
</head>
<body>
  <div id="app">
    <button id="btn">Click Me</button>
  </div>

  <script type="module">
    import IMCAT from './dist/imcat-ui.js';
    
    // DOM 조작
    IMCAT('#btn').on('click', () => {
      alert('Hello IMCAT UI!');
    });
    
    // 모듈 사용
    const modal = await IMCAT.use('modal');
    modal.show('Welcome', 'IMCAT UI Framework');
  </script>
</body>
</html>

🛠️ 개발

환경 설정

npm install

개발 서버

npm run dev
npm run serve

빌드

npm run build

테스트

npm test
npm run test:coverage

린트

npm run lint
npm run lint:fix

📁 프로젝트 구조

imcat-ui/
├── docs/           # 문서
├── src/            # 소스 코드
│   ├── core/       # 코어 모듈
│   ├── modules/    # 확장 모듈
│   └── styles/     # SCSS
├── dist/           # 빌드 결과
├── tests/          # 테스트
└── examples/       # 예제

🤝 기여

기여를 환영합니다! CONTRIBUTING.md를 참조하세요.

📄 라이센스

MIT License - 자유롭게 사용, 수정, 배포 가능

🔗 링크

Issues: GitHub Issues
Discussions: GitHub Discussions

IMCAT UI - Build faster, lighter, safer web applications ⚡