우리가 이용하는 이 홈페이지들은 브라우저 에서 실행이 되고 있으며, 브라우저가 없이 코드 만으로는 이러한 화면을 볼 수 없습니다. 렌더링(rendering)은 컴퓨터 프로그램을 사용하여 이미지나 영상을 만드는 과정을 말하는데요. 브라우저에서도 화면에 페이지를 그리기 위해 브라우저가 네트워크를 통해 받은 데이터를 렌더인 ( DOM 과 CSSOM ) 으로 바꾸는 것을 말하며, 이를 곧 화면을 그린다고 표현합니다. DOM 과 CSSOM 을 결합하여 최종적으로 렌더 트리를 통해 화면을 그리는데요.홈페이지에 변화가 일어나게 되어서, 홈페이지의 화면을 달리 그려야하게 되면 브라우저는 이러한 DOM 구조를 처음부터 다시 변경해야하는 구조입니다. Virtual DOM 은 이러한, DOM의 불필요한 계산과정을 줄이기 ..
Next.js 를 실무에서 배포할때 Vercel이나 AWS Amplify 사용하거나 (클라우드 플랫폼 서비스), ECS 또는 EKS (Kubernetes) 사용하는 형태로 (자체 인프라 관리) 트래픽 증가에 따른 자동확장을 통해 관리하곤 합니다. Vercel이나 AWS Amplify는 Next.js와 같은 프레임워크에 최적화되어 있어, 자동화된 배포 파이프라인과 CI/CD 통합이 기본적으로 제공됩니다. GitHub에 코드를 푸시하는 것만으로 배포가 자동으로 이루어집니다. 특히나 Vercel의 경우 빌드 + 배포 + 호스팅 까지 Next.js 에 특화된 기능을 제공하기 때문에, 정적페이지의 경우는 무조건 Vercel 을 이용하는것이 좋다고 생각하고, API 서버가 분리된 경우에도 효과적으로 사용할 ..
모노레포 도입기 모노레포 도입기 (Feat. 실습)모노레포 도입기: 왜, 어떻게, 그리고 결과는?모든 프로젝트에는 확장성, 유지보수성, 그리고 효율성이 중요한 요소로 자리잡고 있습니다. 특히 규모가 커지면 커질수록 이러한 요소들은 점점ineedbentely.tistory.com 를 통해 모노레포를 도입하게 된 계기와 어떤 장점이 있었는지를 언급하였습니다. 모노레포는 여러 프로젝트를 하나의 레포지토리에서 관리하는 방식으로, 이러한 문제들을 해결하는 데 도움이 될 수 있습니다. 이번 글에서는 모노레포 도입의 배경과 실제 구성 과정을 실습을 통해 살펴보겠습니다. 1. 모노레포 도입 배경우리는 패키지 및 서비스 영역으로 나누어 모노레포를 구성할 것입니다. 디자인 시스템을 포함하는 패키지 영역은 npm에 퍼블리싱..
모노레포 도입기: 왜, 어떻게, 그리고 결과는?모든 프로젝트에는 확장성, 유지보수성, 그리고 효율성이 중요한 요소로 자리잡고 있습니다. 특히 규모가 커지면 커질수록 이러한 요소들은 점점 더 도전 과제가 됩니다. 나도 이러한 문제들을 해결하기 위해 모노레포(Monorepo)를 도입하기로 결정했습니다. 이 글에서는 모노레포를 도입한 이유, 그리고 같이 실습해보는 과정을 공유하려고 합니다.모노레포란 무엇인가?모노레포는 여러 개의 프로젝트를 하나의 Git 저장소에 모은 방식입니다. 이렇게 하면 여러 팀이 하나의 코드베이스를 공유하면서도 서로 영향을 덜 받으며 작업할 수 있습니다. 모노레포 방식의 가장 큰 장점은 코드 관리의 일관성과 중앙화된 의존성 관리입니다. 왜 모노레포를 도입했나?우리 팀은 여러 개의 프로젝..
사내 IoT 플랫폼 프로젝트에서 Spring MVC 가 아닌 Spring WebFlux 기반으로 코드를 작성하면서 겪은 시행착오와 도입하게 된 계기에 대해 공유하고자 합니다. 특히 WebFlux 를 도입하면서 자료가 적은 부분에 대해 아쉬웠기 때문에, 다른 참조내용들을 추가하였습니다.WebFlux를 도입하게 된 이유과거 프로젝트 착수 당시 IoT 플랫폼 서버 기술에 WebFlux를 도입하게 된 데에는 여러가지 이유가 있는데요. 우선 가격입니다. IoT 플랫폼 특성상 일별 트래픽이 운영초기부터 적어도 100만 건 이상 발생할 것이라 예상하고 있었고,이로 인해 AWS Auto Scaling Group 을 통해 운영 중인 상태에서 점진적으로 운영 비용이 증가할 것이라 생각하여 리소스를 최적화 하자는 것에서..
함수형 프로그래밍함수형 프로그래밍FunctionalProgramming">𝐹𝑢𝑛𝑐𝑡𝑖𝑜𝑛𝑎𝑙𝑃𝑟𝑜𝑔𝑟𝑎𝑚𝑚𝑖𝑛𝑔은 프로그래밍 패러다임 중 하나로, 순수 함수와 불변성을 강조하며, 프로그램의 상태 변경을 최소화하는 것을 목표로 합니다. 프로그래밍 패러다임프로그래밍 패러다임(Programming Paradigm)은 프로그래머에게 프로그래밍의 관점을 갖게 하고 코드를 어떻게 작성할 지 결정하는 역할을 한다. 새로운 프로그래밍 패러다임을 통해서는 새로운 방식으로 생각하는 법을 배우게 되고, 이를 바탕으로 코드를 작성하게 된다. 최근의 프로그래밍 패러다임은 크게 아래와 같이 구분할 수 있다.명령형 프로그래밍: 무엇(What)을 할 것인지 나타내기보다 어떻게(How) 할 건지를..
2024년 6월 20일 부터 Google Firebase는 기존 FCM v1 API를 통해 모바일 푸시 알림을 전송하는 기능을 제거한다고 발표하였습니다. 현재 google Firebase 를 통해 모바일 알림 서비스를 제공하고 있었기 때문에, API 를 수정해야되는 상황속에서 다른 대체제로 변경하는 것도 고려해보아야 된다고 생각하고 있는 찰나 다른 대표적인 알림 서비스인 Amazon SNS에서 기존 FCM HTTP V1 API를 지원한다는 소식을 듣고 조금 더 여러가지를 고려해 보기위해 SNS 와 FCM 를 비교하는 글을 작성하였습니다.https://firebase.google.com/docs/cloud-messaging/migrate-v1https://aws.amazon.com/ko/about-aws/..
로컬 환경에서 버그 없이 개발을 완료하더라도 실제 서버에서 빌드와 배포까지 마무리 지어야 진정한 개발이 완료됩니다. 젠킨스(Jenkins)을 사용해서 빌드 자동화를 하다가 불편함을 느끼고 AWS CodePipeline을 이용한 배포 환경을 구축하기로 하였습니다. 젠킨스를 사용하는 불편함은 아무래도 젠킨스 서버를 구축해야하고 빌드 배포를 위한 서버를 하나 더 추가로 관리해야 한다는 점입니다. 그에 반해 AWS CodePipeline 서버리스 구조로, 직접 관리하지 않아도 된다는 장점이 있습니다. 실제 작업 시 에만 일시적으로 임시 서버가 실행되어 해당 기간에만 과금이 진행되기 때문에 빈번하게 빌드 배포를 하지 않는 이상, 금액적으로도 부담이 적습니다. 이번 포스팅에서는 AWS CodePipeline을 이용..
