저번 포스팅에 이어 또다른 미션이 전달되었다.📌프론트엔드 예시로 살펴보는 SOLID 원칙 2)개방-폐쇄 원칙, 리스코프 치환 원칙희박한 확률로 냐옹이도 나왔으면 좋겠어요.냐옹이가 나오면 대화도 나누고, 같이 산책도 갈 수 있어요.고양이 종류가 시즌 별로 바뀌고, 새로

미션 저번 포스팅 예시로 돌아가보자. 프론트엔드 예시로 살펴보는 SOLID원칙 1)단일 책임 원칙 이번에는 고양이의 종류를 다양하게 해달라는 요구가 들어왔다. > 그냥 고양이 외에도 러시안 블루, 코리안 숏헤어, 벵갈 고양이, 노르웨이 숲 이렇게 4가지 종류의 고양이

디자인패턴은 프로그래밍을 하다보면 누구나 한 번쯤은 그 중요성을 듣게 된다.그런데 React의 함수형 컴포넌트로 작업하는게 익숙하다면 디자인 패턴의 중요성은 들어봤어도, 어떻게 적용해야 하는지, 왜 꼭 배워야 하는지 의문이 들 수 있다.디자인 패턴 중 가장 유명한 G

iterator 패턴은 for문을 추상화 한 패턴으로 무언가를 반복하여 순서대로 처리하는 경우 사용된다.하나씩 꺼내서 처리하는 과정을 구현과 분리할 수 있다.컬렉션 구현 방법을 노출시키지 않으면서 그 집합체 안에 있는 항목에 접근할 수 있게 해준다.간단한 구현을 ite

throttle은 func을 반복적으로 호출하는 경우, 임의로 설정한 일정 시간 각격으로 콜백 함수 시행을 보장한다.throttle(func1, 100) => 0.1초 동안 10번을 호출해도 첫번째 함수만 실행되고 나머지는 무시되므로 1번만 시행된다.debounce는

knovaJS는 canvas API를 보다 쉽게 쓸 수 있도록 도와주는 라이브러리이다.Stage, Layer, Group, Shape으로 이루어져 있다.화면상에 보이는 캔버스 크기 및 이벤트를 관리shape, group등이 그려지는 공간layer내에서 shape들을 묶

사진 업로드사진 비율이 깨지지 않게 Canvas에 그리기사진 위에 그림그리기해당 사진 다운로드 하기demoinput 태그에 파일을 업로드e.target.files0 FileBloB을 FileReader을 이용하여 readAsDataURL로 변환한다.FileReader가

jsIntersection Observer API는 관측하는 Target Element가 viewPort에 교차하는 순간을 감지하는 API입니다.그러니까 Target으로 지정한 Element가 지금 화면에 보이는지 여부를 판단할 수 있습니다.option은 root, r

예시 홈 화면메뉴 바 ( 홈, 상세보기, Best상품)1) 홈 -> 메인 화면 물품 리스트 가져오기 API 호출2) 상세보기 -> 특정 리스트 정보 가져오기 API 호출3) Best 상품 -> Best 상품 리스트 가져오기 API 호출사용자가 API 호출을 완료해서 화

자식만 스크롤 될 순 없을까

https://github.com/maru5mango/magicboard파워포인트 같은 기능 + 약간의 포토샵 기능으로 웹 페이지 데모를 꾸미고, 그 내용을 html, css, js로 export 할 수 있는 웹 서비스를 만들어보려고한다.그래서 프로젝트는 크게