개발

iOS Flutter 프로젝트에서 flutter_downloader 1.11.4 통합하기

iOS Flutter 프로젝트에서 flutter_downloader 1.11.4 통합하기 https://pub.dev/packages/flutter_downloader#_development-note_ 커뮤니티 & 프롬프트 기반 이미지 생성 AI 앱을 AppStore에 배포하려고 했으나, 흰 화면이 뜨고 앱이 crash 나는 문제가 발생했습니다. 원인을 찾지 못해 방황하던 중에 은인을 만나서 원인을 파악하고 해결을 시도해보았습니다 flutter_downloader 플러그인, 특히 버전 1.11.4를 iOS Flutter 프로젝트에 통합하는 과정에서 ios 관련 설정이 누락되어 발생한 오류였습니다. flutter_downloader란 무엇인가? flutter_downloader 플러그인은 Flutter 애..

카카오 로그인 통합하기: Android Key Hash와 iOS Bundle ID 문제 해결 가이드

서론 카카오 로그인 통합의 중요성 및 일반적인 문제 소개 이 글에서 해결할 주요 에러: "invalid android_key_hash or ios_bundle_id or web_site_url" Java 버전 확인 및 JDK 설치 필요성: 카카오 로그인 통합을 위한 첫걸음으로, 올바른 Java 개발 환경 설정이 필수 Java 버전 확인 방법 명령어: java --version JDK 설치 방법 Homebrew를 이용한 OpenJDK 11 설치 명령어: brew install openjdk@11 JDK 경로 설정 .zshrc 파일을 통한 경로 설정 명령어: echo 'export PATH="/opt/homebrew/opt/openjdk@11/bin:$PATH"' >> ~/.zshrc 설정 적용: sourc..

AWS EC2, RDS 연결하기 :: VPC와 함께하는 NestJS 백엔드 배포, Prisma Migrate 문제 해결

AWS EC2, RDS 연결하기 :: VPC와 함께하는 NestJS 백엔드 배포, Prisma Migrate 문제 해결 안녕하세요 여러분! 오늘은 제가 NestJS 백엔드 배포 중 겪었던 문제와 그 해결 과정에 대해 이야기하려 합니다. 아마 여러분 중에서도 Prisma Migrate를 사용하면서 문제에 부딪히신 분들이 계실 것 같아, 제 경험을 공유하고자 합니다. 1. 배경 및 문제점 NestJS 프로젝트를 개발 중, Prisma를 사용하여 데이터베이스 관리를 하고 있었습니다. 개발을 마무리하고 AWS에 배포하는 과정에서 Prisma Migrate를 실행했으나 예상치 못한 오류가 발생했습니다. npx prisma migrate dev --name init --schema=./prisma/schema.pr..

AWS EC2 인스턴스 지역 변경하기 (AMI 이미지 사용하기), Amazon Machine Image

AWS EC2 인스턴스 지역 변경하기 (AMI 이미지 사용하기), Amazon Machine Image AWS에서 EC2 인스턴스를 사용하다보면 서버의 지역을 변경하고 싶은 경우가 있습니다. 저는 ap-southeast-2 (시드니) region에서 서버를 운영하다가 이를 ap-northeast-2 (서울) region으로 옮기고 싶었습니다. 문제 상황 github action에서 CI/CD 환경을 구성하던 도중에 아래와 같이 코드를 실행했을 때 다음과 같은 오류가 발생했습니다: - name: Deploy to AWS CodeDeploy run: aws deploy create-deployment --application-name output-codedeploy --deployment-group-name..

EC2와 Docker 환경에서 SWAP Memory를 활용한 NestJS 어플리케이션의 'JavaScript heap out of memory' 문제 해결

EC2와 Docker 환경에서 NestJS 어플리케이션의 'JavaScript heap out of memory' 문제 해결 안녕하세요 여러분, 오늘은 RAM이 2GB로 설정된 t2.small AWS EC2에 Docker로 배포한 NestJS 어플리케이션에서 JavaScript heap out of memory 오류를 마주했을 때의 경험과 해결 방안에 대해 이야기하려 합니다. 1. 오류 코드 docker로 이미지화된 NestJS 애플리케이션을 실행시켰을 떄 다음과 같은 오류 메시지가 발생했습니다 [19:0x65441a0] 53911 ms: Mark-sweep (reduce) 977.0 (1000.1) -> 975.4 (995.6) MB, 1180.0 / 0.0 ms (+ 292.9 ms in 55 ste..

AWS EC2, Route 53과 가비아를 활용한 NestJS 서비스 SSL 인증서 적용 방법

AWS EC2, Route 53과 가비아를 활용한 NestJS 서비스 SSL 인증서 적용 방법 안녕하세요, NestJS를 사용하는 개발자 여러분! 오늘은 AWS EC2에서 구동중인 NestJS 웹 서비스에 가비아에서 구매한 도메인을 연결하고, SSL 인증서를 적용하는 과정을 단계별로 설명해 보려고 합니다. https://sslhosting.gabia.com/service 가비아: 대한민국 No.1 SSL 보안서버 인증서 개인정보를 암호화하여 데이터를 안전하게 보호하고, 웹사이트의 신뢰도를 높입니다 sslhosting.gabia.com 1. 가비아에서 도메인 구매 먼저, 필요한 도메인을 가비아에서 구매해줍니다. 원하는 도메인 이름을 검색 후 사용 가능하면 구매를 진행합니다. 2. AWS EC2에서 Nest..

Prisma + NestJS :: 쇼핑몰 데이터베이스 모델링 및 관계 분석, 일대일관계, 일대다관계, 다대다관계

Prisma + NestJS :: 쇼핑몰 데이터베이스 모델링 및 관계 분석 안녕하세요! 이번 포스트에서는 ShoppingMall 서비스의 Prisma 데이터베이스 스키마를 다루며, 각 테이블 간의 관계와 그에 따른 중요한 제약조건을 살펴볼 예정입니다. 데이터베이스의 설계는 서비스의 핵심적인 기능과 성능에 큰 영향을 미치므로, 잘 이해하고 설계하는 것이 중요합니다. 1. 주요 테이블 및 관계 1.1. User User 테이블은 서비스의 사용자에 관한 정보를 담당합니다. 각 사용자는 여러 주문을 가질 수 있으며, 일부 사용자는 가게(Store) 정보와 일대일 관계를 형성합니다. model User { id Int @id @default(autoincrement()) storeId Int? @unique ....

Docker 실시간 로깅: docker logs -f 명령의 효율성에 대하여

Docker 실시간 로깅: docker logs -f 명령의 효율성에 대하여 안녕하세요, 여러분! 오늘은 Docker 환경에서의 NestJS 개발 경험을 공유하고자 합니다. 특히, 컨테이너 로깅과 관련된 docker logs -f 명령의 중요성 및 효율성에 중점을 둘 것입니다. 1. docker logs 명령의 기본 먼저, docker logs 명령은 Docker 컨테이너의 로그를 출력하는 데 사용됩니다. NestJS 애플리케이션 같은 백엔드 서비스를 개발할 때, 이 명령은 매우 유용합니다. 애플리케이션에서 발생하는 모든 로그를 실시간으로 확인할 수 있기 때문입니다. 2. -f 플래그의 마법 -f 플래그 (또는 --follow)는 docker logs 명령에 실시간 스트리밍 기능을 추가합니다. 즉, 새로..

Docker 내에서의 'exec format error' 오류 해결하기

Docker를 사용하여 애플리케이션을 컨테이너화하면서 exec format error라는 오류에 직면한 적이 있나요? 이 오류는 스크립트나 바이너리 파일의 형식이 컨테이너 내에서 실행되기에 적합하지 않을 때 발생합니다. 여기에서는 이 문제의 원인과 해결 방법에 대해 간략하게 알아보겠습니다. 문제 상황 Dockerfile 내에서 다음과 같은 명령어를 사용하여 AWS 자격 증명을 설정하는 스크립트를 실행하려고 했습니다: COPY .env .env COPY set_aws_credentials.sh set_aws_credentials.sh RUN chmod +x set_aws_credentials.sh && ./set_aws_credentials.sh 제가 현재 운영중인 EC2(Amazon linux2)에서 이..

NestJs에서 AWS S3 연동 시 발생하는 'CredentialsProviderError' 오류 해결하기

NestJs에서 AWS S3 연동 시 발생하는 'CredentialsProviderError' 오류 해결하기 안녕하세요, NestJs 개발자 여러분! 오늘은 AWS SDK와 연동하면서 마주칠 수 있는 CredentialsProviderError 오류와 이를 해결하는 방법에 대해 자세히 알아보겠습니다. 문제 상황 NestJs를 사용하여 AWS S3와의 연동을 진행하던 중 아래와 같은 오류 메시지가 출력되었습니다. { "code": "CredentialsProviderError", "message": "Could not load credentials from any providers", ... } 원인 파악 이 오류는 AWS SDK가 필요한 자격 증명을 찾을 수 없을 때 발생합니다. 자격 증명은 주로 ~/...

AWS S3에서 'AccessControlListNotSupported' 오류 해결하기

AWS S3에서 'AccessControlListNotSupported' 오류 해결하기 안녕하세요, 개발자 여러분! 오늘은 AWS S3와 연동할 때 마주칠 수 있는 AccessControlListNotSupported 오류와 이를 해결하는 방법에 대해 자세히 알아보겠습니다. 문제 상황 AWS S3에 파일을 업로드하거나 버킷과 관련된 작업을 수행할 때 다음과 같은 오류 메시지를 받았다면, 여러분도 이 문제에 부딪혔을 가능성이 높습니다. { "code": "AccessControlListNotSupported", "message": "The bucket does not allow ACLs", "data": null, "exception": { "name": "AccessControlListNotSupport..

NestJS + Prisma :: 예외를 두려워 마라! NestJS AllExceptionFilter의 활용 전략, 공통 응답 구조, Exception 생성해서 사용하기

NestJS + Prisma :: 예외를 두려워 마라! NestJS AllExceptionFilter의 활용 전략, 공통 응답 구조, Exception 생성해서 사용하기 서론 현대 응용 프로그램에서는 사용자에게 관련성 있는 명확한 에러 메시지를 전달하기 위해 구조화된 에러 처리가 중요한 역할을 합니다. NestJS와 Prisma 같은 프레임워크를 사용하면 이를 원활하게 효율적으로 구현할 수 있습니다. 사용자 정의 예외, 응답 DTO, 그리고 NestJS와 Prisma의 강력한 기능을 어떻게 활용하는지 자세히 알아봅시다. 1. ExceptionCode 구조 사용자 정의 예외에 들어가기 전에 우리의 에러 코드에 대한 구조화된 형식을 만드는 것이 중요합니다. 코드에서 제공하는 내용은 다음과 같습니다: type..

Flutter :: GoRouter

1. 화면 등록 import 'dart:convert'; import 'package:culture_app/detail_screen.dart'; import 'package:culture_app/home_screen.dart'; import 'package:culture_app/model/festival_model.dart'; import 'package:culture_app/onboarding_screen.dart'; import 'package:go_router/go_router.dart' show GoRoute, GoRouter; final router = GoRouter( routes: [ GoRoute( path: '/', builder: (context, state) => const Onboa..

Flutter :: Riverpod 개념, ProviderScrope, Model, State, StateNotifierProvider, Notifier, ConsumerStatefulWidget, ConsumerState, ret.watch()

1. Riverpod의 장점 특징 1.1. 안전한 컴파일 Provider를 사용할 때 처럼 더 이상 ProviderNotFoundException 예외가 발생하지 않고, 로딩 상태를 처리하는 것을 걱정하지 않아도 됩니다. Riverpod를 사용하면 코드가 컴파일되어 작동합니다. 1.2. 제한없는 Provider Riverpod는 Provider에서 영감을 얻었지만 동일한 유형의 여러 Provider를 지원하는 것과 같은 주요 문제 중 일부를 해결합니다. 비동기 Provider를 기다리고 있습니다. 어디에서나 Provider를 추가할 수 있습니다. 1.3. Flutter에 의존하지 않습니다. Flutter에 의존하지 않고 Provider를 생성/공유/테스트합니다. 여기에는 BuildContext 없이 Pr..

Flutter :: Riverpod / GoRouter / state, provider, notifier 선언 / 페이징 / http

0. pubspec.yaml 에 기초 프로젝트 설정하기 name: culture_app description: A new Flutter project. publish_to: 'none' version: 1.0.0+1 environment: sdk: '>=3.0.0

Flutter :: Color 저장해서 변수로 재사용하기

아래와 같이 자주 쓰는 색을 변수로 저장하여, 재사용성이 높아져 코드의 유지보수성이 증가한다. import 'package:flutter/material.dart'; // Basic Color const Color kWhiteColor = Color(0xFFFFFFFF); const Color kBlackColor = Color(0xFF000000); // System Color const Color kSystemErrorColor = Color(0xFFFC444F); const Color kSystemSuccessColor = Color(0xFF30E181); const Color kSystemWarningColor = Color(0xFFFFD362); // Color Pallette const Col..

Flutter :: TextStyle 저장하여 관리하기

여러 텍스트 스타일을 미리 저장해두고, import 'package:culture_app/constant_color.dart'; import 'package:flutter/material.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart'; // ...을 알려주세요 TextStyle kGrade1 = TextStyle( fontSize: 30.sp, color: kBlackColor, fontWeight: FontWeight.w700, height: 1.2, ); // ...을 알려주세요 TextStyle kHeadline1 = TextStyle( fontSize: 24.sp, color: kBlackColor, fontWeight: F..

Flutter :: API 통신 모듈화하기 / Dio helper / JWT token / cache interceptor

1. 배경 데이터베이스에서 데이터를 가져와 앱 프론트에 표시할 때, 서버와 API통신하는 경우가 많은데, API 통신 코드를 모듈화하여 유지보수가 용이하게 할 필요성이 있었다. 다양한 기능을 가진 Interceptor를 옵션에 추가해 개발 시 디버깅이 편하게 해야 했다. 2. 요구사항 2.1. dio https://pub.dev/packages/dio dio | Dart Package A powerful Http client for Dart, which supports Interceptors, FormData, Request Cancellation, File Downloading, Timeout etc. pub.dev 인기있는 http 라이브러리다. 다양한 기능이 포함되어있다. 2.2. alice htt..

SQL :: 점수 합계, 등급 산정하기, PERCENTRANK, SUM

1. 배경 각 유저마다의 체력 등급을 평가하기 위해 체력요인점수를 합하여 높은 순부터 1등급 ~ 9등급을 부여해야 하는 기능을 구현해야했다. 2. 요구사항 2.1. 각 체력요인 점수는 종목 점수 중 제일 높은 것을 선택 2.2. 1 ~ 9등급 비율은 아래의 표를 참고하여 설정 2.3. 각 유저의 5가지 체력요인 점수를 합하여 비교 2.4. prisma 기본 쿼리로는 구현이 복잡해서 Raw Query를 사용해서 구현 2.5. 연도별 조회 기능도 필요하기에 year에 따라 연도별로 계산 3. 해결 & 코드 select t3.*, -- 비율마다 1 ~ 9등급 부여 CASE WHEN t3."totalPercentile" >= 0.96 THEN '1' WHEN t3."totalPercentile" >= 0.89 ..

Flutter :: 앱 아이콘(app_icon.png) 설정하기

1. 배경 매번 하는 일인데, 배포 심사할 때만 하다보니 까먹는 경우가 잦아 정리하려고 한다 2. 의존성 추가하기 flutter_launcher_icons: "^0.11.0" https://pub.dev/packages/flutter_launcher_icons flutter_launcher_icons | Dart Package A package which simplifies the task of updating your Flutter app's launcher icon. pub.dev 3. flutter_launcher_icons.yaml 루트 폴더에 앱 아이콘의 경로 및 기타 정보를 설정하는 yaml 파일을 생성한다. flutter_icons: android: "launcher_icon" ios: tr..

티스토리 댓글 작성 봇 제작 도전&한계 :: python, selenium, webdriver

1. 배경 티스토리 스토리 섹션에서 댓글을 다는 도중 자동화하면 좋을 것 같아서 도전해보았다. 티스토리 댓글을 자동으로 달아주는 봇을 만들면 편할 것 같아서 selenium으로 Python 봇을 만들기로 했다. 2. 코드 python 크롤링할 때 많이 쓰이는 selenium을 사용했고, 크롬 웹 드라이버를 사용했다. 아이디 비밀번호 입력할 때는 pyperclip으로 클립보드에 복사하여 입력하는 방식을 사용했다. (코드 설명은 아래 주석 참고하자) from selenium import webdriver from selenium.webdriver.chrome.service import Service from selenium.webdriver.chrome.options import Options from se..

시스템프로그래밍 :: MallocLab / 말록랩

시스템프로그래밍 과목에서 악명높은 MallocLab(말록랩) explicit을 구현한 후기를 적고자 한다. 해당 과목 수강생 중에 구현한 사람이 1명 밖에 없다고해서 조교님한테 1:1로 코드설명까지 해야했던 과제여서 기억에 남는다. 과제 목적 C로 작성한 동적할당기를 구현하는 것이다. 즉, malloc, free, realloc 함수들을 활용해서 할당 작업 성능을 최대한으로 끌어올려야 한다. 정확하고, 신속하고, 효율적인 코드를 작성할수록 성능 점수는 상승한다. Naive Implicit Explicit Naive, Implicit은 기껏해봐야 66점이 나오는데, Explicit으로 구현했더니 94점으로 거의 1.5배의 성능 향상이 있는 것을 알 수 있다. explicit을 구현하면서 적용하는 알고리즘에..

Flutter :: Appstore 소셜로그인 심사 후기

학기 중이라 바빠서 신경 못쓴 것도 있지만, 거의 한 달간 앱 심사를 여러 번 올리고 애플님한테 리젝당하고.. 돌아보면 많은 것을 배운 시간이었다. 리젝 당한 이유는 소셜 로그인(카카오 로그인, 애플 로그인) 때문이였는데, Google PlayStore (Android)에서 보는 심사 기준보다 깐깐하게 보니 기준에 맞춰 구현하는 것이 중요하다고 할 수 있다. 1. 카카오 로그인 우선 회원가입할 때 이메일을 사용하기 때문에 이메일은 필수로 가져올 수 있어야 했다. (카카오 디벨로퍼스 홈페이지에서 이메일 필수 동의 설정해야 하고, 필수 동의 설정 하려면 사업자 등록 번호 입력해야 됨 -> 이것 때문에 예전에 개인 사업자 등록함ㅋ) 카카오톡이 설치되었으면 별도로 입력하는 것 없이 이메일을 가져올 수 있지만, ..

Flutter 츠누봇 [Pull Request] :: [학식] 페이지 UI 퍼블리싱

Flutter 츠누봇 [Pull Request] :: [학식] 페이지 UI 퍼블리싱 https://github.com/cnu-bot/cnubot-client-app/pull/22 [학식] 페이지 UI 퍼블리싱 by CheolheeLee0 · Pull Request #22 · cnu-bot/cnubot-client-app Describe your changes 영상으로 확인하기 학식 페이지 UI 개발 1. 공통 컴포넌트 설계 cafeteria_button.dart (1, 2, 3, 4학, 긱사, 생과대 식당 선택 버튼) cafeteria_listview.dart (1, 2, 3, 4학, 긱사, 생과대 식당 선택 L github.com 1. 요구사항 - 디자인 참고하여 UI 개발 - 공통 컴포넌트 설계 - ..