프로그래밍 잡동사니

보호되어 있는 글입니다.

JavaScript 개발자와 Dart 찍먹하기를 먼저 읽고 와 주시면 더욱 좋습니다. 안녕하세요! 지난번 글에 이어 이번에는 React 개발자와 Flutter 찍먹하기로 돌아왔습니다 본의 아니게 시리즈처럼 되어버렸는데.. 다음 주제는 아직 생각한 것이 없네요 😅 이번 글도 Flutter에 흥미가 있는 개발자, 거기에 React 사용 경험까지 있다면 더 재미있게 읽으실 것 같아요! 물론 React에 대한 지식이 없더라도 이해 불가능한 수준은 아닙니다 그럼 거두절미하고 Flutter 찍먹, 시작해보겠습니다! Flutter 구글에서 개발한 Flutter 프레임워크는 Dart 언어를 사용하며, 하나의 코드베이스로 다양한 플랫폼에서 동작하는 오픈소스 프레임워크입니다! 처음에는 Android와 iOS 정도만 지원하..

보호되어 있는 글입니다.

보호되어 있는 글입니다.

Flutter web app을 빌드하고 Netlify에 간단하게 배포만 해보자 빌드만 성공하면 어디에 배포하던 상관없지만 개인적으로 Netlify가 가장 편한 것 같다 * 공식문서에서 권장하는 방법은 Firebase Hosting / Github Pages / Google Cloud Hosting 두 가지만 조심하면 되는데, 우선 CORS (교차 출처) 이미지 렌더링 관련 설정이다 크롬에서 Renderer를 canvaskit이 아닌 html을 사용했다면 빌드도 html로 해줘야 한다 flutter build web --web-renderer html --release 위 명령어로 web app을 빌드해준다 다음으로 build/web 경로에 생성된 index.html 파일 base 태그의 href 경로를 ..

Windows 운영체제에서 Flutter로 Android 시뮬레이터를 실행하기 위한 사전 작업이다 공식문서를 따라가면 되지만 생각보다 까다로워 문제가 생길 수 있는 부분들을 정리해 보았다 Android setup🔽 Windows install How to install on Windows. docs.flutter.dev Android Studio 설치하기 Android Studio 최신 버전 다운로드 Android Studio > Android Studio Setup Wizard 실행 (Flutter에 필요한 Android SDK 설치) flutter doctor 체크 > 설치 문제 시 flutter config --android-studio-dir 경로 설정 Unable to find bundled J..

AppBar AppBar · joseph-106/toonflix@1293249 Showing 1 changed file with 15 additions and 1 deletion. github.com 선언한 위젯은 key를 가져야 하며, ID와 같은 식별자 역할 AppBar 위젯은 다양한 옵션을 가지며 서비스의 헤더 역할 Data Fetching Data Fetching · joseph-106/toonflix@3855976 Show file tree Showing 4 changed files with 42 additions and 3 deletions. github.com pub.dev에서 Dart, Flutter 관련 공식 패키지 다운로드 가능 (npm, PyPI랑 비슷) HTTP 요청을 편하게 해주는..

User Interface User Interface · joseph-106/toonflix@4b609bb Show file tree Showing 2 changed files with 88 additions and 36 deletions. github.com Scaffold를 screens 폴더의 하나의 파일로 분리 (context로 상위 테마 접근) Flexible은 flex 값을 기반으로 상위 UI를 나눠 child UI들을 비율에 맞게 배치 Row로 감싸고 Expanded로 확장시키면 Container를 가로 전체로 늘리기 가능 Timer Timer · joseph-106/toonflix@f437306 Showing 1 changed file with 23 additions and 4 deleti..

State State · joseph-106/toonflix@463dee8 Showing 1 changed file with 34 additions and 2 deletions. github.com StatelessWidget은 단지 build 메서드를 통해 정적인 UI를 출력하는 역할 StatefulWidget은 위젯에 데이터를 저장하고 변화를 UI에 실시간 반영 App의 State를 반환하는 createState 함수를 override하며, State 내에서 UI 구축 App의 State를 상속받은 클래스의 필드 값으로 동적인 데이터 관리 (final 제거) 데이터는 String Interpolation으로 문자열에 넣거나 함수의 매개변수 등으로 활용 IconButton 위젯으로 데이터를 변경하는 함..

Header Header · joseph-106/toonflix@1eb21c2 Showing 1 changed file with 37 additions and 5 deletions. github.com ? 기호가 붙은 Optional Widget들은 경우에 따라 포함 여부 판단 Colors의 옵션으로 자동 완성되는 material design의 Colors.색상.색조 사용 가능 커스텀 색상을 넣고 싶다면 Color(0xFF[HEX 값]) or Color.fromARGB(+ RGBO) 단순히 size가 있는 박스를 만드는 SizedBox Widget (width / height / child) Row(수평) / Column (수직) 방향으로 children 배열을 사용해 Widget 쌓기 가능 그 안에서 ..