![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/8FzMT/btrRzlma0XF/S8Tx0MitfTPDylJfnQvauK/img.png)
사실, JS는 "적당히" 코드를 컴퓨터에 던져주면, "적당히" 실행시켜주고, 어느정도 사용자가 기대하는 만큼 작동하는 언어이다. 따라서, JS 진영은 다른 언어 진영에 비해 JS에 대한 탐구를 깊게 하는 경우를 보지 못하였고, 특히 호이스팅과 같이 JS 관련 여러 개념은 알고 있지만, 이에 대한 탐구는 깊게 하는 사용자들이 그렇게 많아 보이지 않았다. 이번 글에서는 프로그래밍의 가장 근간이 되지만, 가장 알기 어렵고 헷갈리기 쉬운 변수에 대하여 알아보고, 이에 대한 생명 주기를 알아보자. (You don't know JS를 기반으로 작성되었습니다!) 1.변수는 언제 사용 가능한가? 자명한 답변이지만, 어느 언어에서나 변수는 언제 사용가능한가라고 물어보면 선언된 이후라 할 수 있다. 다음과 같은 예제를 보..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/DtTSY/btrQ0X59jly/tmWYEHTIilmGIpXTYxFBn1/img.png)
얼마전 팀원들끼리 스프린트로 DOM visualizer를 하기로 하였는데, 나는 이 주제를 2주 안에 구현하는데 실패하였다...(진짜로 시간이 없었다. 진짜로...) 이에 대한 참회의 의미로 DOM에 관련된 글을 작성하기로 하였고, 나는 DOM 관련 주제로 DOMParser API에 대하여 간단하게 설명하고자 한다. 가보자 가보자! 1. DOMParser API DOMParser API는 HTML 혹은 XML 소스 코드를 DOM으로 분석하고 파싱할 수 있는 API의 묶음이다. 다른 말로, DOMParser를 이용하면 문자열 꼴로 이루어진 XML, HTML 소스코드를 DOM 구조로 변환할 수 있다는 이야기이다. 반대로 DOM tree를 XML이나 HTML로 바꾸려면 XMLSerializer를 활용하면 된다..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/du0hVW/btrPS0JWEVE/w8xscShE5ZCrk1rl30TJA0/img.png)
한 달 전, React 개발팀은 6개월 전 많은 리액트 사용자들을 설레게 한, 'useEvent'라는 실험적인 hook 개발을 취소하였다. 이후에 설명하겠지만, 'useEvent' 훅은 기존 컴포넌트 재렌더링 관련 문제를 해결할 수 있는, 하나의 은탄이 되리라 많은 기대를 모았었다. 그러나 React 팀은 저번 달 이에 대한 관련 github 논의 글을 closed 하였고, React 팀은 "다른 방식으로 사용 가능하고, 다른 문법으로, 다른 이름으로 재출시될 수 있다."라고 못 박았다. 내 귀에는 "useEvent 훅을 없애갰다."라는 의미로밖에 들리지 않았다. 이게 어떤 사정이 있길 래 취소되었는지, 어떤 방향으로 새로 개발될지는 리액트 개발팀만이 알고 있겠지만, 이는 React Hooks가 가진 단..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/y5uou/btrOwBr0keO/ww0Z8D0YMMdmK7v0Ba8v81/img.png)
블로그를 하거나, 웹사이트 관리자라면 SEO(Search Engine Optimization)에 관한 이야기를 한 번쯤은 들어본 적이 있을것이다. SEO는 간단하게 말하자면, 구글에게 좋은 점수를 따는 방법이다. 좋은 점수를 딸수록 검색어 순위에서 올라가고, 점수를 따지 못하거나 구글의 기준을 넘지 못하면 검색어 순위가 내려가거나 검색에서 제외된다. 크롬 개발자들은 각 웹사이트마다 점수화하여, 얼마나 사용자 친화적인지, 얼마나 속도가 빠른지, 얼마나 접근성이 좋은지, 또한 SEO에 얼마나 최적화되어있는지에 대하여 보고서를 만들어주는 앱을 만들었으니, 이것이 lighthouse되겠다. 이번 포스팅에서는 lighthouse에 대하여 가볍지만, 웹 개발자 입장에서 가볍지 않게 들어가보자. 1. Lighthou..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/dPPzYe/btrN4DJ3M3o/eXoYNB70q4Rsgfor7nugG0/img.png)
JS는 Python 혹은 Ruby 처럼 동적 타입 언어이다. 즉, 타입이 컴파일 시에 결정되는 것이 아닌, 런타임에서 결정되는 언어이다. 그러나, 다른 동적 언어와 달리, JS는 매우 특이한 타입 변환을 지원한다. JS의 타입 변환은 다른 언어와 다르게 기상천외한, 정말 기상천외한 방법으로 진행되니, 이에 대하여 정리가 필요할 것 같아 글을 작성하게 되었다. JS의 타입부터 살펴보고, 각 타입이 어떻게 변환되는 지 알아보자. 중간에 흐름을 놓치게 되면 이해가 되지 않는 부분이 있으니 천천히 따라와 주시길. 1. JS의 타입 JS의 타입은 다음과 같이 7+1개가 있다. 이를 머리속에 넣고 가보자. 1. 원시 타입 - 불리언 타입 (true, false) - Null 타입 (null) - Undefined ..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/HfPfL/btrNEw40rcP/yFBGMhM5YHQb7pxmsqN1R0/img.png)
팀원들과 세미나를 진행하던 중, NodeJS로 서버를 구축 한 이후, HTTP로 쿼리, 응답을 받는 과정 중 "일단 404, 200으로만 상태 코드를 반환하자."는 말이 있었다. 사실 자주 쓰이는 404 Not Found, 400 Bad Request, 200 OK등등 자주 사용하는 상태코드는 외우고 있지만, 이 밖에 상태 코드는 찾아봐야 할 정도로 모르기 때문에, 한 번 정리해야겠다는 차원으로 이 포스팅을 작성하게 되었다. HTTP Status Code를 하나하나 살펴보자. 1. HTTP Status Code HTTP는 기본적으로 stateless 하기에 이전 요청과 상관없이 새 요청마다 새로운 응답을 받는다. 따라서, 각 요청마다 잘 되었는지, 어떤 상태인지 알려주는 약속이 대두되었고, 이는 HTTP..
- Total
- Today
- Yesterday
- 사칙연산
- bomblab
- 구현
- Max
- C
- docker
- JS
- 헤더
- react
- BRONZE
- 제어문
- GDSC
- BOJ
- 수학
- for
- 시간복잡도
- Python
- MIN
- equal
- 문자열
- 함수
- Network
- Proactor
- 프로그래밍
- 백준
- effective async
- 알고리즘
- C++
- CSAPP
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 |