Front-End 검색 결과

해당 글 14건
반응형

Vue-CLI를 이용한 Vue프로젝트 생성

먼저 Vue-CLI 를 이용하기 위해서는 Node.js과 NPM이 설치되어있어야 한다. 설치가 안된 경우 https://do-study.tistory.com/66 을 참고하여 설치할 수 있다. NPM을 이용하여 Vue-CLI 설치 (3.0.x)NPM이 설치되어있으면 아래 명령어로 Vue-CLI 를 매우 간단하게 설치할 수 있다. # Vue-CLI 설치 npm i -g @vue/cli # 버전 확인을 통해 정상설치 확인 vue --version-g 옵션은 글로벌 패키지로 설치한다는 옵션으로 해당 PC 개발환경의 모든 프로젝트에서 사용이 가능하도록 하는 것이다.Vue-CLI를 이용하여 프로젝트 생성먼저 CMD창에서 프로젝트를 생성할 경로로 이동한다. 만약 C:\work 디렉토리 밑에 생성하고 싶다면 cd C..
Front-End/Vue 2018. 11. 28. 14:33

Node.js 및 NPM 설치

Node.js는 Javascript로 서버사이드 개발을 가능하게 해주는 Javascript 런타임으로 공식사이트에서는 다음과 같이 소개하고 있다.Node.js®는 Chrome V8 JavaScript 엔진으로 빌드된 JavaScript 런타임입니다. Node.js는 이벤트 기반, Non 블로킹 I/O 모델을 사용해 가볍고 효율적입니다. Node.js의 패키지 생태계인 npm은 세계에서 가장 큰 오픈 소스 라이브러리 생태계이기도 합니다.NPM은 Node Package Manager 혹은 Node Package Modules의 약자로 Node.js 기반의 모듈을 모아둔 집합 저장소이다.Node.js / NPM 설치 (윈도우 기준)1. https://nodejs.org/en/download/ 접속 2. LTS..
Front-End 2018. 11. 27. 15:04

jQuery 폼(form) 으로 JSON 데이터 생성

jQuery 를 이용해 form에 입력된 데이터를 JSON으로 생성하는 방법을 소개합니다. 1. JSON 데이터를 생성할 예시 form JSON 데이터 생성 var arrayData = $('#exampleForm').serializeArray(); var json = {}; $.each (arrayData, function (i, e) { if (json[e.name]) { if (!json[e.name].push) { json[e.name] = [json[e.name]]; } json[e.name].push(e.value || ''); } else { json[e.name] = e.value || ''; } }); // JSON 데이터 사용 $.ajax({ url: '/request/...' meth..
Front-End/jQuery 2018. 9. 20. 23:50

Bootstrap popover(팝오버) 커스텀

부트스트랩 홈페이지에서 볼 수 있는 예제는 다음과 같다. var options = {html : true,container : 'body',trigger : EVENT(click, hover 등),content : function() {return 'popover로 보여질 내용 HTML';}}; $('selector').popover(options); 위처럼하면 selector 요소에 trigger에 이벤트 발생 시 팝오버가 보여진다. 하지만 trigger를 hover지정 시 content에 지정한 function이 2번 실행하는 문제가 발생했다. 구글링 결과 Bootstrap이 popover를 위해 내부적으로 2번 호출되는 메소드가 있어서 그렇다는것도 있고,hover에 mouseenter, mouseo..
Front-End/jQuery 2018. 9. 17. 21:12