728x90 웹 · 앱 개발/플러터(Flutter)5 Flutter 5화 - 상태(State) 1. 상태(State)란?Flutter에서 "상태"는 위젯의 UI와 동작을 결정하는 데이터의 모음으로, 주로 UI에 반영되는 정보를 의미합니다.이게 무슨 뜻인지 예시를 통해 알아보겠습니다.어떤 버튼이 주어지고, 이 버튼이 몇번 눌렸는지를 표현하는 숫자가 출력되는 페이지가 있습니다.처음에는 버튼을 누른 적이 없으므로, 버튼을 누른 횟수가 0회로 나타나야합니다. 하지만 이후에 버튼을 클릭하게 되면 버튼을 누른 횟수가 1씩 증가하여야합니다.위 이미지는 버튼을 누른 뒤에 누른 횟수가 1이 증가하여 표시되는 모습입니다. 이때 숫자 "1"은 상태(State)를 나타내는 데이터입니다.2. StatefulWidget과 StatelessWidget방금 살펴본 예시에서는 총 2가지 텍스트가 존재했습니다. "버튼을 누른 횟.. 2024. 8. 17. Flutter 4화 - 비동기 프로그래밍 1. 비동기 프로그래밍 살펴보기아래의 코드 스니펫(원본 소스코드의 일부)는 버튼이 눌렸을 때 콘솔에 '버튼이 눌렸습니다!'라는 메시지를 출력하는 기능이 구현되어 있습니다.ElevatedButton( onPressed: () { print('버튼이 눌렸습니다!'); }, child: Text('눌러보세요'),)이 버튼을 눌렀을 때, 만약 시간이 오래 걸리는 작업(예: 서버에서 데이터 가져오기, 파일 읽기 등)을 해야 한다면, 이 작업이 끝날 때까지 앱이 멈추지 않고, 다른 작업을 동시에 할 수 있게 만드는 것이 비동기 프로그래밍의 핵심입니다.2. 비동기 프로그래밍이 필요한 이유만약 버튼을 눌렀을 때 서버에서 데이터를 가져오는 작업이 포함되어 있다고 가정해봅시다. 이 작업은 몇 초가 걸릴 수도 있.. 2024. 8. 10. Flutter 3화 - UI 기초(클래스, 객체, 속성, Text) 비전공자들도 쉽게 Flutter를 통해 UI를 학습할 수 있도록 최대한 쉽게 설명해보겠습니다.1. 클래스, 객체1-1. 예시를 통해 클래스 알아보기클래스를 설명할 때 가장 흔히 쓰는 비유는 "설계도"입니다. 예를 들어, 여러분이 자동차를 만든다고 상상해봅시다. 자동차를 만들기 위해서는 먼저 자동차가 어떻게 생겼고, 어떤 기능을 가지고 있는지에 대한 설계도가 필요하겠죠?예를 들어, 자동차라는 클래스를 만들어 보겠습니다. 이 클래스는 자동차의 특징(속성)과 기능(메서드)을 정의합니다.class Car { String color; // 색깔 int speed; // 속도 // 자동차가 가속하는 기능 void accelerate() { speed += 10; print('속도가 $speed k.. 2024. 8. 10. Flutter 2화 - Dart 문법 학습하기 본 글은 윈도우11에서 VSCode를 사용하고 있습니다.이전 포스트에서 Flutter 프레임워크를 설치하면서 Dart 언어도 함께 설치되었습니다.Flutter 프레임워크는 Dart 언어로 다루어지므로 Flutter를 잘 사용하기 위해 Dart 언어를 학습해보겠습니다.[목차생성]1. 변수 (Variables)Dart에서 변수를 선언하는 방법은 var, final, const 키워드를 사용하거나 명시적으로 타입을 지정하는 방법이 있습니다.var: 변수를 선언할 때 사용하며, 초기화 시 타입이 결정됩니다.final: 한 번 값이 할당되면 변경할 수 없는 변수입니다.const: 컴파일 시간에 값이 결정되고, 이후 절대 변하지 않는 상수입니다.int: 정수형 (e.g., int age = 25;)double: 실.. 2024. 8. 10. Flutter 1화 - Flutter 설치 및 예제 본 글은 윈도우11에서 VSCode를 사용하고 있습니다.[목차생성]0. Flutter와 Dart 소개Dart는 Google에서 개발한 프로그래밍 언어로, 주로 웹과 모바일 앱을 만들 때 사용됩니다. Dart의 가장 큰 장점은 빠르고 효율적인 앱을 만들 수 있다는 점입니다. 특히 Flutter라는 프레임워크와 함께 사용될 때, 하나의 코드로 Android와 iOS 앱을 동시에 개발할 수 있어 개발 시간과 비용을 절약할 수 있습니다.Dart를 사용하는 Flutter에 대한 기업들의 평가는 매우 좋습니다. 지식iN 앱을 Flutter로 개발한 네이버의 분석에 따르면, 플러터를 선택하게 된 이유로 성능과 학습 비용을 꼽습니다. 또한 Flutter와 유사한 포지션에 존재하는 프레임워크들, 예를 들면 React N.. 2024. 8. 10. 이전 1 다음 728x90
