"자동화는 귀찮음을 줄이기 위한 고도의 귀찮음이다.” 단순한 스크립트 한 줄부터, nginx의 루트 경로, docker volume 마운트, 그리고 마지막 curl 헬스 체크까지작은 시행착오 속에서 쌓아올린 CI/CD 구축기를 공유해보겠습니다.요즘은 많은 프론트엔드 개발자 분들이 Vercel을 활용해 배포하는 것이 일반적입니다. 배포가 편리하고 깃헙 연동이 쉽다는 장점 때문에 다들 많이 채택하고 있는 것 같아요. 저희 팀은 익숙하고 손쉬운 기술을 계속 사용하는 것에 그치지 말고 다른 기술들을 경험해보고 성장해보자는 의견이 많았습니다. 그런 고민 끝에, Vercel 이 정말 장점만 있을까 좀 더 톺아보았어요. Vercel은 호스팅 인프라가 퍼블릭 클라우드에 위치하기 때문에 망 분리된 내부 환경에서는 배..
🤔 모놀리식 아키텍쳐란 ? 개념모놀리식 아키텍처는 하나의 코드 베이스를 사용하여 여러 비즈니스 기능을 수행하는 전통적인 소프트웨어 개발 모델입니다. 모든 기능이 하나의 프로젝트 내에서 tightly coupled(강하게 결합)되어 있으며, 하나의 애플리케이션으로 배포됩니다.예를 들어 Java로 작업할 때, 전체 애플리케이션은 단일 코드로 작성되어 단일 데이터베이스에 연결됩니다. 그래서 모놀리식으로 개발한 애플리케이션은 마이크로서비스 아키텍처보다 구현이 쉽고, 덜 복잡하다는 장점이 있습니다. 모놀리식 아키텍쳐의 장점 ✅ 간단한 개발 및 배포모든 코드가 단일 코드 베이스에 있습니다. 변경 사항이 발생할 경우 필요한 모든 코드가 한곳에 존재한다는 의미로.,애플리케이션을 로컬에서 실행해야 할 경우 단일 애플..
해당 글은 Vite 프로젝트를 Next.js 로 마이그레이션 하기 위해 거쳐야 할 단계를 소개합니다.제가 겪었던 오류도 포함하여 구성이 되어 있습니다.SOPT 35기 앱잼에서 만든 Cocos 프로젝트에 적용하는 내용을 생생하게 담은 글입니다. Upgrading: Migrating from Vite | Next.jsLearn how to migrate your existing React application from Vite to Next.js.nextjs.org넥스트 공식 페이지 내용을 가져왔습니다. 우선 궁금할 수 있는 내용부터 소개해보자면,🤔 왜 잘 구현된 React 프로젝트를 Next.js 로 전환할까? 기존 cocos 프로젝트는 react 용 기본 Vite 로 빌드하고 있습니다. 순전히 ..
📌 개발 환경Vacgom 프로젝트는 Web App 플랫폼이고, 저는 Web 을 담당하여 개발하고 있습니다.App 은 Flutter 로 개발하고 있으며, Web 에서는 bridge 로 연결하여 연동작업 이어가고 있습니다.로그인(카카오) - App약관동의 - Web회원가입 플로우 - Web회원가입 완료 후 홈 이동 - App이렇게 플로우가 진행이 되기 때문에, 회원가입 테스트를 위해서는 App 에서 화면을 띄워서 테스트가 필요했습니다.-> 카카오 로그인 후 나오는 registerToken 이 회원가입 완료 api 연동시 필요하기 때문. registerToken 은 다음과 같이 앱에서 가져오고 있습니다. const bridge = useVacBridge(); const registerToken = bri..
컴포넌트 만들 때, props 로 자주 등장하는 "..." 에 대해 더 깊이 알아가보려 합니다 ES6에서는 '...' 다소 특이한 형태의 문법이 추가되었습니다.이 표시는 Spread Operator(스프레드 오퍼레이터, 스프레드 연산자, 전개 구문, 펼침 연산자...)를 나타내는 것으로,배열, 함수, 객체 등을 다루는 데 있어서 매우 편리하고 재미있는 새로운 기능을 제공합니다. Spread Operator 기본 문법 스프레드 연산자를 사용하면 배열, 문자열, 객체 등 반복 가능한 객체 (Iterable Object)를 개별 요소로 분리할 수 있습니다. 배열에서의 spread 연산자 1️⃣ 배열 병합기존에는 두 배열을 하나의 배열로 병합하려고 한다면, concat 메서드를 사용하여 병합했습니..
