728x90 반응형 분류 전체보기362 내가 프론트엔드에 클린 아키텍처를 도입한 이유 Backgrounds정부 지원사업 과제 프론트엔드 파트 총괄을 맡게 되면서,기존 서비스들을 개발하며 느낀 문제점들을 더는 답습하지 않겠다 라는 자그마한 목표를 세웠습니다. Existing Problems제가 느꼈던 기존 프론트엔드 프로젝트들의 문제점은... 한 문장으로 요약이 가능합니다.→ 어느 순간부터, 프로젝트를 유지보수하기가 지나치게 어려워진다는 것!시간이 지날수록 제품의 유지보수가 어려워지는 이유는 무엇일까요? 자동화 테스트의 부재간단합니다. 기존 코드를 수정했을 때 애플리케이션이 정상 동작하는지 보장할 수 없기 때문이죠! 코드 수정으로 인해 기존 동작에 오류가 발생했다는 사실을,코드를 작성한 뒤 1초 만에 알 수 있다면 어떨까요?코드를 변경하고 새로운 기능을 추가하는 일이 그리 어렵지만은 않을 .. 2024. 6. 12. 24.06.02~24.06.09 업무TIPS - 챗봇 애플리케이션 기능 개발지난주 설계한 챗봇 애플리케이션을 구현했습니다. 프론트엔드 작업은 예상했던 1주일 만에 얼추 마무리가 되었고,다음 주부터 백엔드와 함께 API 연결까지 진행할 예정! 정기 결제 배포 및 버그 픽스정기 결제 기능을 배포했습니다. 회고바닥은 견고해야한다.앱의 경우, 창업 초창기 때부터 이어진 레거시 코드들이 잔뜩 쌓여있었고...덕분에 개발하기도, 디버깅하기도 쉽지 않았습니다. 특히나 오랜만에 TS가 아닌 JS로 코드를 작성하다 보니TS에서는 컴파일 전에 잡아낼 수 있던 사소한 오류들이, 런타임 에러로까지 이어지는 끔찍한 상황을 종종 맞닥뜨렸습니다. 거기다, 명확한 설계 없이 그때 그 때 상황에 맞춰 각 모듈들을 작성하다 보니...각 코드들을 무엇을 의미하는지, 어떤.. 2024. 6. 10. [jest] mock.calls를 통한 mock 함수 실행 테스트 개선하기 Backgrounds주입한 모듈 메서드의 실행 여부를 테스트해야 할 때가 있습니다.주로 실제 구현은 사용처에서 이뤄지고, 단위 테스트에서는 인터페이스에만 의존하는 모듈을 테스트할 때 발생하죠. 예를 들어 주문을 생성하고, 알람을 띄우는 함수를 테스트할 수 있습니다.// makeOrder.test.tsimport makeOrder from './makeOrder.ts'describe('주문 생성 use case 테스트', () => { it('주문 생성 시, 해당 제품의 주문 완료 알람이 뜬다', () => { })} 해당 함수는 다음과 같이 구현할 수 있습니다.// makeOrder.tsconst makeOrder = (product:Product, notification:NotifyServic.. 2024. 6. 4. 24.05.26~24.06.02 업무TIPS - 챗봇 애플리케이션 설계R&D 과제를 수행했다.해당 과제는 크게 1) 추천 알고리즘 개발 2) 챗봇 구현 및 기존 앱과 연결 로 나눌 수 있는데1)은 작년에 얼추 마무리가 지어 둔 상태라, 2)를 맡아 작업하게 되었다. 약 3일 정도 애플리케이션을 어떻게 설계할 것인가 에 대해 고민했고,(다양한 방법을 구현했다 지웠다를 반복하다...)최종적으로 domain - application - adapter 로 각 계층의 역할과 책임을 분리하는 구조(헥사고날 아키텍처)를 도입했다. domain과 application 로직 작성을 완료하였고,다음 주부터 각 모듈들을 사용해 본격적으로 next js로 구성한 view 로직을 구현할 예정! 정기 결제 테스트 및 배포정기 결제 BE 개발이 완료되어 stag.. 2024. 6. 3. [jest] spyOn 사용 시 Cannot redefine property 에러 해결하기 Backgoundsjest를 사용해 unit test를 작성하고 있습니다. 테스트 대상 모듈이 올바르게 동작하는지를 확인하기 위해해당 모듈이 내부적으로 의존하고 있는, 다른 모듈의 반환값을 테스트 구문에서 제어할 필요가 있었습니다.→ jest의 spyOn API를 사용해 구현할 수 있습니다. https://jestjs.io/docs/jest-object#jestspyonobject-methodname The Jest Object · JestThe jest object is automatically in scope within every test file. The methods in the jest object help create mocks and let you control Jest's overall .. 2024. 5. 30. 24.05.19~24.05.26 업무정기 결제 구현tosspayments를 통한 정기 결제 기능을 구현했다. 웹뷰를 통해 tosspayments 결제창을 띄워 카드 정보를 입력받고,customer key와 billing key를 저장한 뒤server에서 chron 작업을 생성해 매달 정해진 주기로 결제가 이뤄지도록 했다. 워낙에 공식문서가 잘 되어있고, API 사용법이 간단해 크게 어렵지 않게 구현할 수 있었다.앱 웹 간 통신 역시 이전에 작업해 둔 모듈이 있어, 쉽게 마무리! 다음 주 서버 작업이 완료되면, 통합 테스트를 진행할 예정이며카드사 심사가 끝나면 실제 client key로 테스트 후 마무리 할 계획이다. 멤버십 관련 권한 적용정기 결제를 통해 멤버십 권한을 획득한 사용자에게만특정 기능(알림톡)을 사용할 수 있도록 앱 내 .. 2024. 5. 27. 소프트웨어 장인 정신 이야기 (5) 2부. 기준기준은 기본적인 '기대 수준'이다. 이는 우리가 지켜야 한다고 정한 기준선이다. (...) 기준을 능가하는 건 상관없지만 절대 그에 못 미쳐서는 안 된다. 9장. 생산성여러분의 CTO로서 나는 생산성에 있어 몇 가지를 기대한다.- 나는 절대 똥덩어리를 출시하지 않기를 기대한다- 나는 낮은 수정 비용을 기대한다- 나는 우리가 언제나 준비되어 있기를 기대한다- 나는 안정적인 생산성을 기대한다 10장. 품질여러분의 CTO로서 나는 품질에 있어 몇 가지를 기대한다.- 나는 지속적인 개선을 기대한다- 나는 두려움을 이기는 능력을 기대한다- 나는 극한의 품질을 기대한다- 나는 우리가 QA에게 떠넘기지 않기를 기대한다- 나는 현실적으로 자동화 가능한 모든 테스트가 '자동화되기를' 기대한다 자동화 테스트와 .. 2024. 5. 25. 소프트웨어 장인 정신 이야기 (4) 5장. 리팩터링더보기리팩터링은 동작을 바꾸지 않으면서 코드를 연속적으로 조금씩 바꿔서 소프트웨어의 구조를 개선하는 것인데, 각 변경을 마무리할 때마다 포괄적인 테스트 묶음을 통과시킴으로써 동작이 바뀌지 않았음을 증명한다.여기서 핵심은→ 1) 리팩터링은 동작을 보존한다 2) 개별 리팩터링은 작다. 디버깅이 필요하지 않을 만큼! 기본 도구이름 바꾸기무언가의 정확한 이름을 찾는 일은 연속적이고 반복적인 개선 과정인 경우가 많다. 정확한 이름을 추구하는 일을 두려워하지 말라. 프로젝트가 아직 초기일 때 가능한 자주 이름을 개선하라. 좋은 이름 짓기는 정말 어렵다!!이때 기억하면 좋을 교훈은 → 연속적이고, 반복적인 개선을 통해 최선의 이름을 찾을 수 있다는 것.따라서 변경을 두려워하지 말아야 한다. 지속적으로 .. 2024. 5. 23. 24.05.12~24.05.19 업무결제 관련 설계이전 서비스에 정기 결제 기능이 들어가면서, 결제 관련 DB 및 구현 방식을 설계했다. 변경된 DB 기준, 가이드 진행 방식 기능 개발지난주 가이드 관련 DB가 변경되면서,변경된 데이터를 통해 가이드가 실행될 수 있도록 수정해야 했다. 공통 모듈 이외의 대부분 요소들에 변경이 발생하면서,이전 코드를 작성할 때 아쉬웠던 1) 테스트 코드 없음 2) 불필요한 상태 의존 발생 을 개선하는 것에도 초점을 맞춰 작업했다. 회고비우고, 다시 담기사실 이번 주는 이틀 밖에 출근하지 않았다. 공휴일 + 이틀 연차 를 사용해 일본으로 여행을 다녀왔는데...휴가 기록을 보니, 볼 일이 있어 반반차를 두 번 사용한 것 빼고는 이번 연도 첫 휴가였다!(물론 작년 말 다리 수술로 인해, 일주일을 통으로 출근하.. 2024. 5. 20. 이전 1 ··· 3 4 5 6 7 8 9 ··· 41 다음 728x90 반응형
