Cardboard.js: 더 간단하고 직관적인 웹 프레임워크 구축
카테고리
프로그래밍/소프트웨어 개발
서브카테고리
웹 개발
대상자
- 웹 애플리케이션 개발자 (JavaScript/TypeScript 사용자)
- 프레임워크 사용자 (리액티브 프로그래밍 경험자)
- 난이도: 중간 (기존 프레임워크 사용자에게 유용)
핵심 요약
attach→mountPoint등 핵심 API 이름 변경으로 직관성 향상- Computed Observables 도입: 기존 값에서 새로운 반응형 값을 파생
- Lifecycle 이벤트 이름 변경 (
start→mounted)로 표준화
섹션별 세부 요약
1. API 이름 변경
attach,detach등의 기존 용어를mountPoint,restoreMountPoint등으로 대체- 예시:
```javascript
// 이전
attach(div1);
p.attach('Child of div1');
// 이후
mountPoint(div1);
p.mount('Child of div1');
```
- 코드 가독성 및 직관성 향상
2. Observables 도입
- 기존 Consumables 개념을 Observables로 명명 변경
- 반응형 객체가 값 변경 시 리스너에 알림 기능 유지
3. Computed Observables
- 기존 값에서 새로운 반응형 값을 파생하는 기능 추가
- 예시:
```javascript
const count = createObservable(10);
const isAbove18 = compute(count, (newVal) => newVal >= 18);
```
greaterThan,isEmpty등 Helper 메서드를Observables에 직접 추가
4. Lifecycle 이벤트 이름 변경
start→mounted,removed→unmounted등으로 표준화- 개발자에게 익숙한 용어 사용으로 학습 곡선 완화
결론
- 2023년 말까지 첫 정식 버전 출시 목표
- GitHub 리포지토리에서 기여 및 피드백 요청:
https://github.com/cardboardjs - 직관적인 API 명명과 반응형 프로그래밍 기능을 통해 웹 개발 생산성 향상