아주 오래전에 페이징을 해보곤 한동안 데이터 연동할 일이 없어서 그냥저냥 지내오다 급 SPA 방식으로 데이터연동을 하게 되면서 자연스레 페이징 작업도 하게 되었다. 이전 자료도 못찾을 뿐더러 기본공식이 있었는데... 생각날리가 만무~ 어찌어찌 코딩은 했는데......ㅠㅠ 날림 코딩이지만 나름 기록해 두려 한다. function updatePagination( idx, limit, btnLen, total ) { //목록이 없을 시 종료. if( total === 0 ){ $('.paging').empty(); return } //페이지(한페이지당 limit=10개) 당 총 개수에 대한 넘버 그룹핑(btnLen=5). //그룹핑하게 되면 [ [1,2,3,4,5], [6,7,8,9,10], [11] ] 이런..
Blob Blob은 일련의 데이터를 처리하거나 간접 참조하는 객체다. Blob이란 이름은 SQL 데이터베이스에서 유래하였으며 '대형 이진 객체(Binary Large Object)를 의미한다. 자바스크립트에서 Blob은 흔히 이진 데이터를 나타내며 해당 데이터의 크기가 매우 클 수도 있지만, 두가지 특징 모두 강제된 사항은 아니다. Blob은 대개 바이트의 크기를 알아내거나 해당 MIME 타입이 무엇인지 요청하며, 데이터를 작은 Blob으로 잘게 나누는 등의 작업에 사용된다. "즉, 데이터 자체라기보다는 데이터를 간접적으로 접근하기 위한 객체인 것이다." var blob=.... blob.size //Blob의 바이트 단위 크기 blob.type //Blob의 MIME타입을 저장, 알 수 없으면 ""를 ..
일주일기간의 플젝으로 퍼블리싱 산출물만 내기로 하다 개발까지 하게 되어서 급하게 api 연동을 하게 되니 정신이 없었다. 그렇다고 기간이 일주일 밖에 남지 않은 상황에서 vue로 작업하기엔 내 머리속에 Vue 존재는 희미했다. "안녕~ 잘가 ~ Vue" "역시나 이런 플젝은 jquery 너 밖에 없다 !!!!!!!!" "하지만 라우트는 어케하고??????" "에이 몰라~!" 결론 jquery + es6 + axios + tweenmax + bootstrap 역시 이런 건 짬뽕이 쵝오~~~~~ 하여 플젝은 시작되었고 앵귤러를 했을때 기억을 더듬으면서 es6와 axios를 섞어가며 api연동 작업을 했다. ...................................... ....................
Blob로 파일 다운로드 실행시 type 지정 .rar - application/x-rar-compressed, application/octet-stream .zip - application/zip, application/octet-stream, application/x-zip-compressed, multipart/x-zip //res.data 는 통신 성공 후 response에 지정된 data 이다. let blob = new Blob([res.data], { type: 'application/zip' })// zip 형태로 파일을 다운로드 받게 된다. let url = window.URL.createObjectURL(blob) window.open(url);
단순히 1차원 배열 상태의 데이터를 받는다고 치자. 그런데 이 데이터를 이용해 한 화면에 8개 리스트를 만들어 보여주고 나머지들은 페이지처리한다고 할때 데이터가 담긴 배열을 조금 손볼 필요가 있다. JS /** * [ [...], [...] ] --> 다중배열 형식으로 데이터 만들어줌 * @param targetData * @param rowNm * @param colNm * @returns {Array} */ function multipleArrays( targetData, rowNm, colNm ) { var sort = []; for (var i = 0; i < rowNm; i++) { sort[i] = []; for (var j = 0; j < colNm; j++) { var ln = (i * c..
디바이스 정보 알아내기. 정리가 필요할 듯 ~ //사용법 getDeviceInfo( userAgentCheck() ); function userAgentCheck() { var isIE, isIEver, ieFlag, isEDGE, isChrome, chromeVer, isFireFox, fireFoxVer, isSafari, safariVer, isOpera, operaVer, isMac, isIPhone, isIPad, isIOSver, isAndroid, androidVer, androidMobile, androidTablet, browserInfo, userAgent = window.navigator.userAgent.toLowerCase(); //console.log( userAgent ) //..
html2canvas.js - https://html2canvas.hertzen.com/ html2canvas - Screenshots with JavaScript Try out html2canvas Test out html2canvas by rendering the viewport from the current page. Capture html2canvas.hertzen.com 예전에 저 html2canvas를 이용해 width 값을 입력하면 입력된 값에 맞게 화면 컨텐츠를 캡쳐하는 작업을 한적이 있다. 그에 해당하는 소스이다. 라이브러리를 이용한 거지만 꽤 어렵게 구현했다. 다시 사용될 일이 있을까 하고 생각하니까 급 슬퍼진다. ㅠㅠ ImageCapture.js var ImageCapture=( fu..
async function 선언은 AsyncFunction객체를 반환하는 하나의 비동기 함수를 정의한다. 비동기 함수는 이벤트 루프를 통해 비동기적으로 작동하는 함수로, 암시적으로 Promise를 사용하여 결과를 반환한다. 그러나 비동기 함수를 사용하는 코드의 구문과 구조는, 표준 동기 함수를 사용하는 것과 많이 비슷하다. - AsyncFunction : AsyncFunction 생성자는 새로운 async function 객체를 만든다. 자바스크립트에서 모든 비동기 함수는 사실상 AsyncFunction 객체이다. - Promise : 비동기 작업이 맞이할 미래의 완료 또는 실패와 그 결과 값을 나타낸다. function resolveAfter2Seconds() { return new Promise(re..
- Total
- Today
- Yesterday
- git
- 앵귤러
- svg모션
- icon font
- JsDoc
- react
- 반복문
- 코도바
- 자바스크립트
- anime.js
- 아이콘 폰트 만들기
- cordova
- 내장요소
- RefreshToken
- CSS
- React.StrictMode
- 태그
- interceptors
- vue-router
- IntrinsicElements
- svg icon font
- for of 구문
- Vue3
- Angular
- svg 폰트
- git checkout -b
- react-router-dom
- Aptana
- 리프래시토큰
- Intrinsic
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |