개발조각

회사 프로젝트를 마치고 난 후 느낀점 본문

개발일상✍

회사 프로젝트를 마치고 난 후 느낀점

개발조각 2023. 9. 12. 22:31
728x90
반응형

벌써 회사를 다닌 지 2개월이 지나 3개월을 향해 달려가고 있다.

그동안 두번의 프로젝트를 진행했는데 첫 번째는 랜딩페이지, 두 번째는 반응형 서비스를 작업했다.

두 번의 프로젝트를 진행하면서 느낀 점에 대해 적어보려 한다.


1. 라이브러리를 적극적으로 사용하자

그동안 "내가 직접 만들 수 있는데 왜 굳이 라이브러리를 써야 돼?"라는 생각으로 라이브러리를 사용하지 않았는데

아주 바보같은 생각이었다!!!

그동안 npm 사이트에서 라이브러리 찾는 습관을 멀리하면서 살았던 게 첫 번째 프로젝트 랜딩페이지를 만들면서 아주 강하게 타격받았다.

https://www.npmjs.com/

 

npm

Bring the best of open source to you, your team, and your company Relied upon by more than 17 million developers worldwide, npm is committed to making JavaScript development elegant, productive, and safe. The free npm Registry has become the center of Java

www.npmjs.com

(여기서 라이브러리 이것저것 보는 습관을 들여야 되는데;;;)

 

랜딩페이지를 만들면서 비디오 배경, 스와이퍼, 모바일시에만 적용, 한영번역 등 라이브러리를 사용해야 되는 경우가 생각보다 많았고

"랜딩페이지는 서비스도 아닌 단순 서비스 소개 페이지인데 이거 하나 만드는데도 5~6개의 라이브러리를 사용했는데...

실제 서비스는 얼마나 많이 사용하는 거지...?"라는 생각이 많이 들었다.

정말 라이브러리는 뗄 수 없는 존재구나.. 싶었다.

 

회사 사수분들도 좋은 라이브러리를 사용해야 효율적으로 작업을 할 수 있으니 라이브러리를 적극적으로 사용하는 게 좋다는 말을 많이 해주셨다.

여기서 중요한 점은 좋은 라이브러리를 고르는 눈이 필요한데 조금이라도 고르는 팁을 말하자면

  1. 사용할 스탯이 있는지 확인하기
    • 이번에 주로 react에서 사용할 라이브러리를 찾았는데 react를 지원하는지를 확인을 했다.
      타입스크립트를 사용하시는 분들은 타입스크립트를 지원하는 확인 하면 된다.
  2. 다운로드 수가 많은 것으로 고르기 
    • 사실 이게 0순위이긴 한데 다운로드 수가 많으면 다 이유가 있더라
    • 그리고 내가 알정도로 유명하면 쓰는 게 맞다. (내가 알정도면 엄청 유명한거라 의심없이 쓰는게 좋다.)

이번 계기로 라이브러리를 잘 사용하는 것도 능력이고 장점이라는 생각이 많이 들었다.

 

2. html태그를 조금 더 신경 써서 작업하자 + 어떻게 짜야 기능 붙이는 게 편할지에 대해 한번 더 생각해 보자

사실 신입으로 입사를 하기도 했고, 프로젝트가 다 기간이 짧다 보니 기능은 손도 못 대고 html구조를 짜고 css작업만 했다.

나름 퍼블리셔로 6개월 동안 일해와서 쉽게 할 수 있겠지라고 만만하게 생각했었고, 부트캠프에서도 퍼블을 다해와서 나 정도면 잘하지라는 생각을 가지고 있었는데 진짜 오만한 생각이었고 이런 생각을 했다는 자체가 너무 부끄러웠다ㅠ

 

이게 내가 알고 있는 태그라도 정확하게 알지 않으면 웹접근성에 맞지 않은 구조를 짜게 되는 경우가 자주 발생했고,

제대로 된 구조로 짜지 않아서 사수분께 자주 불려 갔다ㅎㅎ

p태그가 블록인 이유가 있고, span은 인라인인 이유가 있는 것처럼 태그의 속성에 맞게 짜야 된다고 했다.

그리고 구조를 짤 때 이렇게 짜면 기능 붙이기 쉽게 짜야 된다고 했다.

그러면서 컴포넌트도 잘 나눠야 되고 컴포넌트도 생각하면서 짜야 된다는 말을 자주 해주셨다.

 

3. css를 작성했을 때 공통으로 사용되는 것과 개개인으로 사용될 스타일을 잘 구분해서 사용하자

그동안 혼자 짜다 보니 혼자 결정하면서 짜서 css 공통화도 내 맘 데로 했었는데

이번에 다 같이 짜다보니 내맘데로 짜는 습관 때문에 css 꼬임현상이 생겨 css를 고치는 시간이 자주 있었다.

그래서 className을 지을 때나 다들 쓸 것 같은 className은 주의하면서 사용해야 된다.

 

결국 html, css는 많이 하면 할수록 느는 것 같다

 

4. 백엔드에서 전달받은 데이터를 확인할 때 API문서만 확인하지 말고 개발자 도구 네트워크에 가서도 확인해라

데이터가 어떻게 왔는지 확인할때 (이미 작업한 거에서 추가적으로 작업해야 될 때)

개발자 도구에서 네트워크에 가서 확인해야 된다.

내 생각에는 그래야 콘솔을 찍지 않아도 알맞은 데이터가 왔는지 확인할 수 있다.

 

5. 공부를 열심히 하자(가장 중요!!!)

5년 차 프론트엔드 개발자께서는 최적화가 가장 중요하다고 했다.

프론트는 화면만 만들고 데이터만 받으면 되지 하는데 이것만 하는 건 코더라고 생각하고 최적화에 대해 고민을 많이 해야 진정한 개발자라고 생각한다고 했다.

그러면서 개발공부 많이 많이 하라고 하셨다.

 

리액트의 구조? 렌더링 되는 방식? 특징? 훅에 대해 공부를 해야 된다고 했다.

일단 리액트 훅은 당연히 잘아야 되는 거고 useMemo를 사용해 보면서 최적화에 대해 공부해야 된다고 했다.

그리고 리액트의 구조? 렌더링 되는 방식 등에 대해 잘 알아야 데이터를 받았을 때 이때는 되고 안되고 렌더링 부분 여부에 대해 알아야 된다고 했다.

만약 리액트의 특징에 대해 잘 모르면 "데이터 값이 나와야 되는데 왜 안 나오지?" 하는 경우가 자주 발생한다고 한다.

 

자바스크립트 비동기에 대해서도 공부를 많이 해야 된다고 했다.

신입을 보면 가장 못하는 것 중 하나가 데이터에 대한 분기처리를 제일 못한다고 했다.

상황에 따라 데이터를 async, await를 써야 좋은 경우가 있고, promise을 써야 좋은 경우도 있다.

또한 promise.race(), promise.all()등을 써야 되는 경우도 있으니 비동기에 대해서도 공부를 많이 하라고 하셨다.

그리고 아무리 chatgpt가 잘 알려주고 코드를 잘 짜준다 해도 원하는 로직을 짜줄 수 없으니 원하는 로직을 짤 수 있는 능력이 있어야 된다는 말을 해주셨다.

 

디버깅도 공부해야 된다고 했다.

단순히 콘솔로그가 아닌 vscode에서 디버깅, 개발자 도구에서도 어떻게 하는지 등 공부를 해야 된다.

 

웹팩에 대해서도 공부하라 했다. (vite 같은 거)

 

그리고 한 로직에 대해 짜더라도 다양한 방법으로 짜보는 연습을 해보라고 했다.

공부를 많이 해서 툭치면 왈랄라 나올 정도가 돼야 코드를 짜는데 자신감이 생긴다고 얘기해 주셨다.

 

지금도 회사에서 5년 차 프론트엔드 개발자분을 보면 시간이 남을 때마다 틈틈이 계속 공부를 한다.

무슨 공부하냐고 물어보면 새로운 기술에 대해서도 공부하지만 봤던걸 또보는 경우도 많다고 말하셨다.

똑같은걸 계속 보는 이유는 잊지 않기 위해서 공부한다고 한다.

 

이렇게 보니 공부할게 넘친다는 생각도 많이 들고

지금이라도 공부를 해야겠다는 생각밖에 들지 않는다...

내가 이 길을 선택했지만 정말 공부해야 될게 너무 많은 직업이라는 생각도 많이 드는 것 같다.

이제부터라도 열심히 공부해야지 넘친다 넘쳐

 

728x90
반응형

'개발일상✍' 카테고리의 다른 글

2024 개발 목표  (0) 2024.01.04
정보처리기사 필기 합격  (0) 2023.05.17
10월 개발공부  (0) 2022.11.01
9월 개발공부  (0) 2022.10.02
리트코드  (0) 2022.09.09
Comments