lou@blog $ _

태양을 중심으로 지구, 지구를 중심으로 달을 움직이는 애니메이션을 만들어보았다. 코딩으로하는 애니메이션에 대해서 그동안 감이 좀없고 낮설었는데, (특히 게임 스크립팅도...) 익숙해질겸 건드려보고있는데 이거...재밌다..ㅋㅋㅋㅋㅋㅋ 우선 매 프레임마다 모든 요소를 다시그려주어야한다. 어렸을때 책 귀퉁이에 한장 한장마다 그려서 쭈루루룩 넘기면서 애니메이션을 만들었던것처럼, 다음장을 넘기고 그리고를 반복한다. 반복 윈도우가 로드되면, 루프를 시작한다. 이 루프는 일정한 프레임마다 영원히 돌면서 update()를 실행시키게 된다. var canvas = document.getElementById('canvas'); var context = canvas.getContext('2d'); window.onload ..

포스팅을 보다보면 javascript의 DOMContentLoaded와 jQuery의 ready()가 동일하다고 설명되어있다. 결론부터 말하자면, 동일한 시점에 Trigger되는 것은 맞지만 이들의 작동방식에는 중요한 차이점이 있다. document.addEventListeners('DOMContentLoaded', function () {}) $(document).ready(function () {}) DOM이 준비되어 조작해도 되는 상태가 되면, ready()나 DOMContentLoaded가 호출 된다. 하지만 DOMContentLoaded의 경우 addListener를 한 시점이 이미 이벤트가 일어난 시점(DOM이 준비되어버린)인 경우에는 호출되지 않는다. 반면에, ready()의 경우에는 이미 ..

JSX 뜻 JSX는 Javascript의 확장으로 Javascript의 이점을 그대로 사용할 수 있다. 때문에 {} 안에 Javascript 코드를 그대로 사용할 수 있다. 아래는 JSX의 예인데, 마치 HTML 태그처럼 생겼다. 하지만 HTML 태그처럼 적어도 되는건 문법적인 허용이고, 실제로는 Javascript로 변환되어 아래와 같은 React Element로 바꾼다. const element = ( Hello, World! ) const element = React.createElement( 'h1', {className: 'greeting'}, 'Hello, world!' ); Virtual DOM은 React에서 어떻게 동작하는가 React는 가상의(Virtual) DOM을 생성하는데, Com..

Selenium은 웹 드라이버를 통해 웹 브라우저를 자동화하여 웹 테스트를 도와주는 툴이다. 말은 착하지만 매크로를 만들거나 크롤링 할때도 도움이 된다. ^^ 실제 브라우저를 띄우고 코드를 수행할 수 있으며, 일반적으로 크롤링 하는 방식보다 훨씬 더 상호작용을 사람같이! 할 수 있다. 페이지가 다 뜰때까지 기다리고, 클릭하고, 입력하는 등... 그러면 Node.js 에서 selenium을 사용하는 방법을 익혀보자. 패키지 설치 먼저 selenium-webdriver 패키지를 설치해야한다. npm i selenium-webdriver 파이어 폭스 브라우저로 Selenium을 실행해야 할 경우, geckodriver를 설치해야한다. npm i geckodriver 실행환경이 Ubuntu일 경우 geckodr..

CasperJS 설치 후 버전을 확인해보면 아래와 같은 오류가 뜰때가 있다. /usr/bin/env: ‘python’: No such file or directory Python이 설치안되서 그런 것이므로 python을 설치 해 준다. sudo apt-get install python-is-python3

123Math.radians = function(degrees) { return degrees * Math.PI / 180;};Colored by Color Scriptercs 라디안 값을 구해야할 일이있었어서 올려둔다~ㅎㅎlet number = 3;Math.radians(number);이런식으로 원래 Math 객체 사용하던 것처럼 깔끔하게 사용가능하다.

1. NPM 다운로드먼저 NPM을 이용해 nodemailer와 nodemailer-smtp-transport 모듈을 다운받는다. 1npm i nodemailer nodemailer-smtp-transport -Scs 2. 구글 계정 설정그리고 자신이 사용할 구글 아이디로 구글에 접속 후에https://myaccount.google.com/lesssecureapps 에 들어가서 활성화,https://accounts.google.com/DisplayUnlockCaptcha 에 들어가서도 활성화를 한다. 3. 코드 작성설정 후에 다음과 같이 코드를 작성하면 메일이 날아온다.코드 출처: https://stackoverflow.com/questions/19877246/nodemailer-with-gmail-and..

Medium 원문 링크https://medium.com/front-end-hacking/learn-using-jwt-with-passport-authentication-9761539c4314

이 놈의 MYSQL 테이블 생성 쿼리는 왜이렇게 쓸때마다 헷갈리는건가...포스팅해서 써놔야지.. CREATE TABLE `cust_site` ( `cust_id` varchar(30) NOT NULL, `const_site` varchar(5) NOT NULL, `enroll_yn` char(1) DEFAULT NULL, `enroll_date` varchar(45) DEFAULT NULL, PRIMARY KEY (`cust_id`,`const_site`)) ENGINE=InnoDB DEFAULT CHARSET=utf8;

https://stackoverflow.com/questions/14340894/create-xml-in-javascript첫번째 답변 참고