목록 전체 글 (219)
이롭게 현명하게
목차 들어가며AWS Amplify 배포 과정 [들어가며]멘토링을 진행하면서 배포에 대한 고민을 하게 되었다.처음에는 기능 구현에 집중했지만 서비스를 운영하는 관점에서 바라보게 되었다.이전에 진행했던 프로젝트에서는 Vercel을 사용해 배포를 해본 경험이 있다.Vercel은 설정이 간단하고 Git과 연동하여 자동으로 배포할 수 있다는 장점을 가지고 있어 편리했다. [Next.js] Next.js를 Vercel에 배포하기목차 Vercel이란?Next.js 프로젝트 Vercel에 배포하기환경변수 설정커밋부터 배포까지 : 자동 빌드 확인하기 [Vercel이란?]Next.js는 이미 많은 프론트엔드 개발자들이 선택하는 대표적인 React 프레임워크devyihyun.tistory.com 결과물을 빠르게 확인하..
목차 개발 환경 준비Next.js 프로젝트 생성하기Next.js 실행 Next.js에 대한 개념 설명은 다음 게시글에 작성해 두겠습니다. [개발 환경 준비]Next.js16 버전을 사용하려면 Node.js가 필요하다.최소 Node.js 버전 : 20.9운영체제 : macOS, Windows(WSL포함), Linux https://devyihyun.tistory.com/168 [React] 리액트 시작하기 / 리액트 설치 / 개발환경목차 작업환경 준비하기Node.js 설치하기yarn 설치하기vscode 설치하기git for windows 설치하기리액트 환경설정 리액트 환경을 설치하는 CRA가 2025년 2월 14일에 종료되었습니다.npx create-react-app 대신 vitedevyihyun.tis..
목차 Vercel이란?Next.js 프로젝트 Vercel에 배포하기환경변수 설정커밋부터 배포까지 : 자동 빌드 확인하기 [Vercel이란?]Next.js는 이미 많은 프론트엔드 개발자들이 선택하는 대표적인 React 프레임워크다.서버 사이드 렌더링 (SSR), 정적 사이트 생성(SSG) 같은 기능을 쉽게 구현할 수 있어 성능과 SEO 측면에서도 강력한 장점을 제공한다. 하지만 애플리케이션을 개발했다고 해서 끝이 아니다.실제로 사용자가 접근할 수 있도록 배포하고 이후에도 안정적으로 서비스를 운영하려면 배포 환경과 자동화된 배포 파이프라인(CI/CD)이 필요하다.이때 Vercel은 Next.js를 만든 팀에서 직접 제공하는 호스팅 플랫폼이다.별도의 서버 설정이나 복잡한 빌드 과정 없이도 손쉽게 프로젝트를 ..
목차 CI/CD란 무엇인가?CI/CD 파이프라인 구조환경별 배포 전략 [CI/CD란?]CI/CD는 애플리케이션 개발에서 배포까지의 모든 단계를 자동화를 통해서 조금 더 효율적이고 빠르게 사용자에게 배포할 수 있도록 하는 것을 말한다.기업에서는 시장과 고객의 요구를 빠르게 분석하고 반응해야 하기 때문에 제품을 출시, 업데이트할 것인지가 가장 큰 과제이다.프로젝트 규모가 커질수록 단순히 코드를 작성하는 것보다 코드가 안정적으로 동작하고 빠르게 배포되는 것이 중요해진다.그래서 많은 기업들이 CI/CD 프로세스를 사용하고 있다. 지속적인 통합개발자가 작업한 코드를 저장소에 Merge 하고 자동으로 빌드 및 테스트를 실행해 코드 품질을 보장하는 과정이다.기본 과정개발자가 코드 커밋 → 버전 관리 시스템(Git ..
목차 Firebase란?Firebase 프로젝트 생성하기Firestore 데이터 생성하기Next.js에서 Firebase 연동하기Firestore 데이터 가져오기API Route 구성하기(/api/board)클라이언트에서 데이터 호출하기전체 구조 흐름 정리 [Firebase란?] Firebase는 구글이 운영하는 백엔드 서비스로 애플리케이션에서 공통적으로 사용하는 백엔드 기능을 모아놓은 플랫폼이다.웹, 앱 프로토타입이나 MVP 제품을 만들어야 하는 상황이라면 좋은 서비스다. Firebase에는 Authentication이라는 서비스가 있다.사용자 인증에 대한 서비스로 로그인, 회원가입, 비밀번호 찾기와 같은 인증과 관련된 서비스를 간단하게 개발할 수 있다.사용자의 데이터를 저장하거나 조회할 수 있는 F..
목차postman이란?postman 설치postman 사용방법postman에서 토큰 등록하는 방법 [Postman이란?]Postman은 개발자가 만든 API를 테스트하고 테스트 결과를 공유하여 API 개발의 생산성을 높여주는 도구이다.API 테스트뿐만 아니라 설계, 관리를 할 수 있도록 지원하고 있다.REST/SOAP/WebSocket 등 다양한 프로토콜 지원과 모의 서버 생성 기능을 제공한다. 요청(Request) : GET, POST, PUT, DELETE 등 다양한 HTTP 요청을 실행환경(Environment) : API 주소, 토큰 등을 변수로 관리Collection : 여러 API 요청을 하나의 프로젝트로 묶어 관리Script : 테스트 코드나 pre-request 스크립트 작성Mock Se..