FrontEngineer JungBam

목표 설정이 중요하다고 생각하고 부트캠프를 끝낸 지금, 나한테 필요한 건 취업이라는 것에 묶여있기보다 next level로 넘어가는 것이다. 최근 트렌드에 맞춰서 웹+앱을 다 아우르는 개발자가 되기 위해 기본이 되는 것들(TS, 최적화)을 익히고 하고 싶었던 공부(recoil)를 할 생각이다. 1. TS 공부 - 타입스크립트가 익숙해질때까지 써볼 생각이다. 2. 최적화 공부 - 번들링에 대한 공부 - 렌더링 최적화에 대한 공부 - 브라우저에 대한 공부(캐시, 서버와의 통신 등) 3. recoil을 조금 더 딥하게

길 것 같았던 항해 기간이 끝나고 수료식을 했다. 시간이 지나면 지금 느끼는 감정들이 또 달라질테니 수료한 지금의 심정을 회고하며 글을 작성한다. 34살 전역 이후, 3번의 부트캠프. 항해99 수료 이후 2주만에 회사를 골라가기까지 34살 전역을 하고 선택한 프론트엔드 2012년 백엔드 개발자로 인턴 9개월, 신입으로 허드렛일 4개월을 마치고 병역의 의무를 다하기 위해서 사관학교로 군 생활을 시작했다. 그렇게 전투복을 입고 9년 6개월의 시간이 흐르고 사회로 나왔다. 항상 새로운 것을 도전하고 바꾸고 싶었던 해소되지 않는 가슴 속의 뜨거움을 표출할 직업을 고민하다가 계속해서 변화하고 배워야 하는 개발자를 다시 해보자는 생각이 들었다. 34살에 이직을 선택하고 걱정이 없었던 것은 아니었으나, 어떤 것을 하..

실전프로젝트 1차 결과물이 완료되어 유저테스트를 시작했다. 프로젝트의 가장 중요한 점이 유저테스트라는 것을 새삼 느낄 수 있었다. 아침에 일어나면 버그신고를 통해 각종 버그와 격려가 있었고 이것을 해결하는데 하루 하루를 보냈다. 최종발표회 당일에도 버그가 2건이 나오면서 발표회 중간에 즉각적으로 수정하여 배포했다. 최종 배포까지 버전업을 2번 진행했는데 각각의 버전업에 반영된 사항은 아래와 같다. 조금 아쉬운 것은 유저테스트를 좀 더 길게 할 수 있었다면 좀 더 완성도 있는 모습이 되지 않았을까 라는 점이다. 그리고 UT결과 중 프론트엔드에서 처리할 수 있는 것들은 즉각 처리가 되었지만 게임서버쪽에서의 에러들은 수정되지 못했다. 코드가 정리되어 있지 않아서 하나를 수정하면 그로 인해 파생되는 에러들이 생..

코드 리펙토링 과정을 통해 비지니스 로직과 UI적인 부분의 분리를 많이 시도하면서 공부하고 있다. 컴포넌트 함수가 호출되는 과정에서 함수가 재생성되고 레퍼런스 값들이 계속해서 호출되는 불필요한 리소스 낭비를 제거하기 위해서 많은 부분에서 고민하고 있다. 실전 프로젝트를 하면서 협업을 하면서 중요한 것에 대해서 정리가 되어가는 것 같다. 1. 신뢰할 수 있는 사람을 만나야 한다는 것. 각자 맡은 부분에 대하여 책임감을 갖고 프로페셔널하게 최선을 다하는 사람을 만나는 것은 중요한 것 같다. 이번 프로젝트에서는 그런 부분에 있어서 어려운 점이 많았던 것 같다. 두명의 하차과정이 진행되었고 그 중 프론트에 있어서 한명은 갑작스러운 하차를 하면서 진행에 있어 달라진 점이 많이 생기게 되었다. 그럼에도 프로젝트에 ..

이번주에 공부한 중점 1. SOCKET.IO 2. peer.js 3. typeScript 적용해본 라이브러리 1. react-dnd 2. frame-motion 3. react-sound node 인프라 구축에 시간이 일주일 이상 소모되면서 시간이 남아 미흡한 공부를 진행하면서 목 데이터를 통한 기능 구현을 각각 진행했다. 이번주에는 webRTC와 SOCKET의 트래픽 이슈들이 많이 생겼다. 1. 화상채팅을 할 때에 피어가 늘어날 수록 스트리밍 화면이 깨지고 화면에 보이는 내가 실시간에서 0.5~1초의 갭이 생기는 문제가 생겼다. 이건 webRTC 공식문서에도 나오는 내용이기는 한데 best practice는 SFU 서버를 통한 스트리밍이지만 지금 가용한 리소스에서는 불가능하기때문에 어느정도 안고가야 될..

1. websocket부터 SOCKET.IO, webRTC 2. API layer, 인터섹션 옵저버 3. nginx request와 response가 있는 http 통신 프로토콜에서 실시간 통신을 위해 connect와 disconnect를 통해 연결되는 socket 통신을 공부하고 이를 통해 채팅을 구현해봤다. SOCKET.IO라는 websocket을 좀 더 쉽게 접근할 수 있는 방법에 대해서 공부하고 이를 통한 채팅을 구현해봄으로써 실시간으로 진행되어야 하는 방식에서 socket이라는 달콤함을 느낄 수 있었다. webRTC를 구현하는 것 자체는 아래의 레퍼런스를 통해 줌 클론코딩을 진행하며 어렵지 않았지만 이를 통한 실시간 스트리밍을 구현하는 것은 어려움이 있었다. 줌 클론코딩 – 노마드 코더 Noma..

미니프로젝트 : https://github.com/Jungbam/randomItem GitHub - Jungbam/randomItem Contribute to Jungbam/randomItem development by creating an account on GitHub. github.com 가장 좋았던 것은 B.E. 분들이 이미 경력이 있으시고 프로젝트 경험이 다수인 분들이셔서 B.E.와의 협업은 매우 순조로웠다. API구성 / 와이어프레임 도 서로 소통하며 작성하고 스코프 또한 프론트쪽의 진행도에 맞춰 적절했다. 이번 프로젝트 목표는 기능적인 부분보다 협업과 팀 문화에 신경을 많이 썼다. 1. 깃 플로우 관리 2. 컴포넌트 추상화 3. 프로젝트 임무분담에 따른 협업 여기서 생각하지 못한 부분은 같은..

redux-toolkit과 thunk에 대해서 많은 공부를 하고 타입스크립트 입문을 시작하면서 많은 것을 배운 한 주였다. 프로젝트는 그럭저럭 잘 나온 것 같다.(물론 간단한 프로젝트였지만..) axios는 비동기처리를 위해 사용하는 패키지로 get, post, put, patch, delete 메소드를 통해서 서버에 API요청을 할 수 있게 해준다. axios는 그저 이런 기능뿐만 아니라 인스턴스, 인터셉터를 통한 기본값 설정, request, response에 대한 중간처리과정을 유용하게 해주기 때문에 정말 좋은 패키지라는 생각이 들었다. github : https://github.com/hanul-dev/react-team2 GitHub - hanul-dev/react-team2: react-ass..