데브허브 | DEVHUB | Leptos in Rust: Build Web Apps | CSR vs SSR | Leptos vs Dioxus | Full BreakdownLeptos in Rust: Build Web Apps | CSR vs SSR | Leptos vs Dioxus | Full Breakdown
- Leptos는 Rust 기반의 현대적인 풀스택 웹 프레임워크로, 반응형 웹 애플리케이션 구축에 중점을 둡니다. 🚀
- '인터랙티브'는 사용자 입력(클릭, 타이핑)에 따른 UI 상호작용 및 상태 업데이트를 의미하며, '반응형'은 상태 변화에 따라 UI가 자동으로 업데이트되는 것을 말합니다. 🔄
- CSR(클라이언트 측 렌더링)은 브라우저가 HTML+JS를 받아 데이터를 가져와 UI를 렌더링하며, SSR(서버 측 렌더링)은 서버가 데이터를 가져와 완전히 렌더링된 HTML을 반환합니다. 🌐
- CSR은 대시보드처럼 상호작용이 많은 앱에 적합하고, SSR은 초기 로딩 속도와 SEO가 중요한 홈페이지나 블로그에 유리하며, Leptos는 두 가지 렌더링 방식을 모두 지원합니다. 💡
- Leptos 앱 개발 시
trunk CLI를 사용하여 Rust 코드를 WebAssembly로 컴파일하고, index.html을 통해 웹 애플리케이션을 제공합니다. 🛠️
- Leptos는 React와 유사한 JSX 스타일의 문법을 사용하여 UI를 구성하며, Dioxus와 달리 공식 CLI나 프로젝트 템플릿이 없어 초기 설정은 수동으로 진행해야 합니다. ✍️
trunk serve 명령을 통해 개발 서버를 실행하면 Rust 코드가 WebAssembly로 컴파일되고, HTML, CSS, JS와 함께 dist 디렉토리에 배포되어 브라우저에서 로드됩니다. 📦
- Leptos는 주로 웹 플랫폼에 초점을 맞추는 반면, Dioxus는 웹뿐만 아니라 데스크톱, 모바일 등 다양한 크로스 플랫폼 개발을 지원하며 더 나은 개발자 경험을 위한 CLI를 제공합니다. 💻
- Leptos는
create_signal과 같은 기능을 통해 상태를 관리하고 UI를 반응적으로 업데이트하는 방식을 사용합니다. ✨