[Flutter] 입문 - 시작과 기초 개념 잡기

목표Flutter란 무엇인지 이해하기Flutter 설치 및 개발 환경 세팅첫 번째 Flutter 앱 실행Flutter 프로젝트 구조 이해Flutter란?Flutter는 Google에서 개발한 오픈소스 UI 프레임워크로, 하나의 코드베이스로 iOS, Android, Web, 데스크탑까지 다양한 플랫폼에서 앱을 만들 수 있다.핵심은 빠른 개발, 직관적인 UI 구성, 그리고 Dart 언어를 기반으로 한다는 점이다.💻 개발 환경 세팅1. Flutter 설치공식 사이트: https://flutter.dev설치 방법: OS에 따라 제공되는 zip 파일을 다운 받아 압축 해제 후, flutter/bin 경로를 PATH에 등록2. Android Studio 설치 (권장)Flutter와 함께 사용하는 IDE 중 가장 ..

  • format_list_bulleted 앱 개발/Flutter
  • · 2025. 7. 25.
  • textsms

[Flutter] 입문 - 화면 전환(Navigation)

목표Navifator를 통한 화면 전환 이해하기MaterialPageRoute 사용법Named Route 설정 및 사용화면 간 데이터 전달📱 Flutter에서 화면 전환이란?Flutter 앱은 여러 개의 "화면(Screen)" 혹은 "페이지(Page)"를 가질 수 있다. 이를 Flutter에서는 Route(경로)라고 부르며, 화면 간 이동은 Navigator 클래스를 통해 처리한다.Navigator 기본 사용법화면 이동 (push)Navigator.push( context, MaterialPageRoute(builder: (context) => SecondPage()),);화면 돌아가기 (pop)Navigator.pop(context);Named Route 설정많은 페이지가 생기면 라우트 이름으로 ..

  • format_list_bulleted 앱 개발/Flutter
  • · 2025. 7. 25.
  • textsms

[Flutter] 입문 - 기본 위젯 & Stateful vs Stateless 이해

목표Flutter의 기본 위젯 사용법 익히기레이아웃 구성 방법 배우기StatelessWidget 과 StatefulWidget의 차이 이해하기Flutter 기본 위젯Flutter는 '모든 것이 위젯이다.' 라는 철학을 가지고 있다. 그만큼 다양한 UI 요소들이 Widget 형태로 제공된다.주요 위젯 소개위젯설명Text텍스트 표시Container박스 형태, 배경색, 패딩, 마진 등을 설정할 수 있음Row, Column수평 / 수직 정렬Image네트워크 이미지 또는 에셋 이미지 표시Center자식 위젯을 중앙 정렬ElevatedButton기본 버튼 위젯SizedBox여백 주기용 (공간 확보)예시 : 간단한 레이아웃 구성Column( mainAxisAlignment: MainAxisAlignment.cent..

  • format_list_bulleted 앱 개발/Flutter
  • · 2025. 7. 25.
  • textsms

[Flutter] Form 알아보기

디자인 감각이라고는 쥐뿔도 없지만 그래도 앱이나 웹이든 온전한 나만의 서비스를 만들고 싶었다. 그래서 앱 개발을 배우고 싶었다. 몇 년 전과는 달리 이제는 AI의 발전으로 간단한 앱 디자인 정도는 프롬프트 몇 번 적으면 될 수 있을 것 같으니 지금이 앱 개발을 배우기 딱 좋은 것 같았다. 그래서 먼저 Flutter를 통해 앱 개발에 대해 배워 보려고 한다.아무래도 처음부터 배우기 때문에 무엇을 먼저 구현하면서 배워볼 까 하니 웹이든 앱이든 사용자가 가장 먼저 만나는 요소 중 하나인 로그인 회원 가입과 관련된 기능을 구현해 봐야겠다고 생각했다. 그래서 먼저 Form에 대해서 배워 볼까 한다.FormForm은 사용자 입력을 처리하기 위한 컨테이너 위젯이다. 내부에 여러개의 TextFormField 같은 위젯..

  • format_list_bulleted 앱 개발/Flutter
  • · 2025. 7. 24.
  • textsms