라이브러리 [Swift/라이브러리] Cosmos Cosmos는 손쉽게 별점을 구현할 수 있는 Swift Open Source Library다. Cosmos 라이브러리를 사용하지 않고 직접 별점 뷰를 구현한다면 UIStackView 안에 UIButton을 5개 넣고 Button Action을 구현해야 할 것이다. 버튼이 클릭되었을 때는 tag를 이용해서 각 버튼의 이미지를 컨트롤할 것이다. 이 모든 것을 단 몇 줄로 구현할 수 있는게 Cos... swiftiOSCosmos라이브러리libraryCosmos Context API, Redux, Mobx, Swr, Recoil context를 이용하면 단계마다 일일이 props를 넘겨주지 않고도 컴포넌트 트리 전체에 데이터를 제공할 수 있다. 컴포넌트가 한 두 개 정도이면 크게 불편함도 없지만, 만약 컴포넌트가 3~4개 혹은 그 이상일 경우에는 props를 넘겨주는 것만으로도 굉장히 번거로워 질 수 있다. 하지만 context를 이용하면 많은 컴포넌트가 공통으로 state를 공유 할 수 있게 된다. context는... 리액트라이브러리TILTIL Vue.js 라이브러리 추천 목록 유용하게 사용하는 Vue 라이브러리 화면 우측의 Scroll의 경우 시스템 Scroll 디자인을 사용해도 디자인상 큰 문제는 없지만, 화면 안쪽에 overflow을 넣어 만든 element에 시스템 Scroll이 생길 경우 디자인을 해치는 경우가 많았다. 이럴 경우 Scroll의 디자인을 커스텀해서 넣어줄 경우 사이트의 완성도가 올라간다. vue bar 적용 전 후, 확실히 완성도가 올라간걸... 프론트엔드라이브러리vue.jsvue.js JavaScript 기반 라이브러리, 프레임워크 비교 프론트엔드 라이브러리 싱글 페이지 애플리케이션, 모바일 애플리케이션에 적합 라우팅, API 통신 등이 요구되는 대규모 애플리케이션에는 추가 라이브러리가 필요 TypeScript 활용이 쉬움 (사견) 현실적으로 (최소한 국내 프론트엔드 기준) 다른 라이브러리/프레임워크보다 쓰이는 곳이 훨씬 많기는 하지만, JavaScript에 능통하지 않다면 발을 들이기가 쉽지는 않은 것 같음 React, N... JavaScript프레임워크라이브러리JavaScript TIL 2021.02.12 git checkout은 git 2.23 부터 switch 와 restore 로 나누어서 사용할 수 있게 됐다. git restore는 어떤 특정한 커밋 단위를 참조할 수 있는 명령어이다. 이 말은, HEAD를 브랜치에서 분리해서 계층 관계가 변경/특정된 커밋을 가리키도록 하는 것이라고도 할 수 있다라고 생각한다. 언제 이 명령어를 쓸 수 있을까? 프레임워크는 어떤 특정한 프로그램을 만들기 ... gitgit restore프레임워크예외처리git switchTIL라이브러리git checkoutexceptionTIL Early Exit Pattern , 각각의 요소에 조건부렌더링 걸기 , input tag의 readOnly속성 , antD , Material UI , npm라이브러리 사용해보기 각각의 요소마다 렌더링 거는 방법 list라는 폴더가 있다. presenterItem이라는게 하나더 있다. 이 파일은 각각의 요소마다 렌더링 걸기위해 만든 파일이다. 각각의 요소마다 조건부렌더링 주기 설명하기 앞서 구조가 어떻게 되어있는지 짚고가자면 container에서 presenter로 댓글정보를 뿌려준다. presenter에선 data를 받아서 map으로 list에 뿌려준다. 그 각각의... input tag readOnly속성Early Exit Pattern댓글리스트React-player라이브러리 프레임워크 차이MaterialUI프레임워크각각의 요소에 렌더링 걸기antd라이브러리Early Exit Pattern Fetch API 말고 Axios를 사용하는 이유 Fetch API의 경우 아래 이미지와 같이 웹브라우저가 구버전일 경우 지원하지 않는 경우가 많습니다. 다만, Axios는 server, 즉 node.js에서 http module을 사용하고, client(browser)에선 를 통해 요청을 보냅니다. fetch는 url을 입력할때, Param이나 Query부분을 문자열 형태로 길게 작성해야하는 반면, axios는 객체의 형태로 Param, ... 라이브러리라이브러리 네이버 egjs-infinitegrid 사용기 간단한 개인 프로젝트를 진행할때는 라이브러리 사용 없이 무한 스크롤을 구현하지만, 수천개의 카드 컴포넌트를 무한 스크롤로 만들어야되는 프로덕트의 경우 라이브러리 사용이 권장된다. 가독성이 높기에 유지보수를 위해 권장된다. 또한, 일일이 scroll 높이에 맞춰서 fetch시점을 정한다던가, fetch를 기다리는 동안 화면에 어떤 식으로 구현할지를 복잡하게 작성하지 않아도 되기에 권장된다. d... 라이브러리TILTIL XSS 방어 dompurify 라이브러리사용하기 yarn add dompurify yarn add -D @types/dompurify 설치 후에 해서 사용해주면된다~! 실습 코드... 라이브러리DOMPurifyDOMPurify TIL 12 - React Basic Concepts 리엑트가 개발된 이유는 페이스북에서 페이스북의 UI를 더 잘 만들기위해서 고민을 하다 나온게 리엑트이라고 한다. 가장 쉽게 생각하면 리엑트는 자바스크립트 UI Library라고 생각하면 된다. 그러면 리엑트를 본격적으로 공부하기전에 라이브러리 그리고 프레임워크라는 컨셉이 뭔지 그리고 리엑트를 왜 쓰는지에 대해서 알아보자! 이 두가지 컨셉을 쉽게 이해하기 위해서 F1 레이스카를 만드는 과정을 ... 라이브러리신입개발자ReactReact ElementUI 페이지 나누기 구성 요소 2차 패키지 레코드를 업데이트하려면 다음과 같이 하십시오. 현재 데이터를 삭제해도 이전 페이지로 돌아가지 않는 문제가 해결되었습니다. 호출 방식을 개선했고 페이지 대상과 귀속 조회 이벤트만 전송해야 한다. 모델을 통해 페이지 업데이트 대상으로 변경되었습니다. IE에서 페이지 번호 리턴을 입력하면 전체 페이지 새로 고침 문제가 발생 호출 방법: paging-query.vue... 라이브러리Library
[Swift/라이브러리] Cosmos Cosmos는 손쉽게 별점을 구현할 수 있는 Swift Open Source Library다. Cosmos 라이브러리를 사용하지 않고 직접 별점 뷰를 구현한다면 UIStackView 안에 UIButton을 5개 넣고 Button Action을 구현해야 할 것이다. 버튼이 클릭되었을 때는 tag를 이용해서 각 버튼의 이미지를 컨트롤할 것이다. 이 모든 것을 단 몇 줄로 구현할 수 있는게 Cos... swiftiOSCosmos라이브러리libraryCosmos Context API, Redux, Mobx, Swr, Recoil context를 이용하면 단계마다 일일이 props를 넘겨주지 않고도 컴포넌트 트리 전체에 데이터를 제공할 수 있다. 컴포넌트가 한 두 개 정도이면 크게 불편함도 없지만, 만약 컴포넌트가 3~4개 혹은 그 이상일 경우에는 props를 넘겨주는 것만으로도 굉장히 번거로워 질 수 있다. 하지만 context를 이용하면 많은 컴포넌트가 공통으로 state를 공유 할 수 있게 된다. context는... 리액트라이브러리TILTIL Vue.js 라이브러리 추천 목록 유용하게 사용하는 Vue 라이브러리 화면 우측의 Scroll의 경우 시스템 Scroll 디자인을 사용해도 디자인상 큰 문제는 없지만, 화면 안쪽에 overflow을 넣어 만든 element에 시스템 Scroll이 생길 경우 디자인을 해치는 경우가 많았다. 이럴 경우 Scroll의 디자인을 커스텀해서 넣어줄 경우 사이트의 완성도가 올라간다. vue bar 적용 전 후, 확실히 완성도가 올라간걸... 프론트엔드라이브러리vue.jsvue.js JavaScript 기반 라이브러리, 프레임워크 비교 프론트엔드 라이브러리 싱글 페이지 애플리케이션, 모바일 애플리케이션에 적합 라우팅, API 통신 등이 요구되는 대규모 애플리케이션에는 추가 라이브러리가 필요 TypeScript 활용이 쉬움 (사견) 현실적으로 (최소한 국내 프론트엔드 기준) 다른 라이브러리/프레임워크보다 쓰이는 곳이 훨씬 많기는 하지만, JavaScript에 능통하지 않다면 발을 들이기가 쉽지는 않은 것 같음 React, N... JavaScript프레임워크라이브러리JavaScript TIL 2021.02.12 git checkout은 git 2.23 부터 switch 와 restore 로 나누어서 사용할 수 있게 됐다. git restore는 어떤 특정한 커밋 단위를 참조할 수 있는 명령어이다. 이 말은, HEAD를 브랜치에서 분리해서 계층 관계가 변경/특정된 커밋을 가리키도록 하는 것이라고도 할 수 있다라고 생각한다. 언제 이 명령어를 쓸 수 있을까? 프레임워크는 어떤 특정한 프로그램을 만들기 ... gitgit restore프레임워크예외처리git switchTIL라이브러리git checkoutexceptionTIL Early Exit Pattern , 각각의 요소에 조건부렌더링 걸기 , input tag의 readOnly속성 , antD , Material UI , npm라이브러리 사용해보기 각각의 요소마다 렌더링 거는 방법 list라는 폴더가 있다. presenterItem이라는게 하나더 있다. 이 파일은 각각의 요소마다 렌더링 걸기위해 만든 파일이다. 각각의 요소마다 조건부렌더링 주기 설명하기 앞서 구조가 어떻게 되어있는지 짚고가자면 container에서 presenter로 댓글정보를 뿌려준다. presenter에선 data를 받아서 map으로 list에 뿌려준다. 그 각각의... input tag readOnly속성Early Exit Pattern댓글리스트React-player라이브러리 프레임워크 차이MaterialUI프레임워크각각의 요소에 렌더링 걸기antd라이브러리Early Exit Pattern Fetch API 말고 Axios를 사용하는 이유 Fetch API의 경우 아래 이미지와 같이 웹브라우저가 구버전일 경우 지원하지 않는 경우가 많습니다. 다만, Axios는 server, 즉 node.js에서 http module을 사용하고, client(browser)에선 를 통해 요청을 보냅니다. fetch는 url을 입력할때, Param이나 Query부분을 문자열 형태로 길게 작성해야하는 반면, axios는 객체의 형태로 Param, ... 라이브러리라이브러리 네이버 egjs-infinitegrid 사용기 간단한 개인 프로젝트를 진행할때는 라이브러리 사용 없이 무한 스크롤을 구현하지만, 수천개의 카드 컴포넌트를 무한 스크롤로 만들어야되는 프로덕트의 경우 라이브러리 사용이 권장된다. 가독성이 높기에 유지보수를 위해 권장된다. 또한, 일일이 scroll 높이에 맞춰서 fetch시점을 정한다던가, fetch를 기다리는 동안 화면에 어떤 식으로 구현할지를 복잡하게 작성하지 않아도 되기에 권장된다. d... 라이브러리TILTIL XSS 방어 dompurify 라이브러리사용하기 yarn add dompurify yarn add -D @types/dompurify 설치 후에 해서 사용해주면된다~! 실습 코드... 라이브러리DOMPurifyDOMPurify TIL 12 - React Basic Concepts 리엑트가 개발된 이유는 페이스북에서 페이스북의 UI를 더 잘 만들기위해서 고민을 하다 나온게 리엑트이라고 한다. 가장 쉽게 생각하면 리엑트는 자바스크립트 UI Library라고 생각하면 된다. 그러면 리엑트를 본격적으로 공부하기전에 라이브러리 그리고 프레임워크라는 컨셉이 뭔지 그리고 리엑트를 왜 쓰는지에 대해서 알아보자! 이 두가지 컨셉을 쉽게 이해하기 위해서 F1 레이스카를 만드는 과정을 ... 라이브러리신입개발자ReactReact ElementUI 페이지 나누기 구성 요소 2차 패키지 레코드를 업데이트하려면 다음과 같이 하십시오. 현재 데이터를 삭제해도 이전 페이지로 돌아가지 않는 문제가 해결되었습니다. 호출 방식을 개선했고 페이지 대상과 귀속 조회 이벤트만 전송해야 한다. 모델을 통해 페이지 업데이트 대상으로 변경되었습니다. IE에서 페이지 번호 리턴을 입력하면 전체 페이지 새로 고침 문제가 발생 호출 방법: paging-query.vue... 라이브러리Library