Spread Operator 마침표를 연달아 3개(…)를 찍는 문법을 스프레드 오퍼레이터(Spread Operator)라고 합니다. Spread의 뜻은 (펼치다, 퍼트리다) 이며, 한글로는 ‘펼침연산자’ 라고도 합니다. 이 문법을 사용하면 객체 혹은 배열을 펼칠 수 있습니다. Spread Operator는 대괄호, 중괄호, 소괄호 안에서만 사용 ...

Settings $('.slider-items').slick({ rows: 1, //이미지를 몇 줄로 표시할지 개수 dots: false, //슬라이더 아래에 도트 네비게이션 버튼 표시 여부(true or false) ▶기본값 false appendDots: $('selector...

Using min-width // Small devices (landscape phones, 576px and up) @media (min-width: 576px) { ... } // Medium devices (tablets, 768px and up) @media (min-width: 768px) { ... } // Large devices (...

Web Storage HTML5에는 웹의 데이터를 클라이언트에 저장할 수 있는 새로운 자료구조인 Web Storage 스펙이 포함되어 있다. Web Storage의 개념은 키/값 쌍으로 데이터를 저장하고 키를 기반으로 데이터를 조회하는 패턴이다. 그리고 영구저장소(LocalStorage)와 임시저장소(SessionStorage)를 따로 두어 데이터...

/components/MyPage.vue <template> <div class="mypage"> <ul class="tab"> <li class="on"><button type="button">{{ follower.length }} 팔로워</button></...

Compositon API 프로젝트가 커지고 코드가 길어지면 작업하기가 어려워지는데 관련된 코드들을 찢어놓지 않고 개발하는 방법으로 composition API라는걸 제공한다. Options API 지금까지 했던 방법 : component에서 data()만들고 life cycle hook, components, computed 등 각 항목들을 신설...

간혹 코드짜다보면 props를 분명 전해줬는데 에러나고 멈추고 하는 경우가 있습니다. 그 경우 터미널이나 크롬 개발자도구 console 탭으로 들어가면 대부분의 에러는 해결가능한데 조용하게 에러나는 경우도 많습니다. 예를 들어 라우터 이런 것들은 뭔가 틀려도 에러로 알려주지 않습니다. 그래서 크롬 확장프로그램 중에 Vue-devtools 라고 ...

css *, *:before, *:after { -webkit-box-sizing: border-box; box-sizing: border-box; outline: none; -webkit-tap-highlight-color: transparent !important; -webkit-text-size-adjust: none; -...

PWA 웹사이트를 앱처럼 다운받아, 아이콘 클릭으로 실행할 수 있음 근데 사실은 브라우저 상태바가 제거된 웹임 이런식으로 앱 설치를 유도하는 것이 PWA 사이트 조건 manifest.json service-worker.js 2개 파일이 필요함 이 2개가 있는 사이트는 PWA로 자동 인식해서 크롬에서 설치팝업을 띄워줌 라이브러리 ...

computed vue에서 함수 만들 때 methods 또는 computed 함수 안에 만들 수 있다. methods와 computed가 다른 점 methods에 선언된 함수는 호출될 때 마다 실행됨 computed에 선언된 함수는 호출해도 다시 실행되지 않음. 컴포넌트 로드 시 한번 실행 후 그 값을 계속 저장해서 사용함 computed는 일...