# Flitter - Flutter와 비슷한 문법의 웹용 데이터 시각화 라이브러리

> Clean Markdown view of GeekNews topic #15693. Use the original source for factual precision when an external source URL is present.

## Metadata

- GeekNews HTML: [https://news.hada.io/topic?id=15693](https://news.hada.io/topic?id=15693)
- GeekNews Markdown: [https://news.hada.io/topic/15693.md](https://news.hada.io/topic/15693.md)
- Type: news
- Author: [xguru](https://news.hada.io/@xguru)
- Published: 2024-07-05T10:15:01+09:00
- Updated: 2024-07-05T10:15:01+09:00
- Original source: [flitter.pages.dev](https://flitter.pages.dev/)
- Points: 18
- Comments: 10

## Summary

Flitter는 Flutter의 구문과 선언적 프로그래밍 방식을 활용하여 웹에서도 고성능 그래픽과 UI를 구현할 수 있게 해줍니다. 복잡한 데이터 시각화와 대화형 차트를 쉽게 구현할 수 있으며, React와 Svelte 등과 심리스하게 연동됩니다. 또한, 렌더 객체 트리와 최적화된 렌더링을 통해 효율적인 애플리케이션 상태 관리와 코드 재사용성을 제공합니다. 국내 개발자께서 작성하신 오픈소스네요. 응원합니다!

## Topic Body

- Flutter의 구문과 선언적 프로그래밍 방식을 활용하여 웹에서도 고성능 그래픽과 UI를 구현  
  - 모바일 개발자가 쉽게 웹 환경에 적응 가능   
- 웹 앱에서 복잡한 데이터 시각화, 대화형 차트, 다이어그램 및 그래픽 편집기를 쉽게 구현할 수 있도록 설계  
- 컴포넌트 기반 접근 방식을 통해 코드 재사용성을 높임  
- React, Svelte 등에 심리스하게 연동   
  
#### 주요 특징  
  
- **렌더 객체 트리**: 효율적인 렌더링을 위해 렌더 객체 트리를 사용하여 복잡한 레이아웃을 쉽게 관리하고 조작할 수 있음  
- **선언적 프로그래밍**: 선언적 패러다임을 따라 값이 변경되면 화면이 자동으로 업데이트되어 애플리케이션 상태 관리가 단순해짐  
- **최적화된 렌더링**: 렌더러 파이프라인에서 재렌더링, 페인팅, 레이아웃 재계산을 관리하고 필요한 부분만 업데이트하도록 최적화함  
- **Box 모델 레이아웃**: 사용자가 익숙한 Box 모델을 사용하여 레이아웃을 쉽게 구성할 수 있음  
- **SVG와 Canvas 지원**: SVG와 Canvas를 모두 지원하여 다양한 그래픽 요구사항을 충족함. 개발자는 필요에 따라 적절한 렌더러를 선택할 수 있음  
- **다양한 응용 분야**: 차트, 다이어그램, 데이터 시각화, 그래픽 에디터 등 다양한 분야에서 활용 가능함

## Comments



### Comment 27089

- Author: brownsoo
- Created: 2024-07-09T07:33:39+09:00
- Points: 1

멋집니다~~

### Comment 27059

- Author: ansony0227
- Created: 2024-07-08T11:01:52+09:00
- Points: 1

방화벽으로 프록시 서버 통해서 접근하면 소스하단 결과가 표시가 안됩니다. 모바일에서는 잘 됩니다.

### Comment 27020

- Author: anseotmd555
- Created: 2024-07-06T14:54:11+09:00
- Points: 2

제작자입니다. 관심 가져주셔서 압도적으로 감사 ㅠ_ㅠ   
  
도메인도 샀어요 flitter.pages.dev -> flitter.dev ㅎㅎ

### Comment 26987

- Author: alstjr7375
- Created: 2024-07-05T14:25:45+09:00
- Points: 1

예전에 한번 보고 스타찍어놨었는데 문서화가 더 좋아졌네요.

### Comment 27021

- Author: anseotmd555
- Created: 2024-07-06T15:07:17+09:00
- Points: 2
- Parent comment: 26987
- Depth: 1

ㅎㅎ 감사합니다. 문서는 계속 개편하고 있습니다. 지금은 튜토리얼 대대적으로 업데이트 중입니다!

### Comment 27037

- Author: alstjr7375
- Created: 2024-07-07T13:10:12+09:00
- Points: 1
- Parent comment: 27021
- Depth: 2

SVG와 Canvas 타겟인 점이 기존 주류 프레임워크들과 겹치지 않는 것 같아서 좋아보여요!!  
홧팅 잘되기를 바랍니다.

### Comment 26984

- Author: [deleted]
- Created: 2024-07-05T13:49:50+09:00
- Points: 1

[삭제된 댓글입니다]

### Comment 27022

- Author: anseotmd555
- Created: 2024-07-06T15:07:40+09:00
- Points: 1
- Parent comment: 26984
- Depth: 1

누가 remix 페이지 이쁘다고 추천해서 저도 차용했습니다 ㅎㅎ

### Comment 26982

- Author: bbulbum
- Created: 2024-07-05T12:08:40+09:00
- Points: 1

랜딩페이지 텐션이 장난 아니네요...

### Comment 27023

- Author: anseotmd555
- Created: 2024-07-06T15:07:49+09:00
- Points: 1
- Parent comment: 26982
- Depth: 1

감사합니다 ㅎㅎ