Framework/Flutter
-
본 포스팅부터 모바일 서비스 개발편이 시작됩니다. 진행을 위해 Flutter가 필수적으로 설치되어 있어야 하니 Flutter 설치 글을 먼저 확인해 주세요.모바일 개발편부터는 MacOS를 사용합니다.vscodeFlutter 3.13.94-1. 프로젝트 생성vscode를 실행하고 프로젝트를 생성해 보겠습니다.Command + Shift + P 를 눌러 Next Project를 클릭합니다. Application 선택 후 프로젝트를 생성할 경로를 지정합니다. 프로젝트명을 입력합니다. 이때 프로젝트명은 카멜케이스가 아닌 스네이크 케이스를 사용해야 합니다. 프로젝트가 생성되었습니다. Simulator를 실행하고 Command + Shift + D를 눌러 디버그 실행을 클릭합니다. Simulator는 Xcode 실..
[토이프로젝트]Next.js를 이용해 대출이자계산기 만들어보기 - 4편 : Flutter로 모바일 서비스 개발하기 2024. 5. 1. -
본 포스팅은 스터디를 통해 작성한 글을 복사한 내용입니다. 여기서 더 많은 글들을 확인하실 수 있습니다. 푸쉬 수신은 디바이스의 상태에 따라 설정이 필요합니다. 디바이스 상태는 3가지로 나뉩니다. Foreground : 앱이 실행되어 있고, 화면에 보여지고 있는 상태 Background : 앱이 실행되어 있지만 화면에 보여지지 않는 상태 Terminated : 앱이 종료된 상태 그리고 푸쉬 수신을 위해서는 디바이스 상태와 플랫폼별 설정이 필요합니다. 먼저 Messaging 클래스를 작성합니다. 클래스내 모든 메소드는 static으로 동작하도록 구성했습니다. 1. 파이어베이스 초기화 Firebase와 Local notification 초기화를 담당하는 메소드입니다. 초기화시 등록되는 메소드는 다음과 같습니..
[Flutter]Firebase 클라우드 메세징 사용해보기 - 2편 : 푸쉬 수신 개발 2024. 3. 24. -
본 포스팅은 스터디를 통해 작성한 글을 복사한 내용입니다. 여기서 더 많은 글들을 확인하실 수 있습니다. Android 1. build.gradle(:app) 설정 1-1) SDK 버전 설정 FCM 사용을 위해 최소 버전은 31로 맞춰야합니다. compileSdkVersion과 targetSdkVersion은 33으로 맞춰줍니다. compileSdkVersion 33 defaultConfig { applicationId "com.app.ourchurch" minSdkVersion 31 targetSdkVersion 33 } 1-2) 모듈 추가 dependencies { // Firebase implementation platform('com.google.firebase:firebase-bom:32.7.2..
[Flutter]Firebase 클라우드 메세징 사용해보기 - 1편 : 설치 2024. 3. 24. -
최근 같이 공부하는 스터디팀에서 영어 단어 앱을 만들어 배포했는데요. Next.js로 웹을 구현하고 Flutter의 웹뷰를 이용해 제작/배포한 앱입니다. 영어 단어를 읽어주는 기능을 윈도우 함수 중 speechSynthesis로 구현했는데, 이 함수는 안드로이드 웹뷰에서는 지원되지 않는다고 합니다. iOS에서만 테스트를 하다보니 이런 부분을 체크하지 못한 것 같네요. 기존 코드를 보면 영어 단어 클릭시 아래와 같이 speechSynthesis를 이용해서 음성으로 표시되고 있었습니다. window.speechSynthesis.cancel(); const speechMsg = new SpeechSynthesisUtterance(); speechMsg.rate = 1; speechMsg.pitch = 1.2;..
[ERROR]"Uncaught TypeError: Cannot read property 'cancel' of undefined" 2023. 12. 28. -
최근 iOS 버전을 업데이트(17) 하면서 Xcode 버전도 14에서 15로 업데이트를 하게 됐는데요. 역시나 빌드 과정에서 오류를 만났습니다. The iOS deployment target 'IPHONEOS_DEPLOYMENT_TARGET' is set to 11.0, but the range of supported deployment target versions is 12.0 to 17.0.99. 다행히 깃허브 이슈에 여러 글들이 올라와있어 문제를 쉽게 해결할 수 있었습니다. 1. cocoapod 업데이트 brew upgrade cocoapods 2. pod update cd ios rm -rf Podfile.lock pod install --repo-update 참고문서 When will there..
[Error]DT_TOOLCHAIN_DIR cannot be used to evaluate LIBRARY_SEARCH_PATHS, use TOOLCHAIN_DIR instead 2023. 12. 4. -
Flutter로 앱을 개발할 때, 아이콘을 변경할 수 있는 방법 두 가지를 소개합니다. flutter의 플러그인을 사용하면 간편하게 아이콘을 변경할 수 있지만 상세한 사이즈 조절을 위해서는 네이티브 방식을 이용하는게 더 좋습니다. 아래 순서대로 진행하시면 네이티브 방식으로 편하게 변경하실 수 있을거예요. (플러그인 방식 -> 네이티브 방식) 1. 플러그인 방식 flutter_launcher_icons 플러그인을 설치합니다. flutter pub add flutter_launcher_icons dependencies: flutter: sdk: flutter cupertino_icons: ^1.0.2 flutter_launcher_icons: ^0.13.1 pubsepc.yaml - dependencies ..
[Flutter]아이콘 변경하기 2023. 11. 16. -
테스트 환경 flutter 3.10.5 dart 3.0.5 flutter_local_notifications ^16.1.0 permission_handler ^11.0.1 로컬 푸쉬 기능을 넣기 위해 permission_handler 플러그인을 이용해 권한 설정을 추가하던 중 발생한 에러 내용입니다. 같은 내용으로 플러그인에 이슈가 추가된 것을 확인했습니다. 원인이 한가지는 아닐 수 있지만 저의 경우에는 compileSdkVersion과 targetSdkVersion이 상이해서 발생한 것으로 확인됩니다. compileSdkVersion과 targetSdkVersion을 동일하게 맞추니 해결됐습니다. before : build.gradle(:app) android { compileSdkVersion 33 ..
[ERROR]onRequestPermissionsResult is called without results. This is probably caused by interfering request codes. 2023. 11. 16. -
최근 플러터를 이용해 앱을 개발했는데 광고를 추가하는 과정을 포스팅하려고 합니다. 아마 앱 개발을 해보려고 하시는 분들 중 많은 분들이 광고를 넣을 것이라 예상됩니다. 광고를 넣기 전 앱 배포를 먼저 하시는 것을 추천합니다. ※ 테스트 환경 Flutter 3.10.5 Dart 3.0.5 Android Studio 2022 Xcode 14.3 1. Admob 관리 광고는 Google Admob을 이용합니다. 먼저 Android, iOS 환경에 맞는 광고단위를 생성해야 합니다. 애드몹에 접속해 Android, iOS 앱을 각각 생성합니다. 1-1) Android 앱 생성 앱 배포가 되어 있는 시점이라면 화면과 같이 클릭, 이후 추가 정보를 입력하고 단계를 마무리합니다. 배포되어 있지 않다면 아래와 같이 추가..
[Flutter]Admob 연동하기 2023. 11. 1.