본문 바로가기

전체 글61

[javascript] 이벤트 핸들러 1번만 적용하고 제거하기 기본적인 이벤트 핸들러의 선언 및 제거방법 //실행 될 이벤트 function test(){} 이벤트 핸들러 선언 element.addEventListener("click", test); 이벤트 핸들러 제거 element.removeEventListener("click", test); 익명함수를 콜백으로 쓰게 될 경우엔 element.addEventListener("click", function(){ test(); // 선언한 클릭이벤트가 전부 제거 되어버림 this.removeEventListener("click"); // arguments.callee 를 사용하면 원하는 이벤트만 제거 this.removeEventListener("click",arguments.callee); }); 활용 예) 비디오.. 2019. 12. 12.
[javascript] 브라우저 IE 감지 ie 브라우저로 접속 시에만 결과값이 보인다. 크로스브라우징 이슈가 있을 경우 브라우저 판단 후 body태그에 class를 추가해주면 css 작업시 편해진다. See the Pen IE 감지 by juein (@juein) on CodePen. 2019. 12. 12.
[javascript] 자주 사용하는 정규식 메모 자주 쓰는 정규식 //숫자 3단위마다 콤마 찍기 var numberWithCommas= function(num){ return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","); } // 아이디 체크 정규식 const regExpId = /^[a-z0-9_-]\w{5,20}$/; // 비밀번호 길이 체크 정규식 const regExpPassword = /^\w[6,16]$/; // 비밀번호 조합(영문, 숫자) 및 길이 체크 정규식 const regExpPassword = /^(?=.*[a-zA-Z])(?=.*[0-9]).{6,16}$/; // 이메일 체크 정규식 const regExpEmail=/^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.).. 2019. 10. 7.
[javascript] Math.random 을 사용한 난수 생성 shuffleRandom 함수가 전달받은 매개변수 n 개 만큼 배열을 생성 & 값을 섞어서 난수를 발생하는 방법 See the Pen js 난수 - Math.random() by juein (@juein) on CodePen. 2019. 10. 7.
[React] create-react-app 작업 내용을 build 하기 빌드를 하면 react 소스를 js 소스로 변환할 수 있다. 즉 NodeJs / React가 구축되어있지 않은 환경에서 동작도 되고, 소스 압축도 해준다. 빌드 하는 방법은 매우 간단하다. 먼저 package.json 파일 하단에 "homepage" : "원하는 경로" 를 적어준다. homepage 에 대한 안내 설명은 하단 링크를 참고한다. https://github.com/facebook/create-react-app/blob/master/docusaurus/docs/deployment.md#building-for-relative-paths 나는 상대경로를 사용하기 위해 "homepage": "./", 로 설정하였다. 경로 설정 후 yarn build 명령어를 입력하면 끝이다. 빌드가 끝나면 프로젝트.. 2019. 7. 16.
App을 Heroku에 배포하기 [출처 : https://anpigon.github.io/blog/kr/@anpigon/heroku-nodejs-app-heroku--1546967112451/] Heroku Heroku는 간단하게 사용할 수 있는 가벼운 클라우드 서버입니다. 참고로, 우리가 많이 사용하고 있는 busy.org가 Heroku에서 호스팅 되고 있습니다. 게다가 무료 가격 정책도 있습니다. 무료는 매월 550시간 사용이 가능합니다. 신용카드 정보를 추가로 입력하면 매월 1000시간 사용이 가능합니다. 그리고 30분 동안 사용하지 않으면 자동으로 슬립모드에 들어갑니다. 보통은 heroku-cli를 사용하여 heroku에 배포합니다. 하지만 지금은 쉽고 간단하게 하려고 합니다. 그래서 브라우저에서 배포하는 방법으로 진행할게요. .. 2019. 7. 16.