개발

WebRTC란 무엇이며 어떤 과정을 갖는가?

WebRTC라는 개념이 있다. WebRTC는 무엇을 위한 기술이며 어떤 과정을 거치게 될까? WebRTC란? Web Real-Time Communication. 웹 애플리케이션과 사이트가 중간자 없이 브라우저 간에 오디오나 영상 미디어를 포착하고 마음대로 스트림할 뿐 아니라, 임의의 데이터도 교환할 수 있도록 하는 기술 WebRTC를 구성하는 일련의 표준들은 플라그인이나 제 3자 소프트웨어 설치 없이 종단 간 데이터 공유와 화상 회의를 가능하게 한다. 쉽게 생각해서 P2P 실시간 커뮤니케이션이 가능하게 해주는 기술이다. WebRTC를 사용하면 카메라, 마이크를 넘어 고급 영상 통화 애플리케이션 및 화면 공유 등에도 활용 가능하다. WebRTC의 과정 WebRTC를 사용하기 위해서는 어떤 과정이 필요할까?..

[네이버 부스트캠프] 네이버 부스트캠프 웹・모바일 8기 그룹 프로젝트 1주차 회고

본격적으로 그룹 프로젝트가 시작되었다. 다양한 사람들을 만나서 다양한 프로젝트를 했지만 기존과 마음가짐이 약간 다른 것 같다. 기존에는 "어떤 서비스를 만들것인가"에 집중했다. 화려하고 다양한 기능을 가진 서비스를 시간안에 만드는 것이 목표였다. 하지만, 이번 그룹 프로젝트는 서비스를 만드는 과정에서 "어떤 기술적 도전을 할 것인가"에 대한 고민을 하게 되었다. 단순히 서비스를 만드는 것에 그치지 않고 기술적 도전을 통해 성장하는 발판이 되었으면 좋겠다. 들어가며 이번 우리 서비스의 주제는 "실시간 공동편집"이다. 실시간으로 소통하며 코드를 공동편집 할 수 있는 웹 서비스를 기획하게 되었다. 이 과정에서 화상채팅, 텍스트 채팅, 코드 공동 편집 기능이 필요했다. 각각의 기능을 구현하기 위해 필요한 기술로..

[네이버 부스트캠프] 네이버 부스트캠프 웹・모바일 8기 멤버십 6 ~ 9주차 회고

내용에 문제가 있는 경우 삭제 또는 수정하겠습니다. 네이버 부스트캠프 웹・모바일 학습 스프린트 기간이 끝났다. 나는 프론트엔드로 두번째 스프린트 기간을 보내게 되었다. 어떤 분야를 선택할지 고민이 많았지만 언제나 그랬듯이 선택하고 후회하지는 않았다. 이제 학습 스프린트는 끝났고 그룹 프로젝트가 남아있다. 아직 그룹 프로젝트가 남아있지만 챌린지 때 부터 미션을 수행하며 배웠던 점 등에 대해 종합적인 회고를 하고자 한다. ✨ 좋았던 점 (잘한 점) 기술적으로 깊게 학습할 수 있었던 것 같다. 부스트캠프 기간동안 틈틈이 블로그에 작성했던 여러 기술적인 부분도 시작은 "왜?"에서 비롯된 것이었다. 어떤 도구를 사용하는데 이유가 중요하다고 생각했다. A: 그거 왜 써요? B: 빨라요! A: 정말요? 그런데 그건 ..

Vite는 왜 빠를까?

일반적으로 Webpack보다 Vite가 더 빠르다는 글을 볼 수 있다. 왜 Vite가 Webpack보다 빠르다는 것일까? 모듈 개발을 하는 과정에서 어플리케이션의 크기가 커지면 언젠가 파일을 분리해야 할 것이다. 이때 분리되는 파일 각각을 '모듈(module)'이라 부른다. 모듈은 대개 클래스 하나 혹은 특정한 목적을 가진 복수의 함수로 구성된다. 하지만 JS의 모듈 시스템인 ESM은 2015년 ES6가 도입되며 공직적으로 추가되었다. ESM을 사용하면 import와 export 문법을 사용하여 서로 다른 모듈에서 변수나 함수 등을 쉽게 불러오거나 내보낼 수 있다. 브라우저에서 ESM을 지원하기 전까지는 JS의 모듈화를 네이티브 레벨에서 진행할 수 없었다. 여기서 "네이티브 레벨"이라는 것은 외부의 다른..