Flutter 면접에서 가장 기본적이지만 중요한 개념 중 하나가 클래스 기반 위젯(StatefulWidget, StatelessWidget) vs 함수형 위젯(Function Widget) 입니다.면접관이 다음과 같은 질문을 던진다면 어떻게 대답해야 할까요?"왜 클래스 기반 위젯을 함수형 위젯 대신 사용하는 것이 좋은가?"이 질문은 Flutter의 context, const, 성능 최적화, 위젯 라이프사이클 등 중요한 개념들을 이해하고 있는지를 테스트하기 위한 것입니다.1️⃣ 클래스 기반 위젯이 더 좋은 이유1. context 유지 가능클래스 기반 위젯에서는 context가 위젯 인스턴스에 포함되어 있어, 위젯이 재생성되더라도 context를 유지할 수 있습니다.반면, 함수형 위젯은 context가 함수..

1. 문제 상황Flutter에서 Column 위젯을 사용할 때, 맨 위에 여백을 추가하면서도 각 요소 간 간격을 유지하고 싶을 때가 있다.보통 SizedBox(height: 18.h)를 사용하여 간격을 조절하지만, 맨 처음 요소의 위쪽에도 동일한 여백을 적용하려면 별도의 빈 위젯이 필요하다.이때 **SizedBox.shrink()**를 사용하면 불필요한 공간을 차지하지 않으면서도 유동적으로 빈 공간을 추가할 수 있다.2. SizedBox.shrink()란?SizedBox.shrink()는 공간을 차지하지 않는 빈 위젯을 제공하는 SizedBox의 한 형태이다.기본적으로 SizedBox()는 특정 width 또는 height 값을 설정하여 빈 공간을 추가할 때 사용되지만,SizedBox.shrink()는 ..

Flutter 앱에서 날짜와 시간을 선택할 때, 과거 날짜나 현재 시간보다 이전 시간을 제한해야 하는 경우가 종종 있습니다. 이번 블로그에서는 **Flutter의 CupertinoDatePicker**와 유효성 검사 로직을 활용해 이러한 요구사항을 처리하는 방법을 소개합니다. 요구사항과거 날짜는 선택할 수 없다.사용자가 현재 날짜 이전의 날짜를 선택하려고 하면 이를 제한해야 합니다.현재 시간 및 과거 시간은 선택할 수 없다.동일한 날짜일 경우, 현재 시간보다 이전 시간을 선택하면 제한하도록 설정합니다.오늘 날짜와 현재 시간 이후는 선택 가능해야 한다.오늘 날짜인 경우, 현재 시점에서 몇 분 뒤의 시간까지 정상적으로 선택되도록 구현해야 합니다.제한 위반 시 사용자 알림 제공.잘못된 선택을 시도할 경우 사용..

1. Xcode 다른 버전 설치하기Apple Developer 웹사이트에서 필요한 버전의 Xcode를 다운로드합니다.다운로드한 .xip 파일을 더블 클릭하여 압축을 해제합니다.압축 해제된 Xcode 파일을 응용 프로그램 폴더에 복사합니다.예: /Applications/Xcode15.4.app2. 터미널에서 다른 버전의 Xcode 실행하기터미널을 열고 아래 명령어를 입력합니다/Applications/Xcode15.4.app/Contents/MacOS/Xcode 위 명령어에서 Xcode15.4.app은 실행하고자 하는 Xcode 버전의 폴더 이름입니다. 명령어 실행 후, 해당 버전의 Xcode가 열리게 됩니다. 3. Xcode 버전 확인하기실행 중인 Xcode의 버전을 확인하려면 아래 방법을 따르세요:Xco..

Flutter를 활용하여 배너 UI를 구현하고, 배너 전환 애니메이션까지 적용한 과정을 공유합니다. 이번 작업에서는 반응형 디자인과 자연스러운 사용자 경험을 위해 애니메이션 효과를 추가하고, UI 구조를 체계적으로 구성했습니다.구현 목표상단 제목과 날짜 표시: 배너의 상단에 텍스트 형태로 제목과 날짜를 표시.하단 반투명 배경과 버튼: 하단에는 반투명한 검정 배경 위에 "글자" 버튼과 숫자 수를 표시.반응형 UI: 다양한 화면 크기를 지원하기 위해 ScreenUtil을 적용.애니메이션 효과: 배너 전환 시 자연스러운 애니메이션 적용.import 'package:flutter/material.dart';import 'package:flutter_screenutil/flutter_screenutil.dart..

GitHub 플랜 비교 및 CI/CD 도입 가이드시작하며현재 회사에서 프로젝트 관리 및 협업 효율을 높이기 위해 GitHub의 유료 기능 사용이 필요한 상황입니다. 이에 따라 GitHub 플랜의 차이점과 CI/CD 도입 방법을 정리하여 공유드립니다. 이를 통해 플랜 선택과 CI/CD 설정 시 참고 자료로 활용하시길 바랍니다.1. GitHub 플랜 종류 및 주요 차이GitHub는 무료 플랜과 유료 플랜으로 나뉘며, 사용자 및 팀의 요구에 맞는 다양한 기능을 제공합니다.(1) GitHub Free (무료)대상: 개인 개발자, 소규모 프로젝트주요 특징:공개 및 비공개 저장소 무제한 사용 가능GitHub Actions 제공 (CI/CD 지원)2,000분/월 실행 시간기본 협업 도구:이슈 트래킹, Pull Req..

소개Flutter로 이미지를 선택하여 화면에 표시할 때, 균등한 간격을 유지하면서 썸네일 이미지를 정렬하는 UI를 구현하는 방법을 다룹니다. 이 글에서는 Wrap 위젯과 LayoutBuilder를 활용해 동적인 간격 계산과 정사각형 썸네일 UI를 구성하는 방법을 설명합니다.1. 핵심 코드 설명1. LayoutBuilder를 활용한 가로 간격 계산LayoutBuilder는 부모 위젯의 크기를 계산하는 데 유용합니다. constraints.maxWidth를 통해 가용 너비를 가져와 한 줄에 몇 개의 아이템을 배치할지 계산합니다.final double availableWidth = constraints.maxWidth; final int itemsPerRow = (availableWidth / (썸네일 너비 ..

앱에서 사용자로부터 이미지 접근 권한을 요청하고 이를 처리하는 방법은 iOS와 Android에서 다르게 작동합니다. 이 글에서는 Flutter를 사용하여 iOS와 Android에서 이미지 접근 권한을 설정하고 구현하는 방법을 공유합니다.1. iOS 권한 설정iOS에서는 PermissionHandler 패키지를 사용하여 이미지 접근 권한을 요청할 수 있습니다. 권한 요청을 위해 다음 단계를 수행합니다:1.1 Info.plist 수정Info.plist에 다음 권한 요청 메시지를 추가합니다:xml코드 복사key>NSPhotoLibraryUsageDescriptionkey> string>사진 접근 권한이 필요합니다.string> key>NSCameraUsageDescriptionkey> string>카메라 사용..

Simulator > I/O > Keyboard > Connect Hardwear Keyboard⌘ + SHIFT + K단축기 혹은 Simulator에서 적용하면 됩니다 !

vercel을 이용해서 프로젝트를 배포하고 있었는데, main 브랜치에 푸시 될 때마다, 배포되는걸 원치 않아서 해당 내용을 개선해보고자 tag push 를통한 배포가 이뤄지게끔 수정하는 작업을 진행 해봤습니다. Vercel 가이드에 굉장히 친절하게 나와있어서 해당 내용을 참고하여 작업을 진행했습니다. Vercel 공식문서 https://vercel.com/guides/can-you-deploy-based-on-tags-releases-on-vercel 프로젝트 root에 vercel.json 파일을 생성하고 git.deplymentEnabled 에 main 을 false로 변경 합니다. 자동 배포 브랜치가 main 이기 때문입니다. { "git": { "deploymentEnabled": { "main..