목록개발자 (13)
As i wish
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/cZAiC3/btqCy3ZOr9t/DbgnOVx7nJ6MVXfGrMVyiK/img.png)
JavaScript: The Observers JavaScript: Observers 의존성 패키지 없이도 자바스크립트 기본 내장 옵저버를 소개한 글이 있어서 가져와봤습니다.JS: The Observers이 글에서 소개하고 있는 옵저버는 총 5지인데요.IntersercionObserver: 루트 영역(뷰포트) 와 대상 객체의 겹침을 감시ResizeObs velog.io
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/crhypp/btqCkP9Sdhp/m6lhGD6HkQ69KRpvP3xhw0/img.png)
그래프 큐엘에 대한 강의를 듣고 실제 코딩 후 기록을 위해 블로그에 남기고 있는데요. Graph QL - 1 [GraphQL] GraphQL 시작하기 2020년에는 새로운 것을 시작하기로 마음을 먹었었는데 그동안 아버지 홈페이지 리뉴얼 작업으로 인하여 React + MobX + Styled-Component + Firebase + AWS로 프로젝트를 구성하고 끝내느라 시작하지 못하였습니.. eomtttttt-develop.tistory.com Graph QL - 2 [GraphQL] GraphQL 시작하기 - 2 (Query with parameter) 요즘 그래프 큐엘로 서버를 구축하고 있고 공부 중인데, 지난번에는 Query와 기본적인 개념에 대하여 포스팅했었습니다. 이번에는 복습 차원에서 param..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bJ2eAb/btqB40cUnTi/idLKUkbpowIFHQPE1rI5Q1/img.png)
정규식은 저도 늘 어려워하는데, 이유는 막상 자주 쓰지도 않고 쓸일이 있을 때에는 늘 stackoverflow 를 이용해서 복붙을 하기 때문이죠. 그래서 늘 아쉬움이 남았고 차근차근 공부하고 싶은 마음도 있었습니다. 그러나 막상 다른 공부에 치여 (Javascript, React, GraphQL, Node 등등등 에 핑계거리) 보질 못했는데 유명한 블로거인 Harry 님이 정리를 아주 잘해주신 글을 봐서 가져와봤습니다. 저도 틈날때마다 반복해서 읽어가며 대략적인 감각을 유지해야겠네요. 정규식 포기자를 위한 가장 쉬운 정규식 - 상 정규식 포기자를 위한 가장 쉬운 정규식 — 1 정규식 일타강사가 되어보자! medium.com 정규식 포기자를 위한 가장 쉬운 정규식 - 하 정규식 포기자를 위한 가장 쉬운 정..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/HxKmG/btqyG7MRVcy/aoHpYignJP0b3xkk5RSVD1/img.png)
안녕하세요. 엄티입니다. 오랜만에 글을 쓰네요. 요즘 블로그 관리가 소홀하네요. 열심히 하도록 노력해볼게요 오늘은 git remote 에서 머지가 되든, 삭제가 되든해서 branch 가 삭제가 되었는데 제 locale에서는 계속 남아있는 문제를 해결하려고 합니다. 방법은 아주아주아주 간단합니다. $ git remote prune origin 으로 하면 끝입니다. 참 쉽죠~~?
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/oE51a/btqwA2Ntxmh/a2kUb6vfAyHxg1FGt8BrJ1/img.png)
오늘은 가위바위보 게임을 바탕으로 React에 라이프 사이클, 고차 함수, Hooks useEffect에 대하여 포스팅 해보겠습니다. 계속 해서 언급 하지만 제 포스팅은 '제로초' 님의 리액트 강좌를 바탕으로 합니다. 제로초님의 웹게임 강좌 리액트 무료 강좌(웹게임) - YouTube www.youtube.com 먼저 라이프사이클에 대하여 알아보겠습니다. 리액트 라이프 사이클은 하나의 component의 생명 주기를 의미 하는데요. 처음 component가 rendering 되고 없어 질 때 까지 를 의미 합니다. 여러가지가 있는데, 기본적으로 componentDidMount, componentDidUpdate, componentWillUnMount 요 3가지가 가장 중요하죠. 대략적인 의미는 다음과 같..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/cVrqn2/btqvSLeIc8i/IXavkPyF0BKeTNjt3FnSyk/img.png)
You don't know JS에 PART 1에 마지막 장인 '작동 위임'에 대하여 포스팅해보겠습니다. 지금 까지 [[Prototype]]에 대하여 공부하였고 '클래스'나 '상속'의 맥락에서 [[Prototype]] 이 적절하지 않은 지 공부했습니다. 따라서 [[Prototype]] 은 자바스크립트에서 여타 다른 클래스 지향 언어들과 달리 한 객체가 다른 객체를 참조하기 위한 내부 링크라고 정의할 수 있죠. 또한 참조하는 객체에 존재하지 않는 프로퍼티/메서드를 참조하려고 할 경우 엔진은 [[Prototype]] 링크를 따라가며 연결된 객체마다 프로퍼티/메서드가 있는지 뒤져보고 발견되지 않으면 다음 [[Prototype]] 링크에 연결된 객체를 타고 이동하는데 이것을 '프로토타입 연쇄'라고도 정의하였습니다..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/reuWa/btqvuYxz4cD/QNJayWhuOiMsw6ERVc9yKK/img.png)
이번장에선 이론적인 설명이 많았습니다. 기존 객체지향 기반의 언어가 아닌 JS를 객체지향 언어처럼 쓰기 위한 노력들이 담겨 있었죠. 간단히 정리를 해보겠습니다. 1. 클래스 이론 클래스, 인스턴스에 대한 이론들은 사실 충분히 다른 포스팅에서 볼 수 있어요. 그렇기 때문에 크게 언급은 하지 않고 넘어가겠습니다. 간단히 말하면 제일 이해하기 쉬운게 붕어빵이죠. 붕어빵 틀을 클래스, 틀을 통해 나오는 붕어빵들을 인스턴스라고 생각하면 됩니다. 객체, 클래스, 인스턴스란...? [Java 용어정리] Object(객체), Class(클래스), Instance(인스턴스) 란? [Java 용어정리] Object, Class, Instance 란? object 객체, class 클래스, instance 인스턴스 에 대해..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/whmcC/btqvLvBWSIi/nkSotBZF4V9mgOb7iDydck/img.png)
오늘은 이터레이터 패턴에 대하여 포스팅해보겠습니다. 일단 정의부터 보시죠. 이터레이터 패턴 컬렉션을 표현하는 방법을 노출시키지 않으면서도 집합체 내에 있는 모든 객체들에 하나씩 접근하는 방법을 제공합니다. 반복자를 이용하여 내부 구조를 드러내지 않으면서도 클라이언트로부터 컬렉션 안에 들어 있는 모든 원소들을 접근할 수 있게 만듭니다. 예를 들어 설명해 보겠습니다. 어떤 컬렉션에서는 List로 아이템 원소들을 관리하고, 다른 컬렉션에서는 Dictionary로 아이템을 관리한다고 했을 때에 클라이언트 입장에서는 두 개의 원소들을 나열하려고 할 때 각기 다른 방법으로 나열해야 합니다. 하지만 이터레이터 패턴을 사용하면, 어떤 식으로 내부 구조가 짜여있던지 상관없이 클라이언트는 반복자를 이용하려 아이템을 나열할..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/0zHq6/btqvce9QEjm/uTBcj1aOx3IEYjScY6zKVk/img.png)
You don't know JS에 3 장 객체에 대하여 포스팅해보겠습니다. 앞서 this에 관해 포스팅했었는데 참고해주세요. 3.1 객체 정의 일반적으로 JS에서 객체는 선언적(리터럴) 형식과 생성자 형식, 두 가지로 정의할 수 있습니다.. // 선언적(리터럴) 형식 var myObj = { key: value // ... } // 생성자 형식 var myObj = new Object(); myObj.key = value; 두 형식 모두 생성되는 객체는 같습니다. 그러나 리터럴 형식은 한 번의 선언으로 다수의 키/값을 추가할 수 있고, 생성자는 한 번에 한 프로퍼티만 추가 할 수 없어요. 3.2 타입 자바스크립트는 대략 7가지 정도 타입이 있는데, null undefined boolean number s..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/z78eT/btqu5ePV08h/PnFYOMnBvCXz4OfDWnzI9K/img.png)
기본은 모르고 자꾸 개발만 하다 보니 이상하게 제 지식이 역삼각형 형태가 되는 것 같아서. 기본적인 책을 사서 읽어보고 정리를 하려고 합니다. 책은 한빛미디어에서 나온 "You don't know JS - 카일 심슨"의 책을 바탕으로 정리해보겠습니다! 우선 this는 모든 함수 스코프 내에 자동으로 설정되는 특수한 식별자입니다. 일단 스코프란 링크를 참조해 주세요. 일단 this 가 사용된 코드를 보겠습니다. function identify() { return this.name.toUpperCase(); } function speak() { var greeting = 'Hello, Im ' + identify.call(this); } var me = { name: 'Kyle' }; var you = { ..