![]()
지난번에는, ci / cd를 하기 위해 docker를 github action에 연결하는 작업을 하였다.이번에는 aws ec2에 우리 프로젝트의 정보를 담아주어야 한다.1. EC2 연결을 위해 github action 파일 작성하기 - name: Deploy to server uses: fifsky/ssh-action@master id: deploy with: command: | sudo docker login -u ${{ secrets.DOCKERHUB_USERNAME }} -p ${{ secrets.DOCKERHUB_PASSWORD }} sudo docker pull ${{secrets.DOCKER_REPO}}/front..
![]()
프로젝트를 하면서 정말 계속 수동으로 배포를 하는것에 번거로움을 느꼈다. CI / CD 를 미루고 미루다가 이번에 한 번 제대로 알아보고 적용해보기로 했다. - 프론트 Next.js 사용- 백엔드는 Spring, Nginx 사용- Docker와 AWS EC2 사용 이미 프론트 배포는 한 번 해 놓은 상태라서, 배포 진행 과정은 나중에 정리하고 우선 CI / CD 하는 작업을 정리해보려 한다.1. 프로젝트에 Dockerfile 만들기FROM node:21-alpine AS builderWORKDIR /appCOPY package*.json ./# npm 설치RUN npm installCOPY . .# Next.js를 빌드한다.RUN npm run build#RUN npm run export# 이미지 생성F..
이번에 회사 면접을 보기 전에, 이 회사가 react-query를 사용한다고 하여서, 나에게는 살짝 생소한 상태관리 라이브러리여서 이번 기회에 react-query에 대해 알아보려고 한다. React-Query리액트 애플리케이션에서 서버 상태를 관리하고, 비동기 데이터를 쉽게 처리할 수 있는 라이브러리이다.API로부터 데이터를 가져오고, 이를 캐싱하고, 리프레시하며 로딩 상태 및 에러 상태를 관리하는 등의 작업을 포함한다.복잡한 서버 상태관리를 단순화한다. 설치모든 상태관리 라이브러리가 그렇듯, 터미널로 먼저 가서 패키지를 먼저 설치해줘야 한다. npmnpm install react-query yarnyarn add react-query 전체 설정import React from "react";impor..
https://ko.legacy.reactjs.org/docs/testing.html리액트에서는 테스팅을 할 때특정한 일을 시작해서 걸리는 속도 vs 사용자가 실제로 어플리케이션을 사용하는 환경어디까지를 유닛테스트라고 부르고, 어디까지를 통합테스트라고 부를것이냐.unit은 하나의 단위 -> util 함수, api 서비스 함수 하나하나. 딱 하나의 component통합은 page 컴포넌트, 다른 서비스와 묶어서 api 테스트근데 이걸 딱딱 나누는건 중요한 것이 아니다. Jest는 JavaScript 테스트 러너입니다. DOM에 접근하게 하는 jsdom을 통해서 jsdom은 단지 어떻게 브라우저가 작동하는지에 대한 대략적 개요입니다. 하지만 이는 종종 React 컴포넌트를 테스팅 하기에 충분합니다. Jest..
Test Driven Development테스트 주도 개발개발 전 테스트 코드를 먼저 작성실패하는 테스트 코드를 먼저 작성한 다음, 테스트가 성공할 정도의 코드를 작성해서 테스트가 성공하면 다시 또다른 실패하는 테스트 코드를 작성하고, 다시 성공하는 코드를 작성하는 방식실패하는 테스트 코드 먼저! -> 그 다음 성공하는 코드를 작성구현 코드의 퀄리티 향상모든 요구사항(목표) 에 대해 점검요구사항 분석 및 이해 -> 설계 -> TDD시스템 전반적인 설계 향상개발 집중력 향상
좋은 테스트 원칙한번 작성된 테스트 코드는 영원히 유지보수 해야 한다. (유지 보수성을 고려)내부 구현 사항을 테스트 하면 안된다. 너무 내부적인 사항까지 테스트하면 힘들다.재사용성을 높이기 (테스트 유틸리티)배포용 코드와 철저히 분리하기. 포함이 되지 않도록.테스트 코드를 통한 문서화테스트 코드의 구조BeforeEach : 각각의 테스트가 수행되기 전에 호출됨BeforeAll : 딱 한번만 호출 됨AfterEach : 각각의 테스트가 수행된 후에 호출됨AfterAll : 모든 테스트가 다 수행 된 다음에 마무리용으로 한번만 호출 됨테스트 안에는object를 생성하고 데이터를 준비하는 준비과정 (Given)준비 과정을 여러개의 테스트에 걸쳐 반복해서 사용한다면, 재사용 할 수 있다면 따로 유틸 함수로 정..
