테크

안녕하세요 동쪽별입니다. 오랜만에 자바스크립트 관련 글을 쓰네요 😁 이번 글에서는 자바스크립트의 가비지 컬렉션에 대해 완전 정복해보도록 하겠습니다! 메모리 누수 자바스크립트 메모리는 단순 변수에 사용되는 스택 메모리와 복잡한 객체에 사용되는 힙 메모리로 구분됩니다. 단순 변수(= 원시 타입) : String, Number, Boolean, Null, Undefined, Symbol, BigInt 등 힙 메모리에 저장된 객체의 주소값 또한 스택 메모리에 저장됩니다. 복잡한 객체(= 참조 데이터 타입) : Object, Array, Function 등 아래 그림의 왼쪽은 스택 영역으로 실행 컨텍스트와 원시 타입의 데이터를 저장하는데 사용되고, 오른쪽은 힙 영역으로 객체를 저장하는데 사용되는 것을 볼 수 있습..

문제 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 알고리즘 & 자료구조 완전 탐색 (Brute Force) - 순열 BFS 비트 마스킹 (Bit Masking) 로직 아래 유튜브 영상을 참고하여 코드를 작성했습니다. 너무 어려워서 스스로의 힘으로 해결하지 못했거든요..😅 먼저 존재하는 카드 값에 따른 비트 마스킹을 수행합니다. 예를 들어, 1부터 3까지의 카드가 있다면 1111(15)이 되겠죠. (0의 비트는 기본으로 1로 설정합니다) 이때 비트 1을 카드가 제거된 상태로 정의하여, 카드 제거시 해당 비트를 1로 변환하고 모든 카드 값에 대한 비트가 모..

이전 글에 언급했듯 네트워크 계층은 SDN이 도입됨에 따라 Data Plane, Control Plane 두가지 계층으로 나뉘었습니다. 패킷은 SDN에 의해 remote controller에서 전체 라우팅을 결정하고 결정된 라우팅에 맞는 포워딩 테이블이 각 라우터에 뿌려짐으로써 포워딩이 결정됩니다. 여기서 포워딩을 관리하는 계층이 Data Plane, 라우팅을 관리하는 계층이 바로 Control Plane입니다. 그럼 이번에는 네트워크 계층의 control plane에 대해 살펴봅시다! 목차 라우팅 프로토콜 Link State 다익스트라(Dijkstra) 알고리즘 Oscillations posiible Problem Distance Vector 벨만-포드(Bellman-Ford) 알고리즘 Count-to..

네트워크 계층은 어떤 일을 할까요? 바로 옆 노드 통신을 넘어서 최적의 길찾기 역할을 합니다. 메일을 보낼 때 최종 목적지 노드에 도달하려면 어떻게 가야하는지 네비게이션처럼 알려주는 것을 라우팅(Routing)이라고 하며, 이러한 라우팅을 해주는 계층이 바로 네트워크 계층입니다. 네트워크 계층이 없다면 우리는 바로 옆 노드에 있는 장치로만 메일 전달을 할 수 있을 것입니다. 그런데 네트워크 계층은 라우팅을 어떠한 원리로 할 수 있는 것일까요? 송신자, 수신자에서만 재설정되는 트랜스포트 계층(Transport Layer)과 달리 네트워크 계층은 모든 호스트(host), 라우터(router)에서 재설정됩니다. 라우터란 컴퓨터 네트워크 간에 패킷을 전송하는 네트워크 장치로, 패킷의 위치를 추출하여 그 위치에 ..

문제 코딩테스트 연습 - 가사 검색 programmers.co.kr 알고리즘 & 자료구조 트라이(Trie) 로직 const forwardRoot = new Map(); const backwardRoot = new Map(); 정방향, 역방향 트라이(trie) root를 생성합니다. 각 root는 문자열의 길이를 key, 트라이를 value로 하는 Map 객체입니다. root를 Map으로 표현하므로써 문자열의 길이로 트라이에 접근하여 더 효율적으로 문제를 해결할 수 있습니다. words.forEach((word) => { insertTrie(word, forwardRoot); insertTrie(word.reverse(), backwardRoot); }); 주어진 단어들을 트라이에 삽입합니다. insert..

최근 수행한 프로젝트의 클라이언트를 netlify를 통해 배포하는 과정에서 아래와 같은 에러가 발생했습니다.. 새로고침해보니.. 저희 팀이 구현한 캐싱 코드에서 에러가 발생했습니다. 아무리 봐도 코드 상으로는 문제가 없는데.. 그래서 개발자 도구의 로컬 스토리지를 확인하자..! undefined..? 로컬 스토리지를 비우고 다시 사이트에 접속해보았습니다. 역시 똑같은 에러! 이번엔 새로고침하지 않고 읽어보자, https 사이트에서 http를 통해 리소스를 요청하여 일어난 문제임을 알았습니다!! 암호화된 https에서 암호화되지 않은 http에 요청을 보냈기에 Mixed Content 에러가 발생한 것이었습니다. 이는 안전하지 않은 리소스가 누군가로 인한 변경이나 도청 등에 취약하기 때문에 위험하기 때문입..

안녕하세요 동쪽별입니다. 친구들과 알고리즘 스터디를 진행하면서 매주 다섯 문제씩 풀고 있는데요. 오늘부터 매주 해결한 문제 중 가장 어려웠던 문제 하나를 꼽아 리뷰하려 합니다 😁 (개인적으로 어려웠던 문제가 더 있다면 두개 이상 올릴거에요) 어려운 문제인 만큼 여러 사람들에게 도움을 줄 수 있겠다 싶었거든요. 더군다나 자바스크립트로 풀었기에..! 문제 코딩테스트 연습 - 자물쇠와 열쇠 [[0, 0, 0], [1, 0, 0], [0, 1, 1]] [[1, 1, 1], [1, 1, 0], [1, 0, 1]] true programmers.co.kr 로직 1. 주어진 lock의 홈 패턴을 구합니다. 여기서 패턴이란 하나의 홈에서 나머지 홈까지의 거리만을 구하여 저장해놓는 것을 의미합니다. lock을 순회하며 ..

안녕하세요 동쪽별입니다. 이번에는 정~말 중요한 HTTP를 들고 왔어요 😆 지난 포스트 웹 브라우저가 메시지를 만든다 글에서 HTTP에 대해 자세히 다루지 않았기에, 이번 글에서 알아보려해요. 목차 HTTP? HTTP/1.0 HTTP/1.1 HTTP/2 HTTP/3 HTTPS HTTP? HTTP(HyperText Transfer Protocol)은 웹 상에서 서버-클라이언트 모델을 따라 데이터를 주고받기 위한 프로토콜입니다. 주로 HTML 문서를 주고받는데 쓰입니다. TCP와 UDP를 사용하며, 80번 포트를 사용합니다. HTTP는 중요한 두가지 특징이 있습니다. 비연결(Connectionless) 클라이언트가 요청을 서버에 보내고, 서버가 적절한 응답을 클라이언트에 보내면 바로 연결이 끊깁니다. 무상..

"성공과 실패를 결정하는 1%의 네트워크 원리 - Tsutomu Tone" 책을 참조하여 작성한 글입니다. 미루고 미루었던 네트워크 공부를 시작했습니다. CS 지식이 부족하여 제대로 공부해보려 해요.. 목차 HTTP Request 메시지를 작성한다 웹 서버의 IP 주소를 DNS 서버에 조회한다 전 세계의 DNS 서버가 연대한다 HTTP Request 메시지를 작성한다 브라우저는 먼저 입력 받은 URL을 해독합니다. https://east-star.tistory.com/category/Tech/자바스크립트 위의 URL이 입력되면 아래와 같이 분해하는 작업을 수행합니다. http: + // + east-star.tistory.com + / + category + / + Tech + / + 자바스크립트 분해된..

안녕하세요. 동쪽별입니다. 지난 글에서 실행 컨텍스트에 대해 다루었으니, 이제 클로저를 살펴보아야겠죠? 이 글은 실행 컨텍스트에 대한 사전 지식이 있다는 가정하에 작성되었습니다. 그러니 실행 컨텍스트를 먼저 알아보고 오시면 좋겠습니다 😅 제 블로그에도 있어요! 목차 렉시컬 스코프 클로저와 렉시컬 환경 클로저의 활용 자주 발생하는 실수 클로저(closure)는 자바스크립트 고유 개념이 아닙니다. 함수를 일급 객체로 취급하는 함수형 프로그래밍 언어에서 사용되는 중요한 특성입니다. 따라서 클로저의 정의가 ECMAScript 사양에 등장하지 않습니다. MDN에서는 아래와 같이 정의하고 있습니다. "클로저는 함수와 그 함수가 선언된 렉시컬 환경과의 조합이다." 음.. 아직 무슨 의미인지 잘 와 닿지는 않네요. 차..