낭만 프로그래머

입력후 엔터(Enter) 키를 눌렀을 때 이벤트를 발생하고 싶을 경우에 사용하면 된다. 예로 로그인 할때 패스워드를 입력하고 엔터를 눌렀을 때 로그인을 해야 될 때 1. 이벤트 발생시 수행할 함수를 작성 function enterkey() { if (window.event.keyCode == 13) { // 엔터키가 눌렸을 때 } } 2. 이벤트 대상에 작성 참조 : https://cofs.tistory.com/12

브라우저에서 뒤로 가기를 누를 경우 캐시가 사용되어 질 때가 있는데 그럴 때 서버에서 페이지를 다시 호출하지 않는 문제가 있다. 예를 들어 로그인을 한 상태에서 뒤로가기를 누를 시에 캐시를 사용하여 페이지를 불러 들여진다. 서버에서 페이지를 호출해야 로그인 여부에 따라서 UI가 변경 되는데 난감했던 사례가 바로 이것이다. 그래서 구글링해서 찾았다. 100%로는 아니지만 만족 스럽니다. ㅎㅎ 참조 : http://chomman.github.io/blog/programming/web/%EB%A9%94%ED%83%80%ED%83%9C%EA%B7%B8%EB%A5%BC-%EC%9D%B4%EC%9A%A9%ED%95%B4-%EC%BA%90%EC%8B%9C%EB%A5%BC-%EA%B4%80%EB%A6%AC%ED%95%..

JQuery의 ajax 사용시에 Post방식으로 Form 안의 input 값들을 넘겨야 할 경우에 간단하게 사용 될 수 있다. jQuery("#Form ID").serialize() function login() { jQuery.ajax({ type: "POST", url: 'restapi/login.do', data: jQuery("#loginForm").serialize(), success: function(msg) { if(msg.status == 'ok') { window.location.replace('index.jsp'); } else { alert(msg.message); } }, fail: function() { ; } }); }

1. Atom 설치https://atom.io/ 2. angular 프로젝트 생성 ng new study 3. Atom 실행 cd study atom . 4. atom-typescript 패키지 설치- atom-typescript 로 검색 후 설치 5. linter 패키지 설치- linter 로 검색 후 설치참고 : https://github.com/steelbrain/linter 6. editorconfig 패키지 설치- editorconfig 로 검색 후 설치참고 : https://github.com/sindresorhus/atom-editorconfig 7. file-icons 패키지 설치- file-icons 로 검색 후 설치참고 : https://github.com/file-icons/atom

1. Node.js 설치http://blog.miyam.net/44 2. Angular CLI 설치 npm install -g angular-cli 3. 프로젝트 생성 ng new firstproject 4. 개발서버 시작 cd firstproject ng serve --host 0.0.0.0 --port 4201 --live-reload-port 49153 5. 운영서버 배포를 위한 빌드 ng build -> dist 폴더가 생성됨. 6. 방화벽 해제 ( 4021 Port)http://blog.miyam.net/7

1. bootstrap은 총 12개의 컬럼을 사용 2. Grid 클래스들 - col-xs-* : 모바일 - col-sm-* : 태블릿 - col-md-* : 데스크탑 - col-lg-* : 큰 데스크탑 3. 예제 .col-md-8 .col-md-4 .col-md-4 .col-md-4 .col-md-4

나의 첫번째 Bootstrap 열심히 하자 1. 반응형 웹 페이지 적용 (5라인)2. bootstrap css 적용 (6라인)3. jquery script 적용 (7라인)4. bootstrap script 적용 (8라인) 5. container 종류 (9라인) - .container : 컨테이너 넓이가 고정 - .container-fluid : 컨테이너가 전체 넓이를 사용

1. 기본 bootstrap 다운로드 http://getbootstrap.com Download Bootstrap : 가장 일반적인 것 Download source : 소스코드 Download Sass : Sass 2. 구조