방문해 주셔서 감사합니다! 항상 행복하세요! - 문의사항은 메일 또는 댓글로 언제든 연락주세요. - "해줘","답 내놔" 같은 질문은 답변드리지 않습니다. - 메일주소 : lts06069@naver.com Javascript72 브라우저 개발도구 이벤트 감지(javascript detect development tool working) 자바스크립트로 브라우저의 개발도구가 동작하는지를 확인하는 코드입니다. 이러한 천재적(?)인 생각을 만드신분께 정말 대단하다는 말씀을 드리고 싶습니다. !function() { function detectDevTool(allow) { if(isNaN(+allow)) allow = 100; var start = +new Date(); // Validation of built-in Object tamper prevention. debugger; var end = +new Date(); // Validates too. if(isNaN(start) || isNaN(end) || end - start > allow) { // input your code here when devtools detected. } } i.. 2022. 2. 24. Javascript 비밀번호 정규식 검증하기 1. 최소길이 6, 1개이상 문자, 1개이상 특수문자 function isOkPwd(password){ let regex = /^(?=.*[A-Za-z])(?=.*\d)(?=.*[@$!%*#?&])[A-Za-z\d@$!%*#?&]{6,}$/ if( !regex.test(password) ) { return false } return true } 2. 최소 6자, 하나 이상의 대문자, 하나의 소문자 및 하나의 숫자 정규식 function isOkPwd(password){ let regex = /^(?=.*[A-Za-z])(?=.*\d)(?=.*[@$!%*#?&])[A-Za-z\d@$!%*#?&]{6,}$/ if( !regex.test(password) ) { return false } return true } 2021. 12. 6. 안녕 Javascript ThreeJs, Three.js(자바스크립트 트리Js) 트리Js(three.js)는 3d 형태의 기능을 웹에서 쉽게 구현 할 수 있는 라이브러리(프레임워크) 입니다. 여러 사용자들에 의해서 이미 검증이 완료 되어있으며, 잘만 사용 한 다면 게임도 만들 수 있습니다. 마치 웹에서 유니티(Unity)를 하는 느낌과 비슷 합니다. 장면(scene), 카메라(camera), 대상(mesh), 조명(light), 렌더러(renderer) 등 대표적으로 5개의 형태로 구현되어 있습니다. 또한 3D 효과를 지원하므로 벡터에 대한 공간 개념을 잘 알고 접근해야 합니다. 장면(scene)과 대상(mesh)을 통해 화면이 구성이 되면(그림이 그려 지면) 카메라(camera)에 의해서 사용자가 바라보는 모양의 형태가 결정이 되고 조명(light)이 음양 및 그림자를 결정해 주어.. 2021. 6. 22. 익스플로러 ES6(ECMA6) 쉽게 적용하기 익스플로러에서 ES6 이상의 문법은 지원되지가 않습니다. 그래서 개발 할 때 웹페이지는 매우 예전 스타일의(?) 코드로 작성을 해야 하였습니다. 그래서 파셀, 웹팩 같은 번들러에 바벨 로더를 붙여서 개발한 뒤에 페이지에 기능을 추가하여야 했습니다. 그러나 이러한 번들러를 사용하지 않고 좀 더 쉽게할 수 있는 방법이 있습니다. 익스플로러에서 아래 코드를 한번 실행하여 봅니다. 이를 실제 익스플로러에 실행하면 아래와 같은 결과가 나오게 됩니다. ECMA6에서의 멋진 기능인 class 기능이 익스플로러에서 이상 없이 동작하는 것을 볼 수 있습니다. 위 코드에서 유의해야 되는 점은 사용할 스크립트에 type값으로 "text/babel"을 부여해야 한다는 점 입니다. 이상으로 익스플로러(explorer)에서 ES.. 2021. 6. 17. 프론트 개발 환경의 중심 번들러(Javascript development environment bundler) 자바스크립트(Javascript)는 브라우저에서 동작하기 위한 방법을 위해 개발된 인터프리터 언어 입니다. 웹 개발자(web developer)에 의해서 js파일 또는 html파일에 각종 명령어로 해당 페이지에서 동작 할 행위를 기술하고, 사용자는 http 또는 https같은 프로토콜을 활용하여 브라우저에서 해당 파일들을 받아서 화면을 구성 합니다. ECMA5 버전, HTML4 까지만 하더라도 웹에서의 할 수 있는 기능은 제한적이였습니다. 그래서 플래쉬(Flash) 같은 다른 프로그램의 도움을 받아서 화면을 구성하고는 하였습니다. 시간이 흘러 ECMA6, HTML5이상의 버전이 나오면서 많은 기능이 브라우저에서 단독으로 동작 할 수 있게 되었습니다. 다양한 방법과 라이브러리 등이 등장 하였고 규모는 점점.. 2021. 6. 14. Jquery ajax file progress(Jquery ajax 파일 프로그래스) $.ajax(아작스)는 Jquery(제이쿼리)를 활용하여 비동기 방식으로 파일을 전송하는 방법을 의미 합니다. ajax는 XMLHttpRequest(줄여서 XHR)를 사용하여 서버와의 통신을 주고 받습니다. 기존에 XMLHttpRequest를 활용하려면 문법적으로 길고 어려워 좀 더 쉽게 사용할 수 있게 해준 것이 바로 ajax라고 합니다. ajax에 파일이 전송되는 현황을 보려면 ajax속성에 존재하는 xhr이라는 값을 할당하여 주면 됩니다. 전송하는 데이터는 FormData 객체를 사용하여 직관적이고 쉽게 할 수 있습니다. const param = new FormData() param.append('일반데이터1', '값1') param.append('일반데이터2', '값2') param.append(.. 2021. 5. 27. 이전 1 2 3 4 5 6 ··· 12 다음
