![]()
0️⃣ WebView?어플리케이션을 쓰다보면 앱 내에서 웹페이지가 동작 할 때가 있다. 예를 들어, 네이버나 유튜브 화면을 띄울 필요가 있을 때 말이다. Flutter 내부에서도 그렇게 웹 페이지를 띄울 수가 있는데, 이때 사용하는 라이브러리가 바로 webview_flutter 이다.https://pub.dev/packages/webview_flutter webview_flutter | Flutter packageA Flutter plugin that provides a WebView widget on Android and iOS.pub.dev 1️⃣ webview_flutter 설치 $flutter pub add webview_flutter명령어를 통해 webview_flu..
![]()
⛔ 문제사항 맥북을 새로 구매하며 M3로 업그레이드 하고, Flutter를 처음부터 다시 세팅 해주는 중에 새로운 문제가 발생했다. Downloaded executables cannot execute on host. 라는 에러였는데, 친절하게도 아래 명령어를 입력하면 해결 가능하다고도 나와있다. ✅ 해결방안 $sudo softwareupdate --install-rosetta --agree-to-license 이 명령어를 통해 손쉽게 해결가능하다. 다만, 나 같은 경우엔 지속적으로 sudo: softwareupdate: command not found 이런 식으로 명령어를 찾을 수 없다고 나왔었는데 띄어쓰기를 잘 못 한 것으로 파악된다. 띄어쓰기만 신경 써서 명령어를 그대로 ctrl c+v 한 뒤, 다시..
![]()
⛔ 문제사항 VSC에서 Android Studio로 바꾸어 빌드하려고 보니 main.dart를 빌드할 수 없다고 나와있었고, Android Studio 의 Settings > Languages & Frameworks > Dart 에서 보면 아래와 같은 오류 문구가 있었다. ✅ 해결방안 문제는 바로 내 Dart SDK path가 지정되어 있지 않아서인데, 이를 지정해주면 된다. flutter 다운로드 경로/flutter/bin/cache/dart-sdk 를 경로로 지정해주고 아래 체크박스를 클릭하면 해결 완료다. ❗출처 참고 사이트 : https://masswhale.tistory.com/54 안드로이드 스튜디오에서 Dart SDK is not configured 메세지가 나타날때. 안드로이드 스튜디오에서..
![]()
0️⃣ State, 상태란? State, 상태는 사실상 개발을 하다 보면 필연적으로 마주하게 되는 단어이다. 그렇다면 상태는 대체 무엇일까? 앱의 정보 또는 데이터 를 통칭하여 상태라고 이야기한다. 따라서 유저가 어플리케이션을 사용하며 동작하는 모든 데이터, 예를 들어 로그인 할 때 Input 값에 입력하는 아이디와 비밀번호부터 라이트/다크 모드를 선택하는 등의 단순히 화면을 바꿔주는 값 등등 모든 데이터를 상태라고 부른다. 공식문서에서는 아래와 같이 명명하고 있다. 1. 위젯이 빌드될 때 동기적으로 읽을 수 있는 정보 2. 위젯의 생명주기가 끝나기 전까지 변경될 수 있는 정보 그렇다면, Flutter에서 State를 사용할 수 있는 방법은 무엇이 있을까? 그러기 위해서는 Stateless Widget과..
![]()
⛔ 문제사항 컴퓨터 고장으로 Mac intel칩에서 Mac M2로 바꾸면서 세팅을 새로 해주게 되었다. Flutter의 모든 세팅을 마치고 VSCode도 새로 깔아 실행하려고 보니 웬걸, 기존 방식대로 실행을 할 수가 없다. ✅ 해결방안 1. launch.json 파일 생성 VSCode 자체에서 잘 알려주고 있는데, 빨간색으로 표시된 create a launch.json file을 클릭하면 알아서 launch.json 파일을 만들어준다. 또는 .vscode 폴더 내에 직접 launch.json 파일을 만들어주어도 된다. 나는 위 1번 방법으로 생성했고 아래와 같이 기본적으로 내용이 기재되어있다. 2. configurations에 값 넣기 { "name": "Current Device", "request"..
1️⃣ 앱서명 // (배포를 위한 jks키 생성) $keytool -genkey -v -keystore ~/key.jks -keyalg RSA -keysize 2048 -validity 10000 -alias key 배포하기 위해서는 어플리케이션 서명을 해야한다. jks 확장자 파일의 key를 생성해서 서명을 하면 작동한다. 2️⃣ keystore 참조 keyAlias=key keyPassword= storeFile=./key.jks storePassword= 생성한 key 파일을 android/app/ 폴더에 위치시킨 뒤, android/app 폴더에서 key.properties 파일을 생성하고 위에 같이 작성한다. 3️⃣ Gradle 서명 구성 // start of Gradle 서명 구성 def ke..
![]()
⛔ 문제사항 XCode에 들어가서 빌드 하려고 보니 아래와 같은 에러가 발생했다. DT_TOOLCHAIN_DIR cannot be used to evaluate LIBRARY_SEARCH_PATHS, use TOOLCHAIN_DIR instead 이는 CocoaPods의 버전 이슈 문제로 간단하게 CocoaPods를 업데이트 하면 해결된다. ✅ 해결방안 1. CocoaPods 업데이트 gem install cocoapods --pre 이 명령어를 통해 CocoaPods를 업데이트하면 되는데, 나는 이 또한 쉽게 되지 않고 아래처럼 Ruby 권한 문제가 새로 발생했다. You don't have write permissions for the /Library/Ruby/Gems/2.6.0 directory. ..
![]()
⛔ 문제사항 오랜만에 애플 스토어에 출시해둔 어플리케이션을 업데이트 하려고 아카이브 한 빌드를 제출하니, 이런 이메일이 돌아왔다. 충격 그 자체. 현재 사용하고 있는 iOS SDK가 맞지 않다는 메일이었다. 요약하자면, 2024년 4월 29일부터 iOS SDK 16.4 버전에서 build 되어야한다는 내용이었다. 내가 사용하고 있던 Xcode는 14 버전이었고 macOS는 Sonoma 14.1 버전이었다. Sonoma 14.1 버전에서는 Xcode 15 버전을 지원하지 않기 때문에 macOS자체를 업데이트 해야하는 상황이므로 쉽게 해결 가능한 부분이었다. ✅ 해결방안 1. macOS 업데이트 우선 시스템 환경 설정에 들어가서 macOS를 업데이트 한다. 이 과정만 3~40분 소요될 수 있으니 여유로울 때..
![]()
⛔ 문제사항 어느날 갑자기 Unable to boot the simulator 이라는 문구와 함께 iOS 시뮬레이터가 실행되지 않는 일이 발생한다. 이 일을 종종 겪을 정도로 생각보다 자주 일어나는 현상 같다. Xcode 자체에서 실행하면 시뮬레이터가 켜지지만 그 외의 다른 IDE로 키면 안 되는 것처럼 보인다. ✅ 해결방안 이 Mac에 관하여 > 저장공간 > 개발자 탭으로 들어가서 Xcode와 관련된 빌드 데이터와 캐시를 삭제 해주면 된다. 이렇게 깔끔한 상태로 만들어주고 나는 Xcode 내에서 Clean Build Folder도 한 번 해주었다. 그래도 되지 않는다면 Xcode 내에서 실행해서 시뮬레이터를 켜주면 된다.
![]()
Flutter에서 기본적으로 상태를 관리하는 방법은 Stateful Widget 내에서 관리하는 것이다. 하지만 화면이 복잡하고 프로젝트의 규모가 커질 수록 부모 위젯에서 자식 위젯간으로 상태를 전달하는 방법 만으로는 제한적일 때가 자주 일어나고 Stateful Widget은 상태가 바뀔 때마다 화면을 재렌더링 하면서 불필요한 Widget까지 렌더링 하며 성능을 떨어뜨릴 수 있다. 때문에 보통은 상태를 관리해주는 라이브러리를 이용하게 되는데 (Flutter가 아닌 다른 언어에서조차) 이 중에서 GetX를 사용하게 되었다. 처음 Flutter를 접할 때에는 라이브러리 없이 상태관리를 했었으나 추후에는 React Native에서 사용하던 context api와 유사하다고 판단한 provider를 이용했었으며..
IconButton의 기본적인 기능은 생략하고 내가 기억해야할 것들을 기록한다. 주기적으로 추가될 수 있음! 1️⃣ IconButton default padding 없애기 @override Widget build(BuildContext context){ return IconButton( onPressed: (){}, padding: EdgeInsets.zero, constraints: const BoxConstraints(), icon: const Icon(Icons.close) ); } padding을 zero로 모두 초기화하고, BoxConstraints를 통해 아이콘 크기에 맞추어 준다. 2️⃣ IconButton ripple effect IconButton을 눌렀을 때 물방울이 퍼지는 듯한 효과가..
앱을 만들다 보면 반드시 시뮬레이터가 아닌 실물기기로 테스트 해봐야할 때가 온다. usb로 꽂아 연결하면 쉽게 실물기기에 빌드할 수 있지만 무선 디버깅이 필요한 순간도 있다. 1️⃣ 무선 디버깅 설정하기 무선 디버깅할 안드로이드 실물기기를 설정 해줘야 한다. 💡 설정 > 개발자 옵션 > 무선 디버깅 > IP 주소 개발자 옵션 탭이 없다면, 설정의 휴대전화 정보 탭에서 빌드번호를 마구마구 눌러줘야한다. 이스터에그와 같은 장치요소다. 2️⃣ 터미널에 명령어 입력하기 개발자 옵션에서 볼 수 있는 IP주소를 터미널에 그대로 입력하면 무선으로 기기를 연결 할 수 있다. $export PATH=$PATH:~/Library/Android/sdk/platform-tools $adb connect 192.168.0.XX..
