들어가며본 게시글은 노마드코더의 Flutter로 웹툰 만들기를 보고 정리한 글입니다. 코드 구조 코드// lib/main.dartimport 'package:flutter/material.dart';import 'package:toonflix/screens/home_screen.dart';void main() { runApp(const App());}class App extends StatelessWidget { const App({super.key}); @override Widget build(BuildContext context) { return MaterialApp( home: HomeScreen(), ); }} API// lib/services/api_service.d..
들어가며본 게시글은 노마드코더의 Flutter로 웹툰 만들기를 보고 정리한 글입니다. POMODORO APPPOMODORO는 25분 일하고 5분 쉬는 생산성 기술을 의미한다. 이와 관련된 앱을 Omar Sharif의 디자인으로 만들어보는 실습을 한다. 작성하다 코드 날라가서 다시 쓰기엔 시간 아까우니 코드와 완성 화면만 첨부한다.// lib/main.dartimport 'package:flutter/material.dart';import 'package:toonflix/screens/home_screen.dart';void main() { runApp(const App());}class App extends StatelessWidget { const App({super.key}); @override..
들어가며본 게시글은 노마드코더의 Flutter로 웹툰 만들기를 보고 정리한 글입니다. Stateful Widget이전에 만들었던 UI는 Stateless Widget으로 정적이었다. 아무런 데이터를 저장하지 않고 단지 보여주기만 한다. Stateful Widget은 상태에 따라 변하게 될 데이터를 고려하여 UI에 반영할 수 있다. 위젯에 데이터를 저장하거나 실시간 데이터 변화를 볼 수 있다. Stateful Widget은 state가 없는 위젯 그 자체와 state, 두 개의 부분으로 나뉘어진다. state는 위젯에 들어갈 데이터와 UI를 가진다. 코드로 살펴보면 위에는 위젯 그 자체가 있다. State 하나만 가지고 있는 작은 코드이다.아래는 State가 있다. State는 UI를 구축하는 곳이다. S..
들어가며노마드코더의 Flutter로 웹툰 만들기에서 알려준 자잘한 DX를 올리기 위한 팁을 정리한 글입니다.Flutter 코딩 팁VSCode 파란줄: const 쓰기지금까지 개발하면서 계속 파란 줄이 생겼는데, 이는 const를 사용해 최적화할 것을 권장한다는 의미이다. 예를 들어 다음의 코드가 있을 때, 변수를 const로 선언해두면 컴파일시 dart는 각각의 변수를 메모리에 할당하는 대신 직접 값들을 치환해 최적화를 하게 된다.const taxAmount = 15;const priceAmount = 30;var finalPrice = taxAmount + priceAmount; 마찬가지로 배경색의 '0xFF181818' 같은 애들도 변하지 않는 constant이기 때문에 const로 값을 선언하여 런..
들어가며본 게시글은 노마드코더의 Flutter로 웹툰 만들기를 보고 정리한 글입니다. 목표해당 챕터에서는 Google 스타일의 MaterialApp 위젯이나 iOS 스타일의 Cupertino 위젯을 사용하는 대신 커스텀 스타일을 만들어보며 Flutter의 위젯 사용에 익숙해지는 것이다. 목표로하는 UI는 다음 이미지에서 보이는 디자인이다.니코쌤이 자신이 코드 짤때의 순서도 살펴보길 바란다고 하시기에 순서에 집중하여 작성하겠다. ※ 나의 데스크 셋업의 경우 메모리가 8GB로 모바일 에뮬을 돌리기엔 턱없이 모자르므로 집에 굴러다니는 S10 공폰을 에뮬레이터로 사용하였다. 우선 현재의 기본 화면이다.class App extends StatelessWidget { @override Widget build..
들어가며본 게시글은 노마드코더의 Flutter로 웹툰 만들기를 보고 정리한 글입니다.Flutter Docs : https://docs.flutter.dev/How Flutter WorksFramework와 EngineSwift로 iOS나 Java로 안드로이드 네이티브 앱을 개발할 때 네이티브 프레임워크는 운영체제와 직접적으로 소통한다. 반면 Flutter와 Dart는 운영체제와 직접적으로 소통하지 않고 C나 C++로 짜여진 엔진과 소통한다. 엔진은 Flutter 어플리케이션의 실제 UI를 렌더링한다. 운영체제와 직접적으로 소통하지 않고 엔진을 거치기 때문에 운영체제에 내장된 플랫폼 위젯은 사용하지 않는다. 즉 운영체제에서는 엔진만 실행하고 엔진은 프레임워크를 동작시킨다. iOS의 경우 엔진의 C/C++ ..