뒤로가기뒤로가기

데일리 랩스

성장하기 위한 개발자에게 꼭 필요한 과정

프로젝트를 객관적으로 바라보기

데일리펀딩

 

눈 깜짝할 새에 프로젝트는 마무리되어 가고 있었다 👀

진행 중인 프로젝트의 큰 기능들은 대부분 구현을 완료하였기에 다음 작업 전까지 코드 개선과 리팩토링을 고민하는 시간을 가지게 되었고, 이에 대해 정리해보려 한다.


# 내가 짠 코드 개선해보기

이전엔 React와 Typescript를 공부해보고 알아가는 연습을 했다면, 이후엔 내가 작성한 코드를 복습해보면서 더 효율적이고 최적화하기 위해 고민할 시간이 필요하다고 생각한다. 처음 구현할 때부터 좋은 코드를 작성할 수 있다면 '굳이?' 일 수 있겠지만, 점점 더 성장하기 위해서는 개발자에게, 그리고 배우고 있는 나에게는 꼭 필요한 과정이라고 느꼈다. 다행히 민우님께서 테스트 전까지 내 코드를 되돌아보고 개선해볼 수 있는 시간을 주셔서 그동안 구현하면서 효율과 상관없이 짰던 코드들을 살펴보게 되었다.

  • 회원 등록 코드 리팩토링해보기
    회원 가입을 관리하는 코드 중 일부이다. 이전에는 아래와 같이 회원 가입 폼에 넣어야 하는 필드들에 대해서 <FormControl>라는 태그를 동일한 구조로 각 10줄씩 6개나 작성했었다. 분명 짧게 코드를 작성할 수 있다고 생각(..)은 했지만, 최적화하는 작업은 좀 미루고 있었다 😂


코드 개선 사항

  • 필드 값 배열로 관리하기
    • 유사한 구조의 코드들이기에 각 필드들의 속성과 값들을 배열로 관리하였다.
img
  • inputList배열을 map을 이용하여 반복해서 리턴해주는 형태로 코드를 개선하였다.
img
  • 에러 창 띄우기
    • 회원 등록 폼을 제출하고 나면 서버에서 각 필드의 조건을 확인해서 오류가 있을 시, json형태의 에러 데이터를 전송해준다. 에러 데이터는 아래와 같이 오류 필드를 모두 함께 보내주기 때문에 error state에 저장해두었다.
  • error에 값이 존재할 경우, 즉 에러가 발생했을 경우 어떤 필드가 오류인지 확인한 후, error속성을 추가해주고 에러 메시지 창을 띄워줄 수 있게 했다.
img
  • 초대 코드 자동으로 넣어주기
    카카오톡으로 사용자가 공유한 url을 통해 들어오면 자동으로 초대코드가 기입된다. 코드를 수정하기 전엔 제대로 작동했었으나, 수정하고나서 문제가 생겼었다. 모든 필드에 동일한 값이 입력되거나, 작성한 값들이 제대로 서버에 전송되지 않거나..
    • 방법은 간단했다. 초대 코드 필드인 ucodeInput를 return할 때에 공유된 url인지 여부를 확인하여 필드에 값을 채워주는 것.
    • 문제는 동적으로 속성을 추가해주는 방법을 몰랐다. 위의 error처리 시와 같은 방법으로 하려 했으나, Input필드의 value속성을 추가하는 것이기에 값이 존재하지 않으면 필드의 값들이 false로 채워지는 문제가 생겼다.
    • 구글링을 한 결과 동적으로 속성을 추가해주는 방법을 이용하여 다음과 같이 해결할 수 있었다.
img

참고 블로그 (클릭)

 

 

# 프로젝트를 객관적으로 바라보는 것

1. 매뉴얼 작성
이 때부터 하나둘씩 안 보이던 곳에서 수정해야 할 부분이 쏟아져 나왔다. 매뉴얼 작성을 하다 보니 '이건 사용자 입장에서 불편하겠다', '에러 이유를 사용자한테 알려주는게 좋겠다'하면서 지연님과 왠지 모르게 지금까지 가장 열정적🔥으로 참여했다. 아무래도 내부 공유를 통해서 실제로 테스트가 있을 예정이라는 민우님의 말씀에 사용자 입장에서 더 신경을 쓰며 작업을 진행한 것 같다.

2. 테스트 진행하기

드디어 프로젝트를 객관적으로 확인해보는 시간! 전공 수업에서 테스트 케이스를 작성했던 경험이 있어 반가웠다. 내가 구현한 기능을 확인해보는 간단한 테스트 같지만, 굉장히 중요하다. '되겠지'라는 안일한 생각으로 오류 없이 다 구현해냈다고 생각할 수 있지만, 생각지도 못했던 부분에서 오류가 발생할 수 있기 때문이다.

매뉴얼 작성을 하면서 개선해야 할 코드 수정 완료 후 지연님과 함께 마지막 테스트를 진행했다. 테스트 코드는 따로 작성하지 않았고, 매뉴얼과 여러 테스트 케이스에 따라 꼼꼼히 실행해보며 테스트를 진행했다. 혹시나 했지만 역시나 테스트를 하면 할수록 '이건 좀 더 수정하는 게 낫겠다' 하다 보니 엑셀이 내 얼굴처럼 빨갛게 익어가고 있었다.😳

img
img

 

 

오늘의 주저리주저리

인턴 생활을 거의 3개월 가까이하면서 혼자 공부할 때보다 훨씬 많은 것을 배워가고 있다고 느낀다. 개발이 내 적성에 맞는다는 생각도 들었고, 여러 좋은 개발자님들을 통해 새로운 것을 배워갈 때나 고민한 것에 대해 무언갈 알아갈 때의 재미와 뿌듯함이 있다. 최근에는 진행해온 프로젝트를 배포하게 되어 칭찬을 받기도 했었다. 

img

 

다만 요새 가끔씩 나를 조금씩 갉아먹는 고민거리는 나름 꾸준히 개발 공부를 해오고 있지만, 실력이 늘고 있는지 모르겠다는 점이다. 고등학교, 대학교를 다닐 때까지만 해도 누군가 나의 실력에 대해 평가해 주었지만, 인턴 생활을 하면서 누군가 '넌 지금 80점이야, 조금 더 노력해', '실력이 좀 늘었네, 85점이야'라고 해줄 수 없는 일이라는 것을 알기에 가끔씩 그런 고민이 들게 되는 것 같다. 누군가에게 평가를 받고 싶다는 의미는 아니지만, 불안한 것은 결국 노력이 부족한 것이라는 것을 누구보다도 잘 알고 있고, 나 자신에게 요즘 실망스러운 부분들이 생기다 보니 나를 더 옭아매게 되는 것 같다. 그런 걱정이 생길 때마다 주위에서 응원해 주는 사람들을 생각하며 내일은 더 열심히 해야지 다짐하면서 하루를 마무리하는 것 같다.

점점 더 더워지는 날씨, 앞으로 남은 한 달간은 이런 고민을 해결하기 위해 나 자신에게 후회되지 않는 시간이 되었으면 좋겠다. 화이팅! 👊🏻

 

우리는 매일 금융의 각을 넓혀가는
데일리언입니다.

데일리언과 함께하기 >