본문 바로가기

전체 글122

비전공자 출신 / 신입 개발자로서의 첫 자기소개서 준비 이글을 작성하는 이유는 본인이 개발자로의 길을 걸어가기로 다짐하고 나서부터 내 스스로 얼마나 달려왔는지를? 회고하기 위함과 앞으로 나와 비슷한 고민을 하는 분들이 글을 읽고 조금이나마 도움이 되었으면 하는 마음에서 작성을 해본다. 곧 학원 수료의 날이 다가온다. 나는 수료하기 전에 채용을 확정 짓고 싶다는 마음이 컸다. 그래야 마음 편하게 일주일정도 푹 쉰 다음에 업무에 집중할 수 있겠다는 마음에서이다. 하여 5월부터 자기소개서, 이력서를 갈무리하면서 준비를 하기 시작했다. 난 비전공자 출신으로 이전에 영업 -> 전략기획 -> 스타트업 -> 요식업 -> 앱서비스운영관리 등의 경험을 가지고 있는 사람이다. 하여 아래와 같이 이력서를 요약해서 작성하였으며, 참고해서 보기를 바란다. 자기소개서 이건 나만의 신.. 2021. 6. 24.
비전공자 출신 / 신입 개발자로서의 첫 이력서 준비 이글을 작성하는 이유는 본인이 개발자로의 길을 걸어가기로 다짐하고 나서부터 내 스스로 얼마나 달려왔는지를? 회고하기 위함과 앞으로 나와 비슷한 고민을 하는 분들이 글을 읽고 조금이나마 도움이 되었으면 하는 마음에서 작성을 해본다. 곧 학원 수료의 날이 다가온다. 나는 수료하기 전에 채용을 확정 짓고 싶다는 마음이 컸다. 그래야 마음 편하게 일주일정도 푹 쉰 다음에 업무에 집중할 수 있겠다는 마음에서이다. 하여 5월부터 자기소개서, 이력서를 갈무리하면서 준비를 하기 시작했다. 난 비전공자 출신으로 이전에 영업 -> 전략기획 -> 스타트업 -> 요식업 -> 앱서비스운영관리 등의 경험을 가지고 있는 사람이다. 하여 아래와 같이 이력서를 요약해서 작성하였으며, 참고해서 보기를 바란다. 내 이력서 요약 [학력] .. 2021. 6. 23.
WebRTC 듀토리얼 클론/분석 - RTCDataChannel을 사용하여 데이터 교환 해당 글은 https://codelabs.developers.google.com/ 의 듀토리얼을 기반으로 작성하였습니다. 이번에는 RTCDataChannel을 이용하여 데이터를 교환하는 것을 해보려고 한다. Step 03 - RTCDataChannel을 사용하여 데이터 교환 (코드분석) 'use strict'; var servers; var localConnection; var remoteConnection; var sendChannel; var receiveChannel; var pcConstraint; var dataConstraint; var dataChannelSend = document.querySelector('textarea#dataChannelSend'); // 텍스트 입력 영역 var d.. 2021. 6. 18.
WebRTC 듀토리얼 클론/분석 - RTCPeerConnection으로 비디오 스트리밍 해당 글은 https://codelabs.developers.google.com/ 의 듀토리얼을 기반으로 작성하였습니다. 프로젝트에서 WebRTC를 사용하기 위해 아래의 단계를 거쳐 학습 한 후 직접적으로 적용해보려고 한다. [학습 Contents] 1. 내 웹페이지에 웹캠을 통해 출력된 비디오를 노출시킨다. 2. 내 웹페이지에 웹캠을 통해 출력된 오디오를 출력시킨다. 3. Socket을 이용하여 서로 다른 2개의 브라우저에서 화면과 음성을 공유하여 볼 수 있도록 노출시칸다. 4. Spring 프로젝트에 Node Server를 연결하여 웹캠으로 통신을 할 수 있도록 구성한다. 오늘도 1번에 해당하는 것을 이어서 해볼 것이다. Step 02 - RTCPeerConnection으로 비디오 스트리밍 [학습목표.. 2021. 6. 17.
우아한테크러닝 4기 / 20210615 / 교육에 대한 기록 / 메모장 1교시 컴포넌트 관련된 주제를 메인으로 수업을 진행. 민태님은 90년대 부터 컴포넌트 관련하여 업무를 진행해오다 보니, 리액트같은 프레임워크에서 사용하는 컴포넌트 라는 용어가 국소적이고 이질감이 느껴진다고 한다. [민태님 질문] 컴포넌트가 뭐라고 생각하는지? 어떻게 빌드업해서 올라가는게 좋을지? 어떤 이미지를 가지고 있을지? (답변들) 기능 단위? 조각 같은 느낌 리액트에서는 요소들? self contained buliding block 이라고 생각하지만 실제로는 커스텀 엘레먼트로 밖에 사용하지 못하고 있다. [민태님 스피킹] 컴퓨터에서 그래픽카드로 예를 들면 그래픽카드 자체가 컴포넌트이다. 그런데 만약 그래픽카드를 교체한다고 하면?? 공장으로 보내지 않는다. 그냥 그래픽카드를 뽑고 다른 그래픽카드를 꼽.. 2021. 6. 16.
WebRTC 듀토리얼 클론/분석 - 웹캠으로 비디오 스트리밍 하기 해당 글은 https://codelabs.developers.google.com/ 의 듀토리얼을 기반으로 작성하였습니다. 프로젝트에서 WebRTC를 사용하기 위해 아래의 단계를 거쳐 학습 한 후 직접적으로 적용해보려고 한다. [학습 Contents] 1. 내 웹페이지에 웹캠을 통해 출력된 비디오를 노출시킨다. 2. 내 웹페이지에 웹캠을 통해 출력된 오디오를 출력시킨다. 3. Socket을 이용하여 서로 다른 2개의 브라우저에서 화면과 음성을 공유하여 볼 수 있도록 노출시칸다. 4. Spring 프로젝트에 Node Server를 연결하여 웹캠으로 통신을 할 수 있도록 구성한다. 오늘은 1번에 해당하는 것을 해볼 것이다. 다만 듀토리얼이 꽤나 오래전이다. WebRTC를 처음에 구글에서 소개한게 2013년 쯔.. 2021. 6. 15.
WebRTC 개념 정리 프로젝트에서 화상채팅 서비스를 구현해야하는 부분을 담당하게 되었다. 막연히 WebRTC쓰면되겠지 뭐~ 라고 생각했는데, 관련 자료들을 서칭해보니 생각보다 기초 지식을 탄탄하게 습득하고 넘어가야 할 것 같다는 판단이 들었다. (시그널링은 무엇이며, peerconnection?은 뭐고... 어떤식으로 동작하는지 등등) 하여 내가 이해하는 과정에서 두서없이 막 정리해보려고 한다. 아무생각 없이 영상부터 봐보자. 먼저 GoogleDevelopers 유투브 채널에 올라온 영상을 보면서 천천히 익혀보려고 한다. (영어는 100% 이해안되지만 댓글에 The only video that provides so much valuable information for beginners at WebRTC. WebRTC의 초보자.. 2021. 6. 14.
구글 OAuth를 통해 로그인 구현해보기 OAuth의 백과사전적 의미부터 알아보고 시작하자. OAuth 는 인터넷 사용자들이 비밀번호를 제공하지 않고 다른 웹사이트 상의 자신들의 정보에 대해 웹사이트나 애플리케이션의 접근 권한을 부여할 수 있는 공통적인 수단으로서 사용되는, 접근 위임을 위한 개방형 표준이다. 이 매커니즘은 여러 기업들에 의해 사용되는데, 이를테면 아마존, 구글, 페이스북, 마이크로소프트, 트위터가 있으며 사용자들이 타사 애플리케이션이나 웹사이트의 계정에 관한 정보를 공유할 수 있게 허용한다. 어지간한 웹사이트에서도 편하게 구현할 수 있고, 사용자도 불필요한 절차없이 이용할 수 있다는 장점이 있다. OAuth 구현 절차 1. 구글 API 서비스에서 프로젝트를 생성 2. 프로세스에 맞춰 정보 입력 3. OAuth 클라이언트 ID .. 2021. 6. 13.
타입스크립트 / 열거형과 리터럴 타입 Enum & Literal 1. 열거형 Enum : 연관된 아이템들을 함께 묶어서 표현할 수 있는 수단 (사용방법) enum을 선언해준다. 원하는 프로퍼티에 해당 enum의 변수를 타입으로 지정해준다. 아래와 같이 클래스.변수명 과 같은 형태로 사용하면 된다. 컴파일된 자바스크립트를 보면 아래와 같은 형태로 나온다. 0, 1, 2 의 형태로 각각 값을 가지는 것을 확인할 수 있다. 이것이 숫자열거형 Numeric Enum 이다. 근데 만약에 0,1,2의 값을 "Male", "Female"과 같은 String형태로 변경하고 싶다면?? 타입스크립트는 String enum을 지원한다. 2. 리터럴 타입 : enum 보다 심플하다. 그냥 스트링으로 적고 | 로 구분해주면 끝~ 본 포스팅은 땅콩코딩님의 유투브 강.. 2021. 6. 12.