개발일기

개선 전후 성능 측정 결과   요청 크기 줄이기 1. 소스 코드 줄이기  Home 페이지에서 불러오는 스크립트 번들 크기가 951KB였다. 웹 페이지의 권장 번들 사이즈는 250KB 미만으로, 번들 사이즈의 용량 개선이 필요했다.  1-1. minify & uglify // webpack.config.js optimization: { minimize: true, }  Webpack v5부터는 production mode로 배포 시 기본적으로 압축과 난독화가 진행된다. TerserWebpackPlugin이 내장되어 있기 때문에, 자동으로 최적화가 이루어진다. minify & uglify 이전minify & uglify 이후압축률951KB216KB약 77%   그렇다면 development로 배포하..

4차 스프린트에서는 프로젝트의 목표였던 "개발 환경 개선"에 집중할 수 있었습니다. 저희 팀의 프론트엔드 인원이 다른 팀에 비해 한 명이 적다 보니 개발 환경의 효율화와 생산성 향상이 꼭 필요했습니다. 그래서 프로젝트를 하면서 제가 어떤 부분에 기여할 수 있을지 고민하다, 개발 환경을 개선시켜 생산성을 높여보자는 목표를 정했습니다.  1. 자동 배포 (CD) 개발 환경을 개선하기 위한 방법 중 첫 번째로는 자동 배포(CD)에 도전했습니다. 프론트엔드의 CI는 이미 구축되어 있었지만, CD는 구축되지 않은 상태였습니다. 그래서 배포 환경에서 테스트를 하려면 pem 키를 가진 크루에게 부탁해서, 우분투에 접속한 후 수동으로 배포를 해야 했습니다. 환경 변수가 추가되거나 변경 사항이 생길 때에도 우분투 CLI..

드디어 레벨 3가 끝났다!정말 우여곡절이 많았던 레벨 3.. 프로젝트도 협업도 너무 힘들었다😭 그래도 4차 스프린트는 3차 스프린트 때보다 마음이 한결 편안해진 상태로 진행할 수 있었다.잘 하자는 욕심을 버리고, 학습할 수 있는 환경을 만들기로 했다. 우테코에 들어온 것은 잘하기 위한 것이 아니라 '배우기 위해서'였으니까! (물론 현업에 가면 많이 배우면서도 잘해야겠지..!)  샌드박스 만들기학습할 수 있는 환경을 만들기 위해서 가장 먼저 '서비스의 핵심'을 위주로 기능 명세를 작성했다. 우리 서비스의 기능은 크게 다섯 가지로 나눠지는데, 미션, 풀이, 댓글, 대시보드, 디스커션 이렇게 나눠져 있다. 그중, 핵심이 되는 서비스 플로우를 경험하기 위해서는 미션, 풀이, 댓글, 대시보드까지 필요하다고 생각..

본 글은 2024.11.15에 마지막으로 수정되었습니다.  4차 스프린트에서의 페어 프로그래밍으로 해시태그 및 필터링 구현을 담당했습니다. Devel Up에서 제공하는 미션의 종류와 풀이의 개수가 많아지면서, 원하는 컨텐츠를 분류하여 볼 수 있으면 좋겠다는 사용자 피드백을 받았습니다. 팀원들과 필터링 기능의 도입 여부에 대해 논의한 끝에, 1. 빠르게 구현 가능하고 2. 도입 시 큰 효과를 볼 수 있다는 판단이 들어 해당 기능을 구현하기로 결정했습니다.  가장 먼저 페어였던 아톰과 함께 할 일과 일정을 산정했습니다. 페어와 함께 해야 할 일로는 다음과 같았습니다.1. 전체 해시 태그 조회2. 미션에 해시 태그 추가3. 솔루션에 해시 태그 추가4. 미션 필터링 검색5. 솔루션 필터링 검색 이렇게 다섯 가지..

우아한테크코스 레벨 3 글쓰기 과정을 통해 작성한 글입니다. 원문은 여기에서 확인하실 수 있습니다. 협업 : 많은 사람이 일정한 계획 아래 노동을 분담하여 협동적·조직적으로 일하는 것 처음에는 단순히 내가 해야 할 일만 잘 하면 된다고 생각했다. 첫 번째 유강스 목표로 '일과시간에는 시간을 효율적으로 사용하기'를 설정하고, 이를 위해 일과 시간 중 시간대별 계획을 세워 지키려고 노력했다. 그러나 팀원들과 회의를 반복하며, 협업은 단순히 일만 잘하면 되는 것이 아님을 깨달았다. 팀은 공동의 목표를 이루기 위해 끊임없이 소통하며 의견을 주고받고, 합의점을 찾는다. 결국 원활한 소통은 나뿐만 아니라 상대방의 작업 효율을 높이고, 모두가 같은 목표를 향해 나아갈 수 있게 한다. 소통을 잘하기 위한 방법 이전에는..

우아한테크코스 레벨 2 글쓰기 과정을 통해 작성한 글입니다.원문은 여기에서 확인하실 수 있습니다.   우테코의 시작과 프로젝트 사이, 레벨2는 마치 사춘기와도 같았다. 10대의 첫 번째 사춘기와는 달리 무수한 물음표들이 나를 괴롭혔다. 작은 바람에도 흔들렸고 끊임없이 방황하는 사이 어느새 레벨2가 끝나가고 있었다. 레벨1 목표는 개발자로서의 모습에 초점이 맞춰져 있었다면, 레벨2에서는 직업을 넘어 가치관과 인생으로 사고를 확장했다. 그동안 스스로에 대해 관심이 없었던 것은 아니었나, 주관이 뚜렷하지 않다는 생각이 들었기 때문이다.  나를 받아들이기 이상 속의 나는 무엇이든지 척척 해내고, 눈에 띄는 성과를 만들어내며, 성격 좋고 사회생활도 잘하는 사람이다. 하지만 현실 속의 나와는 거리가 멀다. 이상을 ..

우아한테크코스 레벨 1 글쓰기 과정을 통해 작성한 글입니다.원문은 여기에서 확인하실 수 있습니다.   우아한테크코스에 지원한 이유는 딱 하나, 바로 개발자로서의 성장과 발전 때문이었다.많고 많은 직업 중 개발자를 선택한 이유는 재미있어 보였기 때문이다. 내가 선택한 직업인 만큼 잘하고 싶었고, 자꾸만 욕심이 났다. 그리고 프리코스를 거쳐 우아한테크코스에 합격했다. 교육 과정을 시작하면서 레벨 1의 목표를 다음과 같이 정했었다.모던 자바스크립트 Deep Dive 1 회독하기문제 상황을 피하지 않기 (미루지 않기) 모던 자바스크립트 Deep Dive 1 회독하기 이 책을 고른 이유는 엄청난 두께에 압도를 당했기 때문이다. 마치 백과사전과도 같은 책을 보고 이 책을 읽고 나면 자바스크립트를 마스터할 수 있겠지..

험난한 3차 스프린트가 지나갔다. 다소 부정적일 수 있는 이야기를 작성한다는 것이 조심스럽지만, 그동안 느끼고 경험했던 것들을 기록하는 차원에서 글을 남기려 한다.  심리적 안전감이란 : Psychological Safety 조직 내에서 개인이 안전하다는 감정을 느끼는 것. 즉, 심리적 안전감을 느낀다면 구성원들이 조직 내에서 자유롭게 의사소통을 할 수 있는 환경이 만들어졌다는 것이다. 심리적 안전감을 느낄 수 있는 조직은 구성원들이 두려움 없이 의견을 낼 수 있고, 업무에 집중할 수 있으며, 성과를 낼 수 있다.반대로 심리적 안전감을 느끼지 못하는 조직이라면? 의견을 내는 데 조심스러워하고, 실수를 할까 조마조마한 상태에서 마치 빙판길을 걷는 듯한 느낌일 것이다. 나의 경우 2, 3차 스프린트에서 그러..

어느덧 2차 스프린트가 끝이 났다.2주 동안의 2차 스프린트를 기록하고자 한다!   인생 첫 해커톤 1차 데모데이가 끝나던 금요일 오후 5시, 우테코 대장 포비에게서 전체 슬랙이 왔다.  우테코만의 해커톤을 진행합니다. 팀별로 진행하고, 다음 주 월요일 오후에 시작해 화요일 오후에 끝나는 일정입니다.   "다음 주에 해커톤 하나 봐!""한 번 참여해 볼까?" 하지만 해커톤은 필참이었고, 우리는 긴급회의를 진행했다.  당시의 문제 상황은 다음과 같다. 1. 큰 틀의 기획만 잡혀 있지, ERD 및 정책 등의 세부 사항은 논의되지 않았다.2. 해커톤만을 위한 코드를 작성할지, 혹은 구현을 조금 덜 하더라도 유지보수를 할 수 있을 만한 퀄리티의 코드를 작성할 지 결정하지 못했다. 여기서 중요한 것은 2번이라고 ..

Devel-Up 프로젝트에서 프론트 팀원들과 힘을 합쳐 프론트엔드 S3 배포를 하기로 했다.개인적으로 공부한 뒤, 이번주 내로 배포하여 이미 구축된 CI/CD까지 연결하는 것이 목표! 잠시 프로젝트 소개를 하자면.. 개발자 취준생 상호 성장을 위한 플랫폼을 개발하고 있다.취준생들이 느끼는 불안감을 문제 상황으로 인식했고, 이 불안감을 해소할 수 있는 방법이 무엇이 있을까 고민하다 첫 번째 방법으로 코드 리뷰 서비스를 제공하기로 했다.2주 스프린트 단위로 나누어 아주 작은 기능부터 만들면서 8주 간 규모를 키워가려고 한다!  왜 S3를 사용하여 배포하지?프론트에서 Amazon S3를 통해 배포한 이유는, React 같이 SPA 프로젝트의 경우 서버가 필요 없고, 정적 웹 사이트 호스팅이 가능하여 간단하게 ..