개발의 민족 이나주니

1. 컴포넌트는 작게 쪼개라 하나의 컴포넌트가 200줄을 넘으면 분리를 고려해야 한다. // 나쁜 예 — 한 파일에 모든 것 function UserPage() { return ( {/* 프로필 영역 100줄 */} {/* 게시글 목록 영역 100줄 */} {/* 댓글 영역 100줄 */} ) } // 좋은 예 — 역할별로 분리 function UserPage() { return ( ) } 분리 기준: "이 부분만 따로 설명할 수 있는가?" → Yes면 컴포넌트로 분리. 2. 상태(state)는 필요한 곳에서만 선언하라 state는 그것을 사용..

오랜만에 기술블로그 작성합니다. 이번에 Admin 페이지를 React + TypeScript 를 작업하게 되면서 알게 된 부분들을 정리 해보려 합니다. 정리하면서 말투는 편하게 하겠습니다 이해부탁 :) 1. .ts와 .tsx 파일의 차이 React + TypeScript 프로젝트에서는 두 가지 파일 확장자를 사용한다. // utils.ts — 화면 요소 없이 로직만 담당 export function formatDate(date: Date): string { return date.toLocaleDateString("ko-KR") } // UserProfile.tsx — JSX로 화면을 렌더링 function UserProfile({ name }: { name: string }) ..

Flutter 프로젝트를 하다 보면 Navigator.push()를 계속 쓰는 게 점점 귀찮아지죠.“이 페이지가 어디서 왔는지”, “뒤로가기 스택은 어떻게 관리하지?” 같은 문제도 자주 생깁니다. 그래서 오늘은 go_router 패키지를 사용하는 방법을 정리해봤어요. 가볍게 Riverpod과 함께 라우팅 패턴을 이용해볼게요 항목 Navigator 방식 GoRouter 방식코드 구조화면마다 직접 push/pop선언형 라우팅 (Route 정의로 관리)딥링크/URL수동 처리 필요기본 지원인증 가드직접 조건문 작성redirect 기능 제공상태관리 연동불편함Riverpod, Provider 등과 ..

여러 사용자가 로그인할 수 있는 앱에서, 각 사용자마다 독립된 SQLite 데이터베이스를 갖게 하려면 어떻게 해야 할까? 우산 작성이의 경우는 UID 기준으로 DB를 분리했습니다.왜냐하면 그럴일은 잘 없겠지만 한디바이스에 여러계정으로 로그인시 사용자별로 구분 지지 않는다면 로컬 DB가 하나로 합쳐져 다른 계정의 정보를 불러올수 있기때문에 UID를 통해 물리적으로 분리 하려고 합니다. 이번 글에서는 sqflite를 이용해1. 사용자별 DB 생성2. 검색 속도 향상용 인덱스 구성3. 서버 동기화(upsert)를 구성하려고 합니다. 셋팅dependencies: sqflite: ^2.4.2 path: ^1.9.0 crypto: ^3.0.3SQLite와 파일 경로 조합(path),그리고 사용자별 DB 파..

사진과 같이 unfocus 틀 통해 키패드가 활성화 됐을때 밖같영역 선택시 unfocus 되도록 추가함 하지만 다른페이지 접근후Navigator.pop(context); 할 경우 키패드가 다시 나타나는 현상 발견 문제 정리1. Navigator.pop(context)로 위에 덮여 있던 화면이 사라지면, 아래에 있던 화면이 다시 보이는 상태2. Flutter는 아래 화면의 포커스 트리(Focus Tree)를 그대로 복원하려는 경향이 있음. 즉, 이전에 TextFormField가 포커스를 가지고 있었다면, 팝 이후에도 그 포커스가 살아나면서 키보드가 다시 뜨는 현상이 생김3. GestureDetector로 바깥을 탭했을 때 unfocus() 하는 건 “탭 이벤트”에 대한 처리일 뿐, 라우트(pop)로 인한 ..

FireBase Crashlytics 화면에서 아래와 같은 문제가 발생했다. 보통 이 메시지는 “Crashlytics가 크래시가 난 바이너리의 UUID(고유 식별자)와 매칭되는 dSYM을 못 찾았다”는 뜻 dSYM이 생성되도록 Xcode 설정 확인Target ▸ Build SettingsDebug Information Format: DWARF with dSYM File (Debug/Release 모두)Strip Debug Symbols During Copy: No (권장)Flutter라면 flutter build ios --release 후, Xcode Archive(Product ▸ Archive)까지. 아카이브를 해야 올바른 dSYM이 나옴아래와 같이 설정 firebase 접근 업로드 성공 시 ..

https://pub.dev/packages/flutter_line_sdk flutter_line_sdk | Flutter packageA Flutter plugin for using the LINE SDKs with Dart in Flutter apps.pub.dev오늘은 pub.dev에 있는 LINESDK 를 이용한 라인 로그인을 구현하겠습니다. main 에서 아래와 같이 넣어준다 초기화 목적// Line key 값await LineSDK.instance.setup("123456").then((_) { print("LineSDK Prepared");}); 기본적인 로그인 함수를 만들어준다. 이후https://developers.line.biz/en/ https://developers.line.b..

https://pub.dev/packages/device_info_plus device_info_plus | Flutter packageFlutter plugin providing detailed information about the device (make, model, etc.), and Android or iOS version the app is running on.pub.devhttps://pub.dev/packages/google_maps_flutter google_maps_flutter | Flutter packageA Flutter plugin for integrating Google Maps in iOS and Android applications.pub.devhttps://pub.dev/..

Launching lib\main.dart on SM F926N in debug mode...Running Gradle task 'assembleDebug'...FAILURE: Build failed with an exception.* What went wrong:Execution failed for task ':app:processDebugMainManifest'.> com.android.manifmerger.ManifestMerger2$MergeFailureException: Error parsing C:\workspace\dentistry\android\app\src\main\AndroidManifest.xml* Try:> Run with --stacktrace option to get the st..

오늘도 개발을 이어가던중 이전에 개발한 코드에서 문제가 생겼다그것은 바로 테블릿을 한서버에 미러링을 통한 내화면을 공유해야함.문제는 알고보니 800대 이상 한서버에 동시에 스트리밍을 하기 때문에이전의 코드는 WebRTC로 캡쳐해서 ByteArray에 담아 보내는 방식이었기 때문에 서버에서 부담이 될수 밖에 없는 상황 그래서 다음 방법으로 대체하며 내용을 정리 하려고 한다. 목적은 Android에서 화면을 실시간으로 캡처하고,WebRTC를 통해 Janus 서버(ws://내서버)에 videoroom 방식으로 스트리밍 구성 요소구성 요소설명MediaProjectionAndroid 화면 캡처 권한/세션WebRTC화면 인코딩 ..