[개발 관련 도움] - deprecated이란? 간단하고 쉽게 이해하기(vs code 미사용 코드 설정, 사용하지 않는 코드 설정, 함수 가로줄, 컴포넌트 가로줄)

🧹 간단 정리

• deprecated 어노테이션을 사용하면 미사용 코드라는 것을 안내할 수 있다.
• 삭제 시 사용 중인 코드에 영향이 가는 것을 방지할 수 있다.
• 함수 및 컴포넌트 사용 시 가로줄을 표시하기도 한다. 
• deprecated의 원어 뜻은 '사용하지 않음'이다.

 

(자세한 내용은 아래에 👀)

---

🙂 서사

개발을 하다 보면 가끔씩 '자동완성' 된 함수나 컴포넌트를 사용했지만

가로줄로 표기된 화면을 경험한 적이 있을 것이다. (아래 사진 참고)

deprecated 예시 이미지

 

Next.js로 (협업) 개발을 하던 와중 내가 만들었던 컴포넌트가 이제 사용하지 않는 경우가 생겼다.

즉 이제 사용하지 않는 코드가 생긴 것이다.

 

뭔가 나중에 또 쓰일 거 같고.. 삭제하자니 마음이 아파오고..

(사실 개발의 유명한 말 중에 하나는 '작성한 코드의 삭제를 두려워하지 말라'라던데..)

 

여하튼! 코드를 삭제를 하지 않고 사용하는 개발자에게 미사용 코드를 안내할 수 있게 하는 기능이 바로 deprecated 어노테이션이다!
(원어 뜻도 '사용하지 않음'이다)

 

바로 실습과 스토리를 섞어서 작성해 보겠다 :)

 

---

 

✍🏻 실습 (코드 작성)

🙋🏻‍♀️ 기획자 : "꼼코더님~ 그 물건 가격, 물건 개수 넣으면 총 가격 반환해 주는 함수 개발해 주세요~"

🧑🏻‍💻 꼼코더 : "네~ 알겠습니다"(뚝딱 뚝딱)

 

아래와 같은 정말 간단한 함수를 만들었다.(우측 : total()를 사용하는 코드)

물건 총 가격 반환 예시코드

 

 

📚 스토리 : 자네 코드는..이제..그만..따흑 🤧 (부제 - deprecated 작성각 떴다)

🙋🏻‍♀️ 기획자 : "꼼코더님~ 지난번에 말했던 로직은 다음 버전부터 제거될 거예요! '사장님 지시로 인하여' 기획에서 제외 됐습니다!"
🧑🏻‍💻 꼼코더 : "흠...이거 이거 또 나중에 사용한다고 기획이 바뀌는 거 아니야? 변화에 대응할 준비를 해야겠어🧐"

 

@derecated 주석 추가!

@derecated 주석 추가 예시

 

 

(사용 코드 화면)

@derecated 주석 확인 이미지

 

👩🏻‍💻 개발자 A  : "뭐야 어제까지만 해도 가로줄이 없었는데 total() 함수에 가로선이 표시되었네!? 마우스를 가져가 보자!"

👨🏻‍💻 개발자 B  : "엥? 다음 버전부터 삭제될 거라고? 얼른 대체 로직을 작성해야겠어!"

 

 

 

🧑🏻‍💻 꼼코더 : "휴 덕분에 total() 함수를 사용하는 곳 모두 내가 수정을 해주거나 안내해야 하는 불편함을 피했다.!"

 

---

💁🏻‍♂️ 마무리

@derecated 주석은 미사용을 안내한다

코드 삭제 시 생기는 여러 불편함(사용 코드 모두 수정 등)을 개선해 준다.

 

🚨 주의사항

@derecated 주석을  작성해도 코드는 정상적으로 동작하니

삭제가 예정되어 있다면 꼭 추후에 삭제를 진행해 주자!