본문 바로가기

반응형

프로젝트/잔소리

(11)
잔소리 프로젝트 마무리 잔소리 프로젝트란?쟌소리 프로젝트는 구글 애드센스 API 를 기반으로 애드센스에서는 제공하지 않는 보고서 알림에 대한 불편함을 개선하기 위해 시도한 메일링 서비스를 만들어보고자 시도했던 프로젝트 입니다. 순전히 개인화된 프로젝트 였기에 실제 사용자를 받아볼 생각은 없는 방향으로 진행되었습니다(퀄리티 자체도 실제 서비스하기에는 부족했구요). 데스크톱  모바일 사용된 기술스택전반적으로 사용한 스택 부분에서는 NextJS14, PostgreSQL+ Prisma + GCP Cloud SQL 으로 개발하고, GCP Cloud Run  을 통해 도커 컨테이너 방식으로 배포하는 방향으로 갔습니다.  이번 프로젝트에서 시도해 보고자 했던 것해당 프로젝트는 순전히 스케줄링을 통해서 사용자가 등록한 보고서 옵션과 일정에 ..
NextJS 도커 배포하기(GCP Cloud Run + Cloud SQL+Postgresql + prisma) [들어가기 전] Cloud Run 배포 많은 배포 방식 중 이 방식을 선택한 이유는 특정 환경에 제한되지 않고 도커 컨테이너화 된 애플리케이션을 어떤 환경에서든 동일한 조건으로 배포할 수 있다는 점,  Cloud Run 의 자체적인 인스턴스 확장 및 축소 기능을 통해 과도하게 몰리는 트래픽 문제나 그에 따른 유지보수 문제 등을 서버리스 방식으로 자동으로 완전 관리할 수 있다는 장점이 돋보였기 때문입니다. 따라서 이번 포스트는 Cloud Run 과 Cloud SQL 을 사용하여 NextJS 프로젝트를 배포하는 시간이 되겠습니다.이미 많은 부분이 GCP 문서에서 자세하게 다루고 있기 때문에, 너무 과정이 생략되어 알아보기 힘들고, 찾아보기 힘든 부분만 별도로 정리하며, 나머지는 링크를 달아두는 형식으로 정리..
[잔소리 프로젝트] 🤔 현재 경험하고 있는 애로사항과 앞으로의 방향성 시작 전, 잔소리 프로젝트 간략 소개(간략 소개) 잔소리 프로젝트는 구글 애드센스의 수익 관련 통계 보고서의 복잡한 인터페이스와 수동으로 보고서 옵션을 설정 후 관리해야 하는 불편성을 개선하기 위해 시작된 작은 프로젝트 입니다. 물론 해당 프로젝트가 모든 것을 자동화하지는 못하지만, 처음 한 번만 간단하게 설정해두면, 나머지는 알아서 최신 보고서 데이터를 자동화하여 받아볼 수 있는 것이 차별점 입니다.  (개발 기간) 개발 기간은 2024.07.09 ~ 2024.08.05 로 약 1달 가량 진행이 되었고, 개인 사정으로 지연된 시간을 제외한다면 실제 개발 기간은 3주 정도 작업을 한듯 합니다. 비고) 약 1주 정도 크론 작업이 정상적으로 동작하는지 보기위해 테스트 배포 기간(why? 메일 알림을 등록하는..
[잔소리 프로젝트] 24.07.30 ~ 08.01 진행 사항 점검 현재 기능의 구현 정도 점검 2024.07.09 에서 개발을 시작하여 27일이 되었는데, 여기까지 개인 사정으로 개발을 자주하지 못해서 대략 10일 정도  작업을 한 것 같습니다. 이번 시간을 통해 약 10일 동안 현재 구현된 부분을 정리해보고 앞으로 방향성에 대해서 정리해볼까 합니다.  알림 설정보고서 옵션 설정사용자가 맞춤형 보고서를 받아볼 수 있도록 알림을 등록하기 전에 여러 옵션을 리스트화 하여 확인할 수 있는 기능을 도입하였습니다. 여기서 보고서 옵션의 형식은 애드센스에서 조회할 수 있는 다양한 옵션 중 일반적으로 광고 수익의 정도를 판가름하는 데 사용되는 주요 옵션을 select 태그를 사용해 선택할 수 있도록 하였습니다. NextJS 14 버전을 사용하고 있기 때문에 최대한 클라이언트 측에서..
[잔소리 프로젝트] 쉬어가는 챕터 - 현재 진행사항과 방향성에 대한 고민🤔 해당 프로젝트는..현재 프로젝트는 NextJS 14.2.4 버전을 기준으로 서버리스 아키텍처 기반으로 백엔드와 프론트엔드를 통합하여 진행하고 있습니다. 해당 프로젝트는 애드센스 수익 계산을 자동화하고, 이를 쉽게 원화로 변환하여 세금 신고 절차를 단순화시키는 것이 목적이며, 이러한 서비스를 제공하는 것을 주요 포인트로 잡고 있습니다. 참고로 이 글은 매우 짧으며 영양가 있는 글은 아니므로 혹여나 보셨다면, 뒤로 가기 하셔도 무방합니다.   현재, 수익 통계현재 까지 연도별로 수익통계를 확인할 수 있도록 작업이 완료되어 있고, CSV 파일 형태로 수익정보를 보고서 형태로 확인할 수 있도록 간단하게 구현이 되어 있습니다. 보다 많은 편의성을 위해 조금씩 추가할 예정이지만, 현재 까지는 빠른 배포 및 테스트를..
[잔소리 ] 트러블 슈팅 해당 포스트는..해당 포스트는 프로젝트를 진행하면서 경험한 다양한 문제들과 이를 개선하는 과정를 정리한 포스트 입니다. 모든 이슈를 정리하지는 않으며, 사이사이에 해결하기가 까다롭고 어려웠던 문제 위주로 선별하여  개인 참고 및 동일한 문제를 경험하는 분들에게 도움을 드리고자 작성합니다.원래 기존의 트러블 슈팅 작성 방식과 다른 방식으로 수정하였습니다. 이전 방식의 문제점은 가독성이었는데, 이를 조금 더 보기 쉬운 방식으로 수정하였습니다. [중복 DB 인스턴스] Unix 소켓을 통한 Cloud SQL 연결 시 5432 포트 활성화 문제(24.08.17)[요약] 중복 인스턴스가 생성되지 않도록해당 문제의 원인은 결국 5432 포트를 사용하는 인스턴스를 중복으로 여러 개 생성하려고 할 때 포트 충돌이 발생한..
[잔소리 프로젝트] 쉬어가는 챕터 - 생각보다 쉽지 않은 상황 들어가는 말이번 시간은 좀 쉬어가는 챕터 형식으로 현재 어떤 부분이 문제가 되고 있는가, 어떻게 개선해 나갈 것인가 등을 고민해보는 시간을 가져볼까 합니다.  오직 개발에만 집중하고 싶은데, 현실적인 부분을 고려하지 않을 수 없어서 최대한 시간을 절약해 가면서 개발 중인데요. 그 외에도 개발적인 부분에서 어떤 부분이 어렵게 다가왔고, 고려중인 부분인지 정리해볼까 합니다. 생각 보다 쉽지 않은 API 연동생각 보다 애드센스 API 를 사용하여 필요한 데이터를 가져오는 과정이 순탄하지 않습니다. 너무 만만하게 보았던 것인지, 애드센스 API 를 NextJS 환경에서 직접적으로 다루는 기술 블로그도 찾을 수 없고, 참고할 만한 자료도 파이썬이나 PHP 를 사용한 예시만 있어서 오직 단편적인 방식으로 제공되어 ..
[잔소리] TailwindCSS 를 이용한 다크모드 구현 TailwindCSS 를 이용한 다크모드우선 현 프로젝트는 대시보드 형태로 만들기 때문에, 다크 모드 테마 기능을 지원하여 사용자로 하여금 콘텐츠에 집중할 수 있는 환경을 제공해주는 것이 좋다고 판단하여 추가된 기능입니다.  tailwindCSS 에는 다크모드를 구현하기 위한 예제를 제공해주고 있습니다. 기본이 되는 예제는 다음과 같습니다.// On page load or when changing themes, best to add inline in `head` to avoid FOUCif (localStorage.theme === 'dark' || (!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matche..

반응형