🔴 ETC(24)
-
[test tool 2-2] Jest+React+TypeScript - 이미 개발된 코드에 unit test를 적용해보자 (+코드 리팩토링은 덤)
이전 글에서 사용자 시나리오 & 테스트 코드 작성에 대해 이야기하였다,이 글에서는 3번 테스트 코드를 활용하여 코드 리팩토링을 한 경험에 대해 써보고자 한다!기존 코드 & 기획서를 참고하여 사용자 시나리오를 작성한다.테스트 코드를 작성한다.테스트를 돌려보며 안전하게 코드 리팩토링를 한다.총 3개의 테스트 파일이 있고, 이는 시나리오대로 나눈 것이다.모든 파일에 대한 테스트를 돌려보면 아래와 같이 나온다 (all passed!)2개 이상에서 똑같이 쓰이고 있는 코드가 있는데, 이를 공통 컴포넌트로 빼서 코드 리팩토링을 하려고 한다.원래 같았으면 코드수정을 한 뒤, 하나하나 눌러보며 UI 테스트를 했었는데,간단한 화면이면 테스트도 금방 끝나겠지만 이번엔 유저 이벤트에 따라 체크해야 하는 사항이 워낙 많은 화..
2023.11.07 -
[test tool 2-1] Jest+React+TypeScript - 이미 개발된 코드에 unit test를 적용해보자 (+코드 리팩토링은 덤)
계기개발하고 있는 화면에서 유저의 이벤트에 따라 체크를 해야 하는 케이스들이 점점 늘어남에 따라 테스트 코드에 대한 필요성을 느꼈다. 화면 내부는 위처럼 크게 4개 컴포넌트로 구성되어 있다. 그리고 컴포넌트 내부에서 발생하는 유저의 이벤트에 따라 다른 컴포넌트에 영향이 간다.예를 들어, component 1에 있는 내용에 따라 component 3에 있는 셀렉박스 선택지가 바뀌는 등..유저의 시나리오가 많아지면서 코드를 수정할 때마다 직접 일일이 테스트해야하는 케이스들이 늘어났다.🥲 (하나하나 눌러보느라 아픈 내 손가락..)테스트 코드 작성에 대한 필요성을 느껴질 때쯤, 아래의 글을 보게 되었다.https://techblog.woowahan.com/8942/ 단위 테스트로 복잡한 도메인의 프론트 프로젝..
2023.11.05 -
[CI/CD적용기3] 프로젝트 build - 로컬 vs Dockerfile vs Github Actions
Github Actions를 사용하기 앞서 세팅해줘야하는 내용은 이전 포스트 참고 2023.09.07 - [🔴 ETC/CICD] - [CI/CD적용기2] Docker + Github Actions으로 배포 자동화 [CI/CD적용기2] Docker + Github Actions으로 배포 자동화 목표 : - Github Actions를 사용하여 CI/CD를 구축한다 - workflow : - build my project -> login to my Docker hub -> build and push my Image - 즉, 빌드한 결과물을 Docker Image로 만들어서 내 Docker Hub으로 push 하는 일련의 작 kkangdda.tistory.com Github Action 코드를 짜다 보니, 프..
2023.09.07 -
[CI/CD적용기2] Docker + Github Actions으로 배포 자동화
목표 : - Github Actions를 사용하여 CI/CD를 구축한다 - workflow : - build my project -> login to my Docker hub -> build and push my Image - 즉, 빌드한 결과물을 Docker Image로 만들어서 내 Docker Hub으로 push 하는 일련의 작업을 자동화한다. (https://kkangdda.tistory.com/121 > 기존에 직접 손으로 했던 내용을 Github Action으로 자동화) 1. Github Action workflow yml파일 생성 자신의 repository > Actions > set up a workflow yourself 를 누르면 .github/workflow 하위에 yml 파일을 작성할..
2023.09.07 -
[CI/CD적용기1] React앱을 Docker Image으로 생성 후 Docker hub에 업로드
목표: - 어플리케이션을 빌드한 결과물을 Docker Image로 만든다. - Docker Image를 내 Docker Hub repository에 올린다. - 로컬 pc에서 Docker Hub에 올린 Image를 pull 받아서 실행한다. 1. React 앱 생성 (create-react-app) 2. 빌드 npm build 3. Docker를 사용하기 위해 프로젝트 루트에 Dockerfile, nginx.conf 파일 생성 Dockerfile # nginx 이미지를 사용합니다. 뒤에 tag가 없으면 latest 를 사용합니다. FROM nginx # root 에 app 폴더를 생성 RUN mkdir /app # work dir 고정 WORKDIR /app # work dir 에 build 폴더 생성 ..
2023.09.07 -
[DVA-C02] AWS Certified Developer Associate 자격증 후기
AWS에서는 위와 같이 단계별로 자격증 시험을 제공하고 있다. 나는 클라우드 도메인에 대한 지식을 쌓기 위해 회사에서 추천받은 AWS Developer Associate 자격증을 준비했다. 참고로 Developer Associate는 최근 DVA-C01에서 DVA-C02로 바뀌었고, 해당 버전의 시험에 대한 후기는 그리 많지 않았다. 하지만 유명한 자격증인만큼 강의도 많고 문제 자료도 많으니 걱정할 필요 없다! 준비기간은 약 1달 반, 출근 전 매일 한 시간씩 공부했고 주말에는 3시간 정도 시간 내서 공부하였다. 참고로 기존에 AWS 운영 경험이 있거나 다른 AWS관련 자격증이 있는 사람이라면 더 수월할 것 같다. (당연한 얘기) 아래와 같이 두 가지 자료로 공부했다 : 1. 유데미 강의 https://..
2023.08.06