심볼 소개

Source: Dev.to

Overview

Symbols를 소개합니다 – HTML, CSS, 상태, 이벤트, DOM, 그리고 디자인 시스템을 간단하고 직관적인 JSON‑유사 구문으로 구성하는 인터페이스 프레임워크입니다. AI 친화적이며 Figma, Sketch, React, Vue 등 다양한 도구에서 디자인‑개발자 경험을 통합하도록 설계되었으며, 복잡한 디자인 시스템과 재사용성을 지원합니다.

Features

• 초보자와 AI가 이해하기 쉬운 선언형 구문으로 10배 빠르게 복잡한 화면을 만들고 재사용할 수 있습니다.
• 짧고 간결한 코드로 코드베이스와 AI 리소스가 과부하되지 않게 합니다.
• 협업, IntelliSense, 오류 처리, AI 지원, 디자이너 친화적인 환경을 갖춘 캔버스 및 고급 코드‑유사 무코드 편집기.
• TV, 인쇄물, 벡터 기반 도구 등 다양한 디바이스에 앱을 배포할 수 있는 유연하고 고급스러운 디자인 시스템 지원.

Components

• 3,000+ 내장 컴포넌트를 드래그‑앤‑드롭으로 바로 사용할 수 있습니다.
• 조직 전체에서 완전 재사용 가능해, 크로스‑프로덕트 앱 개발을 간소화합니다.

Editor

내장 편집기가 제공하는 기능:

• 실시간 협업.
• IntelliSense 및 오류 처리.
• 코드 제안을 위한 AI 통합.
• 코드 작업과 같은 느낌이면서도 오버헤드가 없는 디자이너 중심 워크플로우.

Design System

• JavaScript 기반 통합 디자인 시스템 편집기.
• 선호하는 디자인 도구로 내보낼 수 있어 프레임워크 기능을 완전히 제어할 수 있습니다.

Getting Started

• 대기자 명단에 가입:
• 개발자 프리뷰: