티스토리

IT

검색하기

블로그 홈

IT

itjunijuni.tistory.com/m

IT관련 정보가 있는! T블로그입니다.

구독자: 0

방명록 방문하기

주요 글 목록

Vuejs + vuetify 설치 1.vue cli 설치 install -g @vue/cli 2.vue 설치 (필요한부분 설정하여 설치) vue create Please pick a preset: Manually select features Check the features needed for your project: Choose Vue version, Babel, TS, PWA, Router, Vuex, CSS Pre-processors, Linter Choose a version of Vue.js that you want to start the project with 2.x Use class-style component syntax? Yes Use Babel alongside TypeScript (required for modern .. 공감수 0 댓글수 1 2020. 9. 6.
앵귤러[Angular] @auth0/angular-jwt 설치 ※ 관련 정보 - https://www.npmjs.com/package/@auth0/angular-jwt @auth0/angular-jwt JSON Web Token helper library for Angular www.npmjs.com - GitHub URL : https://github.com/auth0/angular2-jwt auth0/angular2-jwt Helper library for handling JWTs in Angular 2+ apps - auth0/angular2-jwt github.com 1. npm 멸령어 실행 - npm install @auth0/angular-jwt 2. 최상위 모듈(AppModule) import import { } form''; export functio.. 공감수 0 댓글수 0 2019. 6. 21.
앵귤러[Angular] 부트스트랩[ngx-bootstrap] 설치 ※ 관련 정보 - GitHub URL : https://github.com/valor-software/ngx-bootstrap valor-software/ngx-bootstrap Fast and reliable Bootstrap widgets in Angular. Contribute to valor-software/ngx-bootstrap development by creating an account on GitHub. github.com - DocumentAtion URL : https://valor-software.com/ngx-bootstrap/#/alerts Angular Bootstrap valor-software.com 1. 사전 조건 앵귤러CLI 설치 및 프로젝트 생성 2. npm 명령어 실.. 공감수 0 댓글수 0 2019. 6. 21.
앵귤러[Angular] CLI로 프로젝트 생성 캐시 삭제방법 - npm cache verify 1. CLI 설치 - npm install -g @angular/cli ※ 구버전 삭제방법 npm uninstall -g @angular/cli 2. 프로젝트 생성 - ng new 프로젝트명 - Would you like to add Angular routing? + yes - Which stylesheet format would you like to use? + css / scss / sass / less / stylus 중 선택 3. 프로젝트 실행 - ng serve 브라우저 url : http://localhost:4200/ 공감수 0 댓글수 0 2019. 6. 21.
일렉트론 [Electron] 배포 Installer 생성하기 일렉트론에서 일반적으로 electron-builder 또는 electron-packager 를 사용 개인적으로는 electron-packager는 사용하기 편하지만 디테일한 부분을 수정하기에는 번거로움 샘플링 결과 electron-builder로 사용함 - electron-builder + GitHub URL : https://github.com/electron-userland/electron-builder electron-userland/electron-builder A complete solution to package and build a ready for distribution Electron app with “auto update” support out of the box - electron-u.. 공감수 3 댓글수 1 2019. 4. 19.
일렉트론[Electron] 설치 방법 ※ 일렉트론 설치 - URL : https://electronjs.org/docs/tutorial/first-app - 선행작업 + npm 설치 - npm init + package name[프로젝트 명] : 입력 + version[파일의 버전] :입력 + description[수행 작업 내용] : 입력 + entry point : 입력 + test command : 입력 + git repository[github 저장소] : 입력 + keywords[프로젝트 키워드] : 입력 + author[개인이나 팀 또는 회사명등] : 입력 + license[라이센스에 대한 내용] : 입력 + Is this OK? (yes) : 입력 - npm install electron --save-dev ※ 일렉트론 예제 설.. 공감수 0 댓글수 0 2018. 10. 12.
앵귤러[Angular] 라이프사이클 - 생명주기 + 컴포넌트와 지시자는 생명주기를 가진다. (컴포넌트나 지시자가 생성되고 파괴될 때까지의 과정) ngOnInit() : 컴포넌트나 지시자가 생성될때 ngOnChanges() : 이벤트에 의해서 컴포넌트의 상태가 변경될시 ngOnChanges | ngDoCheck를 호출한다. ngDoCheck() : 컴포넌트의 상태 변경을 감지한 후에 항상 호출 ngAfterContentInit() : 외부 콘텐츠가 컴포넌트 뷰로 들어갈때ngAfterContentChecked() : ngAfterContentInit, ngAfterViewChecked 이후 바로 호출 되는 메서드로 뷰의 상태가 변경된 이후 처리할게 있을때 사용ngAfterViewInit() : 컴포넌트 뷰와 자식 뷰가 초기화될때ngAfterV.. 공감수 1 댓글수 0 2018. 6. 7.
JSDoc JSDoc JSDoc은 javascript 모듈에서 사용되는 각각의 클래스, 함수들에 대한 정의를 JSDoc에서 정의한 표준 주석양식에 맞춰 작성하게 되면 그에따른 자동화된 개발 래퍼런스 문서가 만들어지게 된다. 마크다운 문서로 래퍼런스 문서를 제공하여 gitbook 같은 호스팅 서비스에 등재하게 되면 하나의 인쇄물로서 출력도 가능하다.이러한 방법은 개발자가 일일히 래퍼런스 문서를 만들지 않아도 래퍼런스 문서를 만들 수 있는 이점이 있으며 표준화된 주석 사용으로 협업 및 인수인계가 원할하게 된다. 사실 다른 Doc 툴도 있지만 해당 서비스가 가장 유력하다. https://github.com/jsdoc3/jsdoc JSDoc 샘플링한 문서도 같이 올려봅니다.ㅎ test.js 파일 ==========.. 공감수 0 댓글수 0 2017. 9. 12.
JSON.parse(), JSON.stringify() JSON.stringify() object -> string JSON.parse()string -> object 공감수 0 댓글수 0 2017. 6. 30.
모바일웹 터치 이벤트 touchstart, touchmove, touchend, touchcancel 모바일 브라우저에서는 마우스 이벤트와 별도로 터치 이벤트를 지원합니다.모바일 웹 페이지에서 사용되는 터치 이벤트 touchstart: 스크린에 손가락이 닿을 때 발생한다touchmove: 스크린에 손가락이 닿은 채로 움직일 때 발생한다touchend: 스크린에서 손가락을 뗄 때 발생한다touchcancel: 시스템에서 이벤트를 취소시킬 때 발생한다. 정확한 발생 조건은 브라우저마다 다르다. 터치를 취소한다는 것에 대한 표준이 정의되지 않아 각 브라우저마다 다르게 발생하여 touchend 이벤트로 간주해도 무방하다. 공감수 1 댓글수 0 2017. 6. 28.
모바일 PC 여부확인 테스트 모바일 PC확인여부 소스======================================================================================== 공감수 0 댓글수 0 2017. 4. 25.
Jquery[제이쿼리] radio[라디오버튼] value값 확인방법 데모포함 라디오버튼 value값 확인 방법입니다.!! 방법1 $('input[name="gender"]').on('click',function(){ alert( $(this).val() ); }); 방법2 $('input[name="b1"]').on('click',function(){ alert( $('input[name="gender"]:checked').val() ); }); 첫번째 방법은 라디오 버튼을 클릭시 선택한 value값을 얻는 방법이고 두번째 방법은 라디오 버튼에 체크되어있는 값을 출력하는 방법입니다 ============ 데모 ============ 남성 여성 ET 공감수 1 댓글수 2 2017. 2. 6.
JavaScript[자바스크립트] Confirm 대화상자 삭제하시겠습니까? 위에있는 소스로 실행하시면!! 이렇게 종료 하시겠습니까? 라는 메시지 창이뜹니다..! 여기서 확인버튼을 누르면 true 취소버튼을누르면 false 이러헤 확인버튼을 누르면 if문안 코드가 실행됩니다.! 공감수 1 댓글수 1 2017. 1. 23.
JavaScript[자바스크립트] setTimeout() 사용방법!! 일정시간뒤에 실행 setTimeout(myFunction, 3000); 위에 부분에 "3000" 이란 값은 1000당 1초이기때문에 3초라는 의미입니다.~ "클릭하세요" 버튼을 누르고 난뒤 3초뒤에 alert()으로 "안녕하세요 ~ 주니주니입니다. 3초뒤에 뜬답니다" 라는 메세지창이 뜬답니다~. 그럼 이제 "클릭하세요" 버튼을 클릭해볼까요~ 짜잔~ 3초뒤에 이렇게 메세지창이 뜬답니다.~ 공감수 0 댓글수 0 2017. 1. 11.
JavaScript[자바스크립트] charat() 문자자르기 예제입니다.! charAt(0); 공감수 0 댓글수 0 2017. 1. 10.
JavaScript[자바스크립트] concat() 문자열합치기 예제입니다.! concat()로 변수text1. text2의 값을 붙여보았습니당!! 위에보시면 아시겠지만 간단하죵??ㅎㅎ 실행하면 이렇게 나온답니당~ 공감수 0 댓글수 0 2017. 1. 9.
JavaScript[자바스크립트] toLowerCase 영문 대문자 문자열 소문자로 변경하기 위에처럼 코딩하시면 된답니다~ "영문 대문자 문자열 변수".toLowerCase(); 이렇게 사용하시면된답니다.!! 실행하시면 위에처럼나와요 "클릭하세용" 버튼을 클릭하면 "Hello World!" 의 값이 "hello world!" 이렇게 변경된답니다. 공감수 0 댓글수 0 2017. 1. 7.
JavaScript[자바스크립트] toUpperCase 영문 대문자로 변경하기 저렇게 코딩하시면됩니당~~ id가 demo 인 p태그의 내용이 "Hello World!" 입니다. "클릭클릭" 버튼을 누르면!! "HELLO WORLD!" 가 된답니다. 아직 "클릭클릭" 버튼을 누르기전입니다.!!! 버튼을누르면!! 이렇게 대문자로 ~ 변경된모습입니당 ㅎㅎ 공감수 0 댓글수 0 2017. 1. 4.
JavaScript[자바스크립트] substring 사용방법입니다...!! var str = "substring 사용방법입니다.!!"; document.getElementById("demo").innerHTML = str.substring(10,14); 위에처럼 코딩하시면 된답니다 . str변수안에 있는 문자를 10번째에서부터 14번째까지의값이 나온답니당! 실행을하면 이렇게 "사용방법" 이라는값이 나온답니다.~ 궁금한점이나 !! 사용방법에대해서 궁금하시면 댓글 달아주세요~~ ㅎㅎ 공감수 0 댓글수 1 2017. 1. 4.
JavaScript[자바스크립트] slice method 사용방법 입니다.!!! var str = "제이쿼리공장장 주니주니 입니다.!"; document.getElementById("demo").innerHTML = str.slice(7,12); 위에 처럼 코딩하시면 된답니다.!! str 변수의 7번째부터 12번째까지의 글자만 가지고오는 기능이랍니다.!! 그다음 실행을 하면!!! 이렇게 짜잔~ 나온답니다. 짝 ~ 짝 ~ 짝 ~ 공감수 0 댓글수 0 2017. 1. 3.
JavaScript[자바스크립트] indexof 사용방법 입니다.!! var str = document.getElementById("p1").innerHTML; var pos = str.indexOf("공"); 위에 처럼 코딩하시면!! id가 p1인 P태그의 글자중 "공"이라는 글자가 몇번째에 있는지 알수있답니다.!! 실행하면 이렇게~ "제이쿼리공" 0 1 2 3 4 이렇게해서 4라는 값이 나온답니다~ 공감수 0 댓글수 0 2017. 1. 1.
JavaScript[자바스크립트] String Length 사용법 데모도있답니다.! 위에처럼 코딩하시면 id가 demo인 아이에게 txt 변수의 length의 값이 나온답니다.!! 짠~ 실행하시면 이렇게 txt변수의 length값이 나온답니다. 공백도 length의 값에 포함된답니다. =========================데모======================= 입력하세요 공감수 0 댓글수 0 2016. 12. 30.
JavaScript[자바스크립트] console.log 사용방법입니다.!! 이렇게 코딩하시면됩니다. 간단하죵? 실행을 하면 그냥 이렇게 뜬답니다.! 하지만!! 브라우저에서 (IE, Chrome 등등)F12 번을 눌러서 Console 탭에 보면!! 브라우저마다 개발자툴 단축키가 다릅니다. 위에서 console.log() 안에있는 값들을 확인할수있답니다.!! 공감수 0 댓글수 0 2016. 12. 28.
JavaScript[자바스크립트] 예약어 키워드 자바스크립트 예약어 break / do / if / switch / typeof / case / else / in/ this / var / catch / false / instanceof / throw / void / continue / finally / new / true / while / default / for / null / try / with / delete / function / return 등등이 있습니다.!! ㅎㅎ 공감수 0 댓글수 0 2016. 12. 20.
JavaScript[자바스크립트] write 사용방법 / 데모 자바스크립트[JavaScript] write 사용방법입니다. 위에처럼 코딩하신다음!! 실행을 하면!! 이렇게 결과가나온답니다. 10+10의 결과값이 이렇게 나온답니다. 이번에는 버튼을 만들어서 버튼을 클릭하면 값이나오도록 해보겠습니다. 클릭하세요 실행을 하셔서 "클릭하세요" 버튼을 누르시면 짜잔!! 이렇게 10+10 더한값이 이렇게 나온답니다. ㅎㅎ =================================================================== 안녕하세요!! write() 데모입니다.!! 클릭하세요 공감수 0 댓글수 0 2016. 12. 18.
JavaScript[자바스크립트] Math.floor / random 사용법 Math.random 사용 방법입니다.!! ========================================================== Math.random() 사용방법!!입니당 click ========================================================== 위에부분 소스들을 태그안에 적으시면됩니다. ㅎㅎ click 버튼을 클릭해보세요 ㅎㅎ Math.floor 사용 방법입니다.!! ========================================================== click ========================================================== 이번에는 floor 를 사용하여 0부터 10까지만 나오도록.. 공감수 0 댓글수 0 2016. 12. 16.
Javascript[자바스크립트] 연산자 종류 배우기 안녕하세요~ 제이쿼리공장장 주니주니 입니다. 오늘은 자바스크립트[javascript] 연산자 종류를 배워보겠습니다. 연산자 종류 =============================== 산술연산자 : *, /, %(나머지), +, - 관계(비교)연산자 : = , == , != 논리연산자 : && and , || or , & | ^비트 조건연산자 : 조건?참값:거짓값 대입연산자 : =, +=, -=, +=, /= =============================== 등등 여러가지 종류가있습니다. =============================== var a= 20; var b =16; document.write(a+"+"+b+"="+(a+b)+" "); document.write(a+.. 공감수 0 댓글수 0 2016. 12. 15.
AJAX load()메소드 예제 / 데모 사이트주소 =============================================================================== Let jQuery AJAX Change This Text Get External Content =============================================================================== 실행하셔서 버튼을 클릭하시면 된답니다. 데모주소 : http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_ajax_load 공감수 0 댓글수 0 2016. 12. 7.
AJAX post() 메소드 사용방법 입니다. post() 메소드를 사용하기위해서는 부분을 먼저 추가시키셔야합니다. 그다음 코딩된 소스를 보시면!! ============================================================= Send an HTTP POST request to a page and get the result back ========================================================== 실행하셔서 버튼을 클릭하시면 된답니다. 데모 사이트 주소 : www.w3schools.com/jquery/tryit.asp?filename=tryjquery_ajax_post 공감수 0 댓글수 0 2016. 12. 7.
AJAX get() 메소드 사용방법!! get() 메소드를 사용하기위해서는 우선 부분을 추가해주셔야합니다. ============================================================== Send an HTTP GET request to a page and get the result back =============================================================== 실행하셔서 버튼을 클릭하시면 된답니다. 데모 주소 : http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_ajax_get 공감수 0 댓글수 0 2016. 12. 7.

문의안내

티스토리
로그인
고객센터

티스토리는 카카오에서 사랑을 담아 만듭니다.