반응형 개발/Flutter20 Flutter Web - Chrome에서 개발하기 Flutter로 모바일 앱 개발을 할 때 정말 좋은 점은 바로 Hot reload 기능이 아닌가 싶다. UI를 변경했을 때 앱이 재실행되지 않고 바로바로 반영이 되어 개발속도가 확연히 다르다. 그러나, Flutter Web 에서는 Hot reload가 안되는 듯 하다. ㅠ_ㅠ 대신 Hot restart를 지원한다. Hot restart? Hot restart는 현재 앱의 상태를 유지하지 않고, 재시작해서 초기 화면으로 돌아간다. 즉, 어떤 화면을 작업중이라면 다시 들어가서 확인해야 되는 것. 그래도 build를 다시 하는 것 보단 나으니까.. 그럼 Hot restart는 어떻게 하는 것일까? 먼저, 자신의 프로젝트를 켜고 아래 커맨드를 입력하자. flutter run -d chrome 그럼 위와 같은 로.. 2023. 1. 14. Flutter Web - Firebase Hosting에 배포해보자! 2. Flutter WebApp 배포 지난 포스팅에서 Firebase Hosting 배포를 위한 프로젝트와 CLI 설정을 마쳤다. 이를 기반으로 Flutter 프로젝트를 Firebase Hosting에 배포해보자. 1. Flutter 프로젝트 생성 본인이 사용하는 운영체제와 IDE를 사용해서 Flutter 프로젝트를 생성한다. 지금은 Firebase Hosting에 배포하는 것이 목적이므로 기본으로 생성되는 프로젝트로 충분하다. 적당히 프로젝트 이름과 설명을 작성한다. 플랫폼은 이 포스팅에선 Web만 선택해도 충분하다. 다른 플랫폼이 필요하면 추가하면 되기도 하고. 2. Flutter 프로젝트에 Firebase 설정 Flutter 프로젝트와 Firebase를 연동하기 위해선 간단한 설정이 필요하다. Firebase 프로젝트 콘솔로 이동하여 .. 2023. 1. 8. Flutter Web - Firebase Hosting에 배포해보자! 1. Firebase 설정 Flutter가 Web을 지원하기 시작한지도 꽤 되었다. 최근 여러모로 Web이 있으면 유용할 것 같아서 이것저것 알아보고 있었는데, 모바일 개발자로써 React 같은 웹 프레임워크를 배우는 것은 좀 그랬다. 언어부터 시작해서 익숙치 않다보니..? 하지만 Flutter라면 얘기가 다르지. Flutter 3.0이 배포된 이후로 회사에서도 관심도가 높아졌고, Google의 Fuchsia도 수면위에 올라오기도 하고, Flutter의 장점들 때문에 찾는 기업도 많아지고 있다. 그래서 기술적 트렌드를 따라가기 위해 나도 관심이 꽤 가고 있는 상태. 이 상태라면 Flutter도 익숙해질 겸, Web 개발 해보자! 가 된 상태. 아무튼 그래서, Flutter로 개발한 Web을 Firebase Hosting에 올려보기.. 2023. 1. 8. Flutter 라우팅 패키지 - go_router go_router? Flutter 공식 유튜브의 Package of the Week에서, Flutter 라우팅 패키지인 go_router가 소개되었다. Flutter 공식 유튜브의 Package of the Week에서, Flutter 라우팅 패키지인 go_router가 소개되었다. go_router는 URL 기반의 API를 사용하여 화면들을 편리하게 탐색할 수 있는 선언적 라우팅 패키지이며, URL을 사용하여 네비게이션과 딥링크와 같은 네비게이션 관련 처리를 할 수 있다고 소개하고 있다. 제공하고 있는 기능으로는 다음과 같다. "user/:id" 와 같은 구문으로 경로와 쿼리 매개변수 분석 목적 경로에 대해 여러 화면 표시 Redirection을 지원한다. 앱의 상태에 따라 사용자를 다른 URL로 다시.. 2023. 1. 1. 이전 1 2 3 4 5 다음