전체 글 (30) 썸네일형 리스트형 [Flutter_개발] GitHub를 이용한 팀 프로젝트 협업 오늘은 팀프로젝트에 앞서 팀원들과 역할분담을 하고GitHub를 이용한 팀 프로젝트 협업 방식을 학습했다.단순히 코드를 저장하는 용도에서 벗어나, 여러 명이 동시에 작업할 때 효율적으로 관리하는 방법을 중심으로 이해했다. 먼저 프로젝트를 시작할 때, 팀장은 GitHub에서 원격 저장소를 만들고 팀원을 collaborator로 초대한다.팀원은 저장소를 자신의 컴퓨터로 복제하기 위해 다음 명령어를 사용한다.git clone 이후 작업을 구분하기 위해 새로운 브랜치를 생성한다.각 기능별로 브랜치를 만드는 것이 협업의 기본이다. 예를 들어 로그인 기능을 담당한다면 다음과 같이 작성한다.git checkout -b feature/login브랜치를 만든 후, 기능 구현이나 수정 작업을 진행한다.작업이 완료되면 변경.. [Flutter_개발] flutter입문 강의 전체요약 1. 학습 개요이번 학습에서는 Flutter의 기본 구조부터 실제 앱 구현까지 이어지는 전 과정을 통해, 하나의 프로젝트가 어떤 구조로 만들어지고 작동하는지를 전체적으로 이해했다.단순히 위젯을 나열하는 수준이 아니라, 위젯들이 어떻게 상호작용하며 화면을 구성하고 상태를 반영하는지를 구체적으로 익힌 시간이었다.2. Flutter 프로젝트 구조 이해Flutter 프로젝트는 여러 폴더로 나뉘어 있으며, 각 폴더가 명확한 역할을 가진다.lib 폴더는 앱의 핵심 로직과 UI를 담고, pubspec.yaml은 사용하는 패키지와 리소스를 정의한다.android, ios, web 폴더는 플랫폼별 실행 환경을 담당하고, test 폴더에서는 코드 동작을 검증할 수 있다.이 구조를 이해한 덕분에 이후 패키지 추가나 경로 인.. [Flutter_개발] 투두앱 개발 및 트러블슈팅 배경Flutter를 이용해 ToDo 앱을 완성하고, 프로젝트를 GitHub에 업로드하기 위해 실행 테스트를 진행했다.하지만 실행 도중 환경 변수 인식, GitHub 인증, 코드 빌드 등에서 여러 문제가 발생했다.코드 관련 실수를 포함하여 그 해결 과정을 정리했다.발단프로젝트를 로컬 환경에서 실행하려 했으나, 앱이 화면에 표시되지 않거나 콘솔에 에러 메시지만 출력되었다.이 과정에서 몇 가지 실수들이 함께 드러났다.전개1. pubspec.yaml 구조 오류문제:flutter pub get 실행 시 다음과 같은 에러 발생 Error on line 90, column 1: Duplicate mapping key. 원인:dependencies: 나 flutter: 블록이 중복 작성되었다.YAML 문법은 들여쓰기 .. [Flutter_개발]투두앱 만들기 이번 강의에서는 Flutter를 활용해 간단한 투두(To-Do) 앱을 구현했다.단순히 할 일을 표시하고 삭제하는 기능을 넘어서, 앱 구조 설계, 상태관리, 위젯 분리, 사용자 입력 처리 등 실제 앱 개발에서 자주 활용되는 핵심 개념들을 학습했다.1. 투두앱 UI 구성앱의 전체적인 화면은 Scaffold를 기반으로 상단에는 AppBar, 하단에는 할 일 입력창(TextField), 중앙에는 할 일 목록(ListView) 이 위치하도록 설계했다.프로젝트 구조 설정main.dart에서 HomePage를 초기 화면으로 설정하고, home_page.dart에 앱의 기본 UI를 구성했다.AppBar & TextField 구현AppBar에 “TO DO” 타이틀을 표시TextField를 bottomSheet 영역에 배.. [Flutter_개발] 위젯, 상태, 리스트, 라우팅 마스터 오늘 강의에서는 Flutter 앱 개발의 근간이 되는 핵심 개념들을 학습했다. 구체적으로 상태를 가지는 위젯 (StatefulWidget), 사용자 입력 처리 (TextField), 스크롤 가능한 리스트 (ListView), 하단 탭 메뉴 구현 (BottomNavigationBar와 IndexedStack), 그리고 페이지 간 이동 및 데이터 전달 (Navigator) 기능들을 실습했다. 이 기능들은 실제 앱 개발에 필수적인 요소들이다. 1. 상태(State) 관리 위젯: StatefulWidget 데이터가 변경됨에 따라 화면이 업데이트되어야 하는 경우, **StatefulWidget**을 사용하여 상태를 관리한다.상태(State): UI에 반영되는 변경 가능한 데이터를 의미한다.StatelessWidg.. [Flutter_개발] BMI 계산기 앱 만들기 이번 강의에서는 Flutter를 활용해 BMI(Body Mass Index) 계산기 앱을 구현했다.단순히 BMI를 계산하는 기능뿐 아니라, 앱 구조 설계, 테마 적용, 페이지 전환, 위젯 분리 등 실제 앱 개발에 필요한 핵심 개념들을 학습했다.프로젝트 구조 설계앱은 크게 입력 화면(HomePage) 과 결과 화면(ResultPage) 으로 구성된다.HomePage: 사용자가 성별, 키, 몸무게를 입력하는 페이지ResultPage: 계산된 BMI 값을 시각적으로 출력하는 페이지 이렇게 페이지별 폴더를 나누면, 화면이 여러 개인 프로젝트에서도 파일 관리와 유지보수가 쉬워진다.main.dart 기본 세팅main.dart에서는 앱 전체 구조를 관리한다.MaterialApp의 home 속성에 HomePage()를.. [Flutter_개발] 영화관 좌석 예매 앱 만들기 1. 학습 목표Flutter의 상태 관리 기초를 이해한다. (StatefulWidget, setState)위젯을 파일 단위로 분리하여 UI 구조를 체계적으로 만든다.사용자 입력에 따라 화면이 동적으로 변경되는 앱을 구현한다.2. StatefulWidget과 StatelessWidget의 차이StatelessWidget은 상태가 없는 위젯으로, 데이터가 바뀌어도 화면이 다시 그려지지 않는다.StatefulWidget은 상태(State)를 가지고 있으며, 데이터가 변경되면 setState()를 통해 화면을 다시 그릴 수 있다.setState()는 “상태가 바뀌었으니 다시 그려달라”는 신호를 Flutter 프레임워크에 보내는 함수이다.이 함수를 호출하지 않으면 변수 값이 바뀌어도 UI에는 변화가 없다. voi.. [Flutter_개발] flutter 기초 1. Flutter 프로젝트 구조 이해플러터 프로젝트는 여러 구성요소로 이루어져 있으며, 각 폴더와 파일은 다음과 같은 역할을 한다.lib 폴더:앱의 주요 로직과 UI를 구현하는 코드가 들어간다.플러터 개발의 대부분은 이 폴더에서 이루어진다.test 폴더:코드가 올바르게 동작하는지 확인하기 위한 테스트 코드를 작성한다.위젯 테스트, 단위 테스트 등을 수행할 수 있다.android / ios / web 등 플랫폼 폴더:네이티브 기능(GPS, 카메라, 알림 등)을 사용하기 위한 코드를 포함한다.pubspec.yaml:외부 패키지 의존성을 추가 및 관리한다.이미지나 폰트 같은 정적 리소스를 등록할 수 있다.기타 구성요소.gitignore: Git에 포함되지 않아야 할 파일을 지정한다.analysis_optio.. 이전 1 2 3 4 다음