개발자노트 조현진

사전 기반 지식1단계 폴링 시스템 완전 이해 (MVC 패턴, JPA, Mustache)HTTP 통신의 한계: 클라이언트가 먼저 요청해야만 응답 가능JavaScript 기초: EventSource API와 이벤트 처리멀티스레드 개념: 동시성과 스레드 안전성에 대한 기본 이해 폴링 vs SSE 비교통신 방향클라이언트 → 서버 (요청/응답)서버 → 클라이언트 (푸시)연결 방식매번 새로운 HTTP 연결하나의 지속적인 HTTP 연결실시간성폴링 주기에 따른 지연즉시 전달 가능서버 부하높음 (불필요한 요청)낮음 (필요시에만 전송)네트워크 효율비효율적효율적구현 복잡도간단중간 SSE의 주요 활용 사례실시간 알림 및 알림 센터: 새로운 메시지, 친구 요청, 좋아요 등 서버에서 발생하는 이벤트들을 사용자에게 즉시 알릴 때 ..

사전 기반 지식Spring Boot 기본: @Controller, @Service, @Repository 어노테이션 이해Spring Data JPA: Entity, Repository 패턴 숙지HTTP 기본: GET, POST 요청/응답 이해HTML/JavaScript 기초: 기본 DOM 조작과 이벤트 처리Mustache 템플릿 엔진: 기본 문법 ({{}}, {{#}}) 폴링(Polling)이란?폴링은 클라이언트가 서버에 주기적으로 요청을 보내 새로운 데이터가 있는지 확인하는 통신 방식입니다. 폴링(Polling)이라는 용어는 클라이언트가 서버로부터 데이터를 계속해서 당겨오는(pulling) 행위에서 유래했습니다. 즉, 클라이언트가 서버에게 "새로운 데이터가 있나요?"라고 지속적으로 질문을 던져 응답을..

공유 상태가 변경될 때, 동기화 하는 것을 상태 관리(State Management)라고 합니다. 상태 관리가 안되면 데이터 일관성을 잃게 됩니다.유저가 프로필을 변경해도 다른 화면에서 이전 프로필이 보이는 문제쇼핑 바구니에 표시된 상품의 개수와 실제 담긴 상품 개수가 다른 문제글을 작성했는데, 게시판에 반영되지 않는 문제(Create)글을 수정했는데, 게시판에 반영되지 않는 문제(Update)글을 삭제했는데, 게시판에 반영되지 않는 문제(Delete)동일한 데이터를 여러 곳에서 가지고 있기 때문에, 동기화가 필요하게 됩니다.

Monolithic (모노리스) 구조의 특징하나의 코드 파일에 UI, 비즈니스 로직, 프레젠테이션 로직을 모두 넣는 형식을 흔히 Monolithic Architecture 또는 간단히 Monolith라고 부릅니다. 먼저 MVVM 패턴 없이 간단한 구조로 코드를 작성해보자. 모든 로직과 상태 관리를 하나의 파일에 통합하여, UI와 데이터 처리가 한 클래스에서 이루어지는 방식으로 코드를 작성할 수 있다. 이 방식은 MVVM과 같은 디자인 패턴이 없어도 간단한 앱에서는 빠르게 개발할 수 있는 장점이 있다. MVVM에 대한 기본 개념 잡기 MVVM(Model-View-ViewModel)은 소프트웨어 개발에서 널리 사용되는 아키텍처 패턴 중 하나입니다. 플러터에서 MVVM을 적용하는 것은 앱의 구조를 명확하게 하..

1. Base64란?Base64는 바이너리 데이터(이미지, 파일 등)를 텍스트로 변환하는 인코딩 방식입니다. 64개의 ASCII 문자(A-Z, a-z, 0-9, +, /)와 패딩 문자(=)를 사용해 안전하게 전송할 수 있게 합니다.2. 왜 사용하나요?텍스트만 허용하는 시스템(예: JSON, 이메일, HTTP)에서 바이너리 데이터를 보낼 때.데이터 손상 방지: 특수 문자가 바이너리에 섞이지 않음.예: 플러터 앱에서 파일을 Base64로 변환해 서버로 업로드.3. 어떻게 작동하나요?바이너리 데이터를 8비트 바이트로 봅니다.6비트 단위로 나눕니다 (3바이트 = 24비트 = 4개의 6비트).각 6비트를 0-63 숫자로 변환 후, Base64 테이블에서 문자로 매핑.나머지 비트가 부족하면 =로 패딩.도식화 (간단..

Flutter의 세 가지 트리 구조개요Flutter는 UI를 효율적으로 렌더링하기 위해 세 가지 트리 구조를 사용합니다. 이 구조들은 성능 최적화와 재사용성을 위해 설계되었으며, 개발자는 주로 Widget Tree만 직접 다룹니다.세 가지 트리의 역할Widget Tree: 개발자가 작성한 UI 구조 (불변객체)Element Tree: Widget과 RenderObject를 연결하는 중간 계층 (상태 유지)RenderObject Tree: 실제 화면에 그려지는 객체들 (렌더링 담당)Widget: UI 설계도 (불변 청사진)Element: 런타임에서 생성된 살아있는 구조물 (가변 인스턴스)역할: 위치, 타입, 상태를 저장하고 RenderObject와 연결중요한 특징:State 객체는 Element에 의해 관..

개요GestureDetector는 사용자가 화면에서 수행하는 다양한 터치 이벤트를 감지하고 처리하는 기본적인 Flutter 위젯입니다.특징GestureDetector 자체는 화면에 표시되지 않으며, child에 지정된 위젯에 사용자 이벤트가 발생할 때 이벤트를 처리할 수 있습니다다양한 사용자 이벤트에 대한 콜백 함수들로 구성되어 있어, 각 이벤트에 맞는 동작을 정의할 수 있습니다주요 콜백 함수 onTap사용자가 화면을 가볍게 탭할 때 호출버튼 클릭 효과onDoubleTap사용자가 화면을 빠르게 두 번 탭할 때 호출이미지 확대onLongPress사용자가 화면을 오래 누르고 있을 때 호출아이템 삭제 옵션 표시onTapDown사용자가 화면을 터치하기 시작할 때 호출버튼을 누르는 즉시 효과 적용onTapUp사용..

dart 비동기 프로그래밍에 대한 개념을 이해하자.동기성 - 모든 코드가 순차적으로 진행되는 형태비동기 - 코드가 동시다발적으로 실행, 순착적으로 보장을 할 수 없는 형태 dart 비동기 프로그래밍은 프로그램의 흐름을 중단시키지 않고, 무언가의 완료를 기다리는 동안 다른 작업을 수행할 수 있게 해줍니다. Dart에서는 이를 위해 Future와 Stream이라는 두 가지 주요 개념을 제공합니다. Future 타입이 뭘까?Future 객체는 미래에 어떤 값이나 오류를 반환할 것이라는 약속을 나타냅니다. async 키워드가 붙은 함수 내부에서 await 키워드를 사용하면, Future가 완료될 때까지 실행을 잠시 멈추고 결과가 준비되면 다시 실행을 계속합니다

콜백 함수란?콜백 함수(callback function)는 말 그대로 나중에 불려지는 함수입니다.보통 다른 함수(또는 위젯)에 인자로 넘겨서, 그 함수가 필요한 시점에 대신 호출해주는 방식이에요. 그럼 왜 콜백함수를 쓸까?버튼을 눌렀을 때값이 바뀌었을 때무언가가 끝났을 때자식 위젯이 부모에게 알릴 때이처럼 특정 상황이 생기면 실행되어야 하는 작업을 미리 정해두기 위해 콜백 함수를 씁니다. Flutter에서는 어떻게 쓰일까?Flutter는 위젯 중심의 프레임워크라서,콜백 함수는 보통 이벤트 처리에 많이 사용됩니다. 한줄로 정리하자면콜백 함수는 나중에 실행될 함수를 다른 함수나 위젯에 넘겨주는 것입니다.Flutter에서는 이걸로 버튼 누르기, 값 바꾸기, 사용자 반응 처리를 합니다.

1.안드로이드 스튜디오 실행2.왼쪽 상단에서 New Flutter Project 생성3.Flutter를 선택4.Flutter경로 선택후 알맞은 설정후 Finish버튼 클릭 2.1.asset 디렉토리 생성후 자신이 원하는 이미지 넣기2.2.yaml에 이미지 파일 인식을 위해 자원 폴더 위치 설정 (아래 코드 참조)2.3.pub get 버튼을 클릭하여 설정 적용 3.1.나머지는 아래 코드처럼 main을 작성import 'package:flutter/material.dart';void main() { runApp(MyApp());}class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return Mat..