분류 전체보기(30)
-
[Angular] NGRX 적용 - (1) ngrx 동작 과정 이해하기
** 초보 개발자로 글에 수정해야 할 부분이 있을 수 있습니다. 정정해야 할 부분은 댓글로 소통 부탁드립니다! angular, react, vue 등의 SPA(Single Page Application)은 컴포넌트 간 변수 공유가 쉽지 않습니다. (물론, 방법이 있긴 있죠 ~ 예를 들어, angular의 경우에는 @Input, @Output 을 사용하는 것 등) 그래서 react 에서는 redux 등의 방법을 사용하고 있습니다. angular에도 redux와 비슷한 NGRX 가 있습니다! 그렇다면 🤗 ngrx 등이 어떻게 동작하는지 알아봅시다. 일반적으로 변수에 값을 할당한다면 한줄의 코드로 가능합니다. const temp = 'hello, world'; 하지만, ngrx의 경우에는 다음과 같은 flow..
2021.06.30 -
[js] window.location 객체
** 초보 개발자로 글에 수정해야 할 부분이 있을 수 있습니다. 정정해야 할 부분은 댓글로 소통 부탁드립니다! url 관련 객체는 사용할때 마다 검색해서 조각조각 알아왔었는데 전체적으로 정리해보고자 포스팅하였습니다 :) 예제 도메인) https://dongurami0502.tistory.com:8080/post?topic=window-location#references 1. Properties properties description url example hash url 상에 존재하는 anchor 값(# 이후의 값) 반환 #references host url 의 도메인과 포트 반환 dongurami0502.tistory.com:8080 hostname url의 도메인 반환 dongurami0502.tis..
2021.06.30 -
[js] event 전파 멈추기
** 초보 개발자로 글에 수정해야 할 부분이 있을 수 있습니다. 정정해야 할 부분은 댓글로 소통 부탁드립니다! 개발하다 보면 event를 추가하는 것뿐 아니라 제거해야하는 경우도 필요하더라구요~ javascript에서 이벤트 전파를 중단하는 방법은 크게 4가지가 있습니다. event.proventDefault() 현재 이벤트의 기본 동작을 중단합니다. event.stopPropagation() 현재 이벤트가 상위로 전파되지 않도록 중단합니다. event.stopImmediatePropagetion() 현재 이벤트가 상위뿐 아니라 현재 레벨에 걸린 다른 이벤트도 동작하지 않도록 중단합니다. (일반적으로 event.stopPropagation(), event.stopImmediatePropagation() ..
2021.06.24 -
babel 에서 polyfill 까지
** 초보 개발자로 글에 수정해야 할 부분이 있을 수 있습니다. 정정해야 할 부분은 댓글로 소통 부탁드립니다! 개발 하다보면 제일 어려운 부분 중 하나가 환경설정입니다. 코딩하기 더 쉬운 환경을 위한 설정임에 틀림없지만, 어렵더라구요... 🥲 여러 환경설정 중에서도 이번에는 babel, polyfill에 대해 알아보려 합니다. Babel 1. 바벨이란 무엇일까? MDN 홈페이지를 찬찬히 읽어 나가다 보면 가장 아래에 아래와 같은 "브라우저 호환성 표" 를 쉽게 찾을 수 있습니다. 이러한 브라우저 호환성을 해결하기 위한 방법이 babel 입니다. 바벨을 설명하기 앞서 크로스 브라우징(Cross Browsing) 개념에 대해 알아보자면... Cross-browser compatibility is the ab..
2021.06.23 -
[js] object to array 변환
** 초보 개발자로 글에 수정해야 할 부분이 있을 수 있습니다. 정정해야 할 부분은 댓글로 소통 부탁드립니다! ** 해당 글은 영문글의 번역본입니다. ES2017 부터, object to array 를 위한 3가지 기능이 제공됩니다. Array는 array를 위한 method를 제공하고 있죠! (달변가가 아니라... 쏘리 😝) Object를 array로 변환한다면, array method를 사용할 수 있겠죠 ?! yay~! 🥳 [Legacy Code] var numbers = { one: 1, two: 2, }; var keys = []; for (var number in numbers) { if (numbers.hasOwnProperty(number)) { keys.push(number); } } ke..
2021.06.23