개발일지

more

실시간 화이트보드 공유 지연 최소화하기

기록으로 남기는 실시간 화이트보드 강의 서비스, 🙂 Boarlog 를 개발하며 구현한 내용을 담고 있습니다.게시글의 기능을 이용한 최종 서비스는 GitHub 링크 에서 확인하실 수 있습니다.  실시간 화이트보드 공유 서비스를 운영하며 생긴 지연 문제의 해결 과정을 정리한 글입니다.해당 서비스를 처음 구현한 과정은 이전 개발 일지에 정리했습니다. 💭 0. 문제 상황  화이트보드에 쓴 글씨가 많아지면 참여자 페이지에서 느리게 보이는 문제가 발생했습니다. 이러한 문제점이 생기는 원인은 아래와 같이 세 가지를 추정해 봤습니다.강의자 페이지에서 화이트보드 정보를 저장하는 시간이 오래 걸린다.강의자가 보내는 화이트보드 데이터의 용량이 커서 서버를 통한 전송이 오래 걸린다.참여자 클라이언트에서 처리해야 할 데이터..

🙂 Boarlog 2024.03.10 2

실시간 화이트보드 공유 구현하기

기록으로 남기는 실시간 화이트보드 강의 서비스, 🙂 Boarlog 를 개발하며 구현한 내용을 담고 있습니다.게시글의 기능을 이용한 최종 서비스는 GitHub 링크 에서 확인하실 수 있습니다.   실시간 화이트보드 공유 서비스를 구현하기까지의 과정을 정리한 글입니다.Fabric.js로 화이트보드를 구현하는 과정은 이전 게시글에 정리했습니다.💭 1. 강의자 canvas의 내용을 어떻게 참여자에게 전달해서 표시해야 하는가? 실시간으로 강의자의 화이트보드(canvas) 내용을 참여자들에게 전달하는 것을 목표로 프로젝트를 시작했습니다. 강의자의 화이트보드는 Fabric.js 라이브러리를 이용해서 구현을 마쳤고,음성 브로드캐스팅은 WebRTC를 사용한 미디어 서버를 통해 완성한 상황이었습니다. 프로젝트 발표까지..

🙂 Boarlog 2024.02.06 2

Javascript로 마이크 볼륨 시각화하기

기록으로 남기는 실시간 화이트보드 강의 서비스, 🙂 Boarlog 를 개발하며 구현한 내용을 담고 있습니다.게시글의 기능을 이용한 최종 서비스는 GitHub 링크 에서 확인하실 수 있습니다.   웹 페이지에서 마이크를 통해 음성을 입력받고, 볼륨을 시각화 하는 과정을 정리합니다. 바닐라 Javascript로 개발한 예제코드는 아래에서 확인할 수 있습니다.https://codepen.io/vchgekmq-the-flexboxer/pen/MWLVJeO?editors=1111🎤 1. 마이크를 통해 사용자의 음성을 입력 받기navigator.mediaDevices .getUserMedia({ audio: true }) // 마이크 권한을 요청 .then((stream) => { ..

🙂 Boarlog 2024.01.26 0

회고

more

24년 6월 회고

6월 회고는 상반기 회고로 작성합니다. Keep 스터디  1월부터 시작한 PS/CS 스터디를 꾸준히 진행했다. 매주 2회 모여서 코딩 테스트 문제를 풀이하고, CS 내용을 학습해서 발표하고 피드백을 주고받았다.CS는 컴퓨터 네트워킹 하향식 접근>을 기반으로 공부한 네트워크와 알고리즘, 알고리즘 10판(공룡책)>으로 운영체제를 학습해서 발표했다. 모두 전공필수로 배운 내용들이지만, 다시 정리하고 설명해 보면서 내가 자세히 알지 못했던 개념을 더 확실히 파악할 수 있는 기회가 되었다. 현재는 모던 자바스크립트 Deep Dive>를 위주로 JS를 공부해보고 있다.PS는 백준 골드 문제 위주로 풀어나가고 있다. 스터디를 시작했을 때에는 DFS/BFS도 어색한 수준이었지만, 꾸준히 여러 문제를 풀어본 덕분에 실력..

🌕 월간 회고 2024.06.30 0

2024 팀네이버 신입 공채 후기

팀네이버 신입 공채 전체 일정이 끝나게 되어, 채용 과정을 복기할 겸 지원 후기를 작성해 봅니다. 1. 서류 접수 자기소개서는 3개 문항이었고, 마지막 문항은 필수가 아닌 선택이었다. 분량이 1000자 정도로 널널했기 때문에, 어떤 내용을 적을지 고민이 많았다. 자기소개서는 약 2주간의 접수기간 동안 매일 읽고 고치기를 반복했다. 피드백도 주고받으며 계속 고쳐나가는 과정에서 '나는 어떤 개발자인가', '나는 어떤 장점을 가지고 있는가'에 대해 고민을 많이 할 수 있었다. 처음에는 단순히 1000자를 채워나가기 위한 고민이었지만, 계속해서 글을 써보면서 나 자신을 돌아볼 수 있는 기회가 되었다. 추상적으로만 생각했던 개발에 대한 생각이 글로 적는 과정에서 더 명확해졌다. 서류에서 탈락하더라도 뜻깊은 경험이..

회고 2024.06.18 0

24년 5월 회고

Keep 채용과정 복기와 휴식 팀네이버 신입공채 과정을 게시글로 정리하면서 복기해 보았다. 인터뷰 기회도 받고, 대기업 채용 절차를 한번 밟아보면서 짧은 기간동안 많이 성장할 수 있었음에 감사하다.월말에는 조금 머리를 비울 겸 일주일 정도 국내 여행을 다녀왔다. 하루 이틀을 제외하고는 꾸준히 커밋 기록을 채워왔던 깃허브 잔디에 고속도로가 생겼지만, 휴식을 하는 동안 다시 코딩에 대한 열정이 채워진 것 같다.개발 학습 면접이 끝나면 하겠다고 미뤄왔던 일들을 하나씩 처리하고 있다.이력서 페이지에도 목표로 했던 다크모드나 목차(TOC)와 같은 기능을 추가했고, 티스토리 스킨도 원하는 대로 조금 편집했다. Try 신입 채용 일정이 많지 않아서 조금 여유를 가지고 학습을 이어가려고 한다. 이참에 자바스크립트 기초..

🌕 월간 회고 2024.05.31 0

개발 서적

more

<소프트 스킬> - 존 손메즈

📖 책 소개 평범한 개발자의 비범한 “인생 전략” 74가지 라는 부제목 처럼, ‘개발자를 위한 자기개발서’라는 설명이 잘 어울리는 책이다. 요즘들어 개발자에게 특히 강조되는 능력이 ‘소프트 스킬’이다. 소프트 스킬은 프로그래밍 실력같은 ‘하드 스킬’과 달리, 의사소통 능력 같이 협력에 필요한 비기술적인 능력을 말한다. 이런 소프트 스킬을 기르기 위한 방법들이 책에 소개되어 있다. 책은 총 7부로 구성되어 있다. 초반부는 “경력”, “학습”, “생산성” 같은 개발자에게 필요한 전략이 소개되어 있고, 후반부에는 “재무관리”, “건강” 같이 개발자에게 특화된 내용이 아닌 일반적인 자기개발서에서 찾아볼 수 있는 전략을 담았다. 책을 처음 읽을 때는 저자가 일하는 미국과 한국의 차이를 고려해가면서 읽었는데, 생..

<함께 자라기 : 애자일로 가는 길> - 김창준

작년 여름에 처음 읽었던 책이다. 겨울에 프로젝트를 하면서도 종종 읽어보았고, 오늘에서야 독서 기록을 남겨본다. 애자일 방법론을 소개해온 김창준 대표가 쓴 이 책은 “자라기” / “함께” / “애자일” 총 3부로 구성되어 있다. 우리는 (거의) 평생 세수와 양치질을 꾸준하게 반복했건만 왜 세수와 양치의 달인이 안 될까요? 예컨대 10년이 지나도 여전히 양치질을 제대로 못 해서 치과에 갈까요. 가서는 의사에게 "이쪽 치아는 하나도 안 닦으시나 봐요" 같은 소리를 듣고요. 53p “자라기” 에서는 1만 시간의 법칙을 이야기하면서 그냥 수련이 아닌 ‘의도적 수련(Deliberate Practice)’이 필요하다고 말한다. 예컨대, 우리는 평생 양치질을 해왔지만 양치질의 달인이 되지는 못한다. 이러한 수련이 아..

<나는 네이버 프런트엔드 개발자입니다> - 김지한, 하성욱, 장기효, 윤정현, 손찬욱, 김다현, 박재성, 윤영제

처음에는 프런트엔드 개발자로 취업하기 위해 갖출 점을 찾기 위해 읽기 시작했지만, 취업 이야기만큼이나 선배 개발자들의 성장 이야기도 인상적이었던 책이었다. 책은 총 8명의 네이버 프런트엔드 개발자가 말하는 이야기로 만들어졌다. 딱딱한 개발 이야기만 있는 것이 아니라 프런트엔드 초창기 개발 이야기, 다양한 일과 업무를 거쳐 프런트엔드 개발자가 되기까지의 이야기 등 가볍게 읽을 수 있는 내용도 많아 읽는 데 부담은 없었다. 개발자님들의 각 이야기는 다음과 같이 구성되어 있다. 프런트엔드 개발자가 되려면 무엇을 공부해야 하나요? (김지한) 미국의 신입 개발자 한국으로 돌아오다 (하성욱) 프런트엔드 개발 상담, 무엇이든 물어보세요 (장기효) 오류와 실수, 신기술 도입, 성능 지표 이야기 (윤정현) 꿈을 현실로,..