올 초에 리치 에디터 내에 콘텐츠 임베드 작업을 하면서 oEmbed 라는 포맷을 처음 접했다. 사용자가 url입력시 youtube, vimeo, twitter와 같은 콘텐츠를 임베드해서 띄워주는 작업이었는데, 단순히 특정 프로바이더에서 제공하는 api만 사용할 수

Javascript에 관한 여러가지 meme들을 보면서 키득거리다가도 간혹 헷갈리는 부분들이 있어 한번 짚고 넘어가고자(제대로 알고 웃고자) 강제 형변환에 대해 정리해봅니다. 잘못된 정보는 정정 바랍니다. 감사합니다. Type coercion 강제 형변환 > Typ

지난 Intersection Observer로 무한 스크롤 구현하기에 이은 React와 Intersection Observer를 사용하여 lazy image load 구현하기를 작성해보려 한다. 반 년 전 (이제는 전회사가 된) 회사 면접 과제를 하며 무한 스크롤을

Nullish coalescing operator (null 병합 연산자) nullish coalescing operator ??은 nullish한 값(null 혹은 undefined)을 판별하여 or 연산을 하는 연산자이다. 왼쪽 피연산사가 nullish한 값(

문제 Implement strStr(). Return the index of the first occurrence of needle in haystack, or -1 if needle is not part of haystack. What should we retur

실제로 사용해 보기 전까지는 이해하기 어려웠던 useCallback과 React.memo에 대해 작성해보려고 한다. 리액트 함수형 컴포넌트로 최적화를 위해 (shouldComponentUpdate와 같은)라이프 사이클 메소드를 구현하려 검색하다가 알게 되었던 것 같다

최근 react를 사용한 면접 과제에서 여러 요구사항 중 하나로 페이지네이션 구현이 있었는데 window scroll 이벤트는 여러 번 써보기도 했고 이번에 새로 알게된 IntersectionObserver 적용하여 무한 스크롤을 구현보았다. Intersection

요즘 여러 군데 면접을 다니면서 회사마다 다양한 질문을 받는데 하나도 빠짐없이 모든 회사들이 묻는 공통된 질문 하나가 개발을 시작하게 된 계기였다. 준비해두었던 것은 아니지만 자연스레 개발을 접하게 된 계기와 이후의 선택들, 그 결과가 된 현재까지를 가감없이 이야기했다

2019년 6월 15일에 미디엄에 작성했던 글을 옮겨왔습니다. 수강 신청을 하기 전과 수업을 시작하기 전에 궁금했던 사항들이 많아서 몇 달이나 같은 후기를 보고 또 보고 했었다. 그래서 미래의 나와 같은 이에게 위안과 도움이 되고싶은데 의도대로 될지 잘 모르겠는 신청

blocking, non-blocking, callback hell, Promise, async await.. 등 비동기와 관련해 머릿 속에 파편적으로 흩어진 것들을 조금씩 모아두려 작성한다. 잘못된 사항들이 있다면 지적바라며.. 사용된 예시 MDN 예제에서 조금씩 덧붙였습니다. 동기 vs 비동기 동기와 비동기를 나누는 가장 큰 차이점을 어떻게 실행 ...

OOP? 객체 지향 프로그래밍이 컴퓨터 프로그래밍 패러다임 중에 하나인 것은 알겠는데.. 그래서 그러니까 객체 지향 프로그래밍이 뭐야? 하고 궁금한 것이 개인적으로 당연한 것 같다. 잡힌 듯 잡힌 듯 하지만 한편으로는 실체가 전혀 없는 것 같기도 한 OOP.. 도대체 무엇일까? OOP란.. 한마디로 축약해서 설명하기 힘든 어떤 추상적인 개념과 같아서 이 ...

동일 출처 정책 Same-Origin Policy 동일 출처 정책(same-origin policy)은 어떤 출처에서 불러온 문서나 스크립트가 다른 출처에서 가져온 리소스와 상호작용하는 것을 제한하는 중요한 보안 방식입니다. 동일 출처 정책은 잠재적으로 해로울 수 있는 문서를 분리해, 공격받을 수 있는 경로를 줄입니다. 출처 MDN 즉, 동일 출처 정책은...

SQL & NoSQL의 등장 데이터를 컴퓨터 내에 보관하기 시작한 이후부터 불가피하게 발생한 여러 문제점들을 보완하다보니 파일시스템이 점차 발전하게 된다. 각각의 문제점들과 보완된 DB방식의 가장 큰 축에 1970년대에 만들어진 SQL과 2000년 이후의 NoSQL 방식이 있다. File → SQL. file의 문제점들 파일 문제점 파일 시스템의 문...

개인적인 기록을 위해 작성하는 글입니다. 잘못된 정보에 관한 지적은 감사히 생각합니다. App.json 설정 먼저 App.json 파일에 bundleIdentifier key - value 값 설정이 필요하다. App.json 처음이기도 했고 프로젝트 기간이 2주 밖에 되지 않아서 안드로이드 기기 고려하지 않았다. 따라서 빌드는 ios만 할 예정이다...

개발자 등록을 위한 결제 결제 어제는 결제 페이지로 넘어가는 중에 계속해서 에러가 나길래 내부적인 문제인가 싶어서 오늘 재시도를 했는데 드디어, 드디어 결제가 진행되었다. 신나서 혼자 내적 외침을 질렀다. 나.. 2019년 마지막 토요일날 브루클린 위워크에서 애플 개발자 등록 결제했다!!! 결제 완료 어째든 앱 등록을 위한 첫 걸음은 내딛은 셈이다. ...

자료구조 내가 이해한 선에서 간단하게 축약하자면 자료구조란 데이터 값들을 담아두는 방식을 의미한다. 하나의 데이터를 한 장의 종이로 빗대었을 때 종이를 뭉치로 엮어둘 수도 있고 한 장씩 파일에 껴놓을 수도 있고 바닥부터 쌓아두거나 필요한 위치에 각각 따로 둘 수도 있다. 어떤 방식이 가장 효율적인지는 종이가 필요한 상황에 따라 자주 다루는 방식에 따라 달...

개인적인 기록을 위해 정리하는 글입니다. 시작은 2차 프로젝트 1차 프로젝트로 웹 기반 프로그램을 만들었다. 필요한 데이터를 쌓기 위해서는 크롬 익스텐션 구현이 필요했는데 자료 서치 + 공부를 하며 완벽하지 않아도 이렇게 저렇게 구현하고나니 그 뿌듯함이 과제할 때와는 또 다른 느낌이었다. 다음 프로젝트에서도 새로운 시도를 해봐야겠다고 내내 생각하다 2차로...

서버 공부를 시작하며 요청에 대한 응답을 주는 과제를 하는 중에 node.js 의 모듈 bodyParser의 존재를 알게 되었다. bodyParser 모듈 없이는 post, put 요청 메소드의 request.body를 읽어올 수 없어 일단 사용하긴 했는데 과제를 마치고서 어쩐지 짚어 넘어가야 할 것 같아 찾아보고 이해한 자료까지만 간단히 정리한다. &n...

자바스크립트는 single-threaded 언어이다. single-threaded란 호출한 함수들이 쌓이는 call stack이 하나인 것을 의미한다. 즉, call stack이 하나인 자바스크립트는 한 번에 한 가지만 수행할 수 있는 언어이다. 모든 Javascript Engine(대표적으로 v8)은 Memory Heap과 Call Stack으로 이루어...

문제 Codewars In this kata you have to create all permutations of an input string and remove duplicates, if present. This means, you have to shuffle all letters from the input in all possible orders. 문...