본문 바로가기

반응형
SMALL

Web + APP

TypeScript Modules 안녕하세요 ! 꼬동입니다. 주말에 할 건 없고, 글이나 쓸까하여 카페에 와보았습니다. 무슨 글을 쓸까 하다가.... 모듈에 관련해서 글을 써야겠다고 생각이 들어서 ! 모듈에 대해 써보겠읍니다. 개발을 하다보면, 모듈이라는 단어를 많이 접하게 됩니다. 추상적으로 해석하면, 모듈이라는 것이 하나의 기능 블록이라고 볼 수 있는데요. 하지만 우리는 전문적인 프로 개발자 어디 가서 "모듈은 하나의 기능 블록" 입니다. 라고 말하기엔 너무 짜치죠. 좀 더 세부적으로 알아보자고요. 애초에 모듈이라는게 건축학 쪽에서 쓰던 단어입니다. 16세기 때부터 써왔던 단어였는데, 이게 컴퓨터 공학 쪽에서도 쓰이게 된것이죠. 사실 개발이라는게 하나의 건물을 짓는거와 다름이 없으니까, 이를 그대로 써도 의미상 크게 다르지 않아서 쓸.. 더보기
HostListener & HostBinding 안녕하세요. 꼬동입니다. 회사 코드 리팩토링하다가 제대로 알고 있는거 같지않아서, 한 번 글을 써봤습니다. HostListener 와 HostBinding에 관한 글입니다. HostListener HostListener는 DOM event를 선언하여, 이벤트가 발생했을 때 핸들러 메소드가 실행될 수 있게 제공해주는 데코레이터 입니다. Option Description eventName? : string DOM event (ex : 'click') args? : string [] 메소드에 전달할 인수들 @Directive({selector: 'button[counting]'}) class CountClicks { numberOfClicks = 0; @HostListener('click', ['$event... 더보기
NGRX Store - An Architecture Guide (1) 안녕하세요. 꼬동입니다. 요새 PS5에 빠져서 게임만 하고 삽니다. 그러다 PS5 놔두고 고향에 내려와서 디지털 노마드를 하고 있는데, 퇴근하면 할 게 없고, 글이나 번역해서 쓸까해서 좋은 글을 챙겨와봤습니다. https://blog.angular-university.io/angular-ngrx-store-and-effects-crash-course/ Ngrx Store - An Architecture Guide Learn the benefits of store architectures, when to use them and why, what use cases do they benefit the most? blog.angular-university.io 2022년에 쓴 따끈따근한 좋은 글이더군요. 사실 .. 더보기
attr vs attr.name 개발을 하다가 궁금한게 생겼더랬죠. 이 둘의 차이가 뭘까요. https://stackoverflow.com/questions/60375207/when-use-name-vs-attr-name when use [name] vs [attr.name]? Does anyone know why you can use [id] and you must use [attr.contenteditable] as property binding in Angular? I have researched for some time and I can't find an answer. Why some html native attr... stackoverflow.com 그 대답은 여기서 찾아봤는데요. 설명을 시작해보겠습니다. 그 전에 가정을 해야.. 더보기
Angular 더 빠르게 - On Push 두 번째 이야기 안녕하세요. 지난 글에선 On Push 관련해가지고 얘기를 했더랬죠. https://ggodong.tistory.com/326 Angular 더 빠르게 - On Push CD / Immutability 안녕하세요. 꼬동입니다. 해당 글은 아래의 글을 번역한 글입니다. 약간 제이크 질렌할 닮으셨네여 https://blog.mgechev.com/2017/11/11/faster-angular-applications-onpush-change-detection-immutable-part-1/.. ggodong.tistory.com 이왕 Change Detection 뿌리 뽑죠. https://hackernoon.com/angular-2-4-visualizing-change-detection-default-vs-o.. 더보기
Angular 더 빠르게 - On Push CD / Immutability 안녕하세요. 꼬동입니다. 해당 글은 아래의 글을 번역한 글입니다. 약간 제이크 질렌할 닮으셨네여 https://blog.mgechev.com/2017/11/11/faster-angular-applications-onpush-change-detection-immutable-part-1/ Faster Angular Applications - Part 1. On Push Change Detection and Immutability On AngularConnect 2017 in London, I gave a talk called “Purely Fast.” In the presentation, I showed how step by step we can improve the performance of a busin.. 더보기
constructor과 ngOnInit의 차이는 ? 안녕하세요. 꼬동입니다. 오늘은 constructor과 ngOnInit의 차이를 설명드리려고 합니다. 간단하지만 명확하게 설명을 할 수 있냐라고 제목과 같은 질문을 했을 때 저희는 아마 어버버하게 될 것입니다. ES6 클래스 문법의 표준으로 클래스에서 인스턴스를 생성하는 시점에 호출되는 메서드입니다. constructor가 호출될 땐 앵귤러가 초기화 작업을 수행하기 전이므로 컴포넌트의 속성 가운데 템플릿과 바인딩한 속성이나 부모 컴포넌트로부터 전달받은 속성 등의 초기화를 보장하지 않습니다. @Input으로 넘겨 받은 데이터가 되겠죠. 그렇기 때문에 constructor에는 순수하게 객체의 생성 시점에 필요한 간단한 초기화 로직만 넣도록 합시다. API 호출이나 앵귤러 제공하는 기능은 반드시 ngOnIni.. 더보기
setTimeout의 this와 / window.setTimeout을 하지 않는 이유 안녕하세요. 꼬동입니답. 오늘은 setTimeout 메소드에 관련해서 얘기를 해보려 합니다. setTimeout 메서드는 지정한 시간 후에 함수나 지정한 코드를 실행하는 타이머를 설정하는 메서드입니다. 그리고 clearTimeout으로 이를 취소할 수 있죠. 비슷한 함수로는 setInterval이 존재합니다. setTimout에서 this의 경우 여러분 예상과는 다르게 동작할 수 있습니다. 그 이유는 setTimeout이 실행하는 코드는 setTimeout을 호출했던 함수와는 다른 실행 맥락에서 호출되기 때문인데요. 호출 함수의 this 키워드 값을 설정하는 일반적인 규칙이 여기서도 적용되며, this를 호출 시 지정하지도 않았고 bind를 바인딩을 하지 않는 경우 window를 가리키게 됩니다. 이를 .. 더보기

반응형
LIST