본문 바로가기

전체 글132

Vue.js 강의 - SFC (Single File Components) 는 무엇인가? SFC (Single File Components) 는 무엇인가? Single File Components , SFC - .vue 확장자를 가진 싱글 파일 컴포넌트 싱글 파일 컴포넌트 — Vue.js Vue.js - 프로그레시브 자바스크립트 프레임워크 kr.vuejs.org 페이지내 Vue 선언 방식의 disadvantages(약점) ● Global definitions - 모든 컴포넌트에 대한 고유한 이름 필요 ● String templates - 구문 강조가 약함, 여러 줄로 된 HTML에 보기 안좋은 슬래시 ● No CSS support - CSS is conspicuously left out CSS 를 지원하지 않는 것이 아니라 CSS 가 눈에 띄게 모듈화 되지 않음 ● No build step .. 2020. 4. 13.
Vue.js 강의 - SPA (Single-Page Application)는 무엇인가? SPA (Single-Page Application)는 무엇인가? ●서버로부터 완전한 새로운 페이지를 불러오지 않고 현재의 페이지를 동적으로 다시 작성함으로써 사용자와 소통하는 웹 애플리케이션을 말한다. 웹 애플리케이션 - 위키백과, 우리 모두의 백과사전 위키백과, 우리 모두의 백과사전. 웹 애플리케이션(web application) 또는 웹 앱은 소프트웨어 공학적 관점에서 인터넷이나 인트라넷을 통해 웹 브라우저에서 이용할 수 있는 응용 소프트웨어를 말한다. 웹 애플리케이션은 클라이언트로서 웹 브라우저를 사용하는 사람이 많기 때문에 인기를 누리고 있다. 수천만 대의 PC에 굳이 소프트웨어를 배포해서 설치하지 않아도 웹 애플리케이션을 유지 관리할 수 있다는 점이 장점 중의 하나이다. 웹 애플리케이션은 웹 .. 2020. 2. 17.
Vue.js 강의 - PWA (Progressive Web Application) 는 무엇인가? PWA (Progressive Web Application) 는 무엇인가? ● 웹 소프트웨어의 일종으로, HTML, CSS, 자바스크립트를 포함한 웹 기술들을 사용하여 만듦. HTML - 위키백과, 우리 모두의 백과사전 위키백과, 우리 모두의 백과사전. HTML은 하이퍼텍스트 마크업 언어(HyperText Markup Language, 문화어: 초본문표식달기언어, 하이퍼본문표식달기언어)라는 의미의 웹 페이지를 위한 지배적인 마크업 언어다. HTML은 제목, 단락, 목록 등과 같은 본문을 위한 구조적 의미를 나타내는 것뿐만 아니라 링크, 인용과 그 밖의 항목으로 구조적 문서를 만들 수 있는 방법을 제공한다. 그리고 이미지와 객체를 내장하고 대화형 양식을 생성하는 데 사용될 ko.wikipedia.org 종.. 2020. 2. 17.
Vue.js 강의 - Vue.js가 무엇인가? Vue.js 가 무엇인가? ● Vue는 사용자 인터페이스를 만들기 위한 프로그레시브 프레임워크(Progressive Framework) → 일반적인 웹 페이지 뿐만 아니라 PWA(프로그레시브 웹앱) 개발에 용이하다 ● 점진적으로 채택할 수 있도록 설계됨 vue -> vue router -> vuex Vue.js Vue.js - The Progressive JavaScript Framework vuejs.org Introduction | Vue Router Introduction VERSION NOTE For TypeScript users, vue-router@3.0+ requires vue@2.5+, and vice versa. Vue Router is the official router for Vue... 2020. 2. 17.
MySQL - Too many connections 해결 및 튜닝 show variables like '%max_connections%'; show status like '%connect%'; =>"Aborted_connects" "53""Connections" "10832""Max_used_connections""101""Threads_connected" "100" show status like 'Aborted%';=>"Aborted_clients" "5000""Aborted_connects" "53" show status like '%thread%';=>"Threads_cached" "5""Threads_connected" "99""Threads_created" "1469""Threads_running" "1" Cache Miss Rate(%) = Threads_c.. 2019. 1. 8.
AngularJS - Angular Style Guide & Angular 2 Angular Style Guide & Angular 2 The Angular 1 Style Guide. The Angular 2 Style Guide. https://angular.io https://angular.io/docs/ts/latest/quickstart.html https://angular.io/resources/live-examples/quickstart/ts/eplnkr.html https://angular.io/docs/ts/latest/tutorial/ http://localhost:8080/index5.html AngularJS Patterns: Clean Code https://github.com/johnpapa/angular-styleguide/tree/master/a1 htt.. 2019. 1. 4.
AngularJS - Updating AngularJS Updating AngularJS npm run update-deps bower.json angular version -> 해당 version 의 최신 버전으로 업데이트 "dependencies": { "angular": "~1.5.0", "angular-route": "~1.5.0", "angular-loader": "~1.5.0", "angular-mocks": "~1.5.0", "html5-boilerplate": "^5.3.0" } ===> "dependencies": { "angular": "~1.5.11", "angular-route": "~1.5.11", "angular-loader": "~1.5.11", "angular-mocks": "~1.5.11", "html5-boilerplate":.. 2019. 1. 4.
AngularJS Seed - the seed for AngularJS apps AngularJS Seed - the seed for AngularJS apps https://github.com/angular/angular-seed git clone https://github.com/angular/angular-seed.git cd angular-seed npm install npm start - http://localhost:8000/index.html Directory Layout - _test.js -> .spec.js npm test Running End-to-End Tests cd e2e-tests npm start npm run update-webdriver npm run protractor 2019. 1. 4.
AngularJS - Angularjs Tutorial Angularjs Tutorial 0 - Bootstrapping - https://docs.angularjs.org/tutorial/step_00 1 - Static Template - https://docs.angularjs.org/tutorial/step_01 2 - AngularJS Templates - https://docs.angularjs.org/tutorial/step_02 3 - Components - https://docs.angularjs.org/tutorial/step_03 4 - Directory and File Organization - https://docs.angularjs.org/tutorial/step_04 5 - Filtering Repeaters - https://do.. 2019. 1. 4.
AngularJS - PhoneCat Tutorial App PhoneCat Tutorial App Environment SetupInstall Git - http://git-scm.com/download Install Node.js - https://nodejs.org/en/download node --version - Node.js v4+ git clone --depth=16 https://github.com/angular/angular-phonecat.git cd angular-phonecat npm install This command reads angular-phonecat's package.json file and downloads the following tools into the node_modules directory: Bower - client-.. 2019. 1. 3.
AngularJS - Componets, Directives, Localization Example DirectivesDirectives are a unique and powerful feature available in AngularJS. Directives let you invent new HTML syntax, specific to your application. Reusable ComponentsWe use directives to create reusable components. A component allows you to hide complex DOM structure, CSS, and behavior. This lets you focus either on what the application does or how the application looks separately. Localiza.. 2018. 12. 31.
Javascript - Underscore.js Underscore.js Underscore is a JavaScript library that provides a whole mess of useful functional programming helpers without extending any built-in objects. It’s the answer to the question: “If I sit down in front of a blank HTML page, and want to start being productive immediately, what do I need?” … and the tie to go along with jQuery's tux and underscore.js 는 내장객체를 확장하지 않고, 사용하기 쉬운 함수 프로그래밍에 .. 2018. 12. 31.
AngularJS - Create Components Create Components http://plnkr.co/edit/NomETVhyqSIryX2Pm6dc?p=preview https://docs.angularjs.org/guide/component Component is a special kind of directive that uses a simpler configuration which is suitable for a component-based application structure. Advantages of Components: simpler configuration than plain directivespromote sane defaults and best practicesoptimized for component-based architec.. 2018. 12. 31.
AngularJS - The AngularJS AngularJSAngularJS개발자구글발표일2010년 10월 20일 (8년 전)[1]최근 버전1.6.6 / 2017년 8월 18일 (15달 전)[2]개발 상태개발 중프로그래밍 언어자바스크립트플랫폼크로스 플랫폼크기144 KB (운영용) 1 MB (개발용)종류자바스크립트, 싱글 페이지 애플리케이션 프레임워크라이선스MIT 라이선스웹사이트angularjs.org AngularJS("Angular.js" 또는 "AngularJS 1.X")는 자바스크립트 기반의 오픈 소스 프론트엔드 웹 애플리케이션 프레임워크의 하나로, 싱글 페이지 애플리케이션 개발 중에 마주치는 여러 문제들을 해결하기 위해 개발되었으며 주로 구글과 개별 커뮤니티, 여러 회사에 의해 유지보수되고 있다. 자바스크립트 구성 요소들은 크로스 플랫폼 .. 2018. 12. 31.
핵전쟁 위기 Internet 을 만들다 - 한국은 어떻게 극복할 것인가? 핵전쟁 위기 Internet 을 만들다 - 한국은 무엇을 만들어 내며, 어떻게 극복할 것인가? 스푸트니크 쇼크 동서 냉전이 한창이던 1957년 미국은 사거리 6000km 수준의 아틀라스 A 로켓을 발사 성공하였다. 그때 소련이 사정거리 8000km 에 이르는 세계 최초의 ICBM 인 R-7 로켓을 실전에 배치하였다는 선전이 들렸다. 미국과 서방은 이를 믿지 앉고 무시했지만, 1957년 10월 4일 소련이 세계 최초의 인공위성 '스푸트니크'를 성공적으로 발사한 사건이 발생했다. 이로써, 미국을 비롯한 서방 국가들은 엄청난 충격과 공포, 위기감을 받게 되었다. 대륙 간 탄도 미사일 ICBM 기술을 소련이 가장 먼저 보유하게 되면서, 핵탄두를 장착한 미사일의 선제공격을 가할 수 있다는 사실이, 공포와 위기감을.. 2017. 9. 5.
ellipsis - CSS3 text-overflow Property CSS3 text-overflow Property Use of the text-overflow property: div { text-overflow: ellipsis; } Definition and Usage The text-overflow property specifies how overflowed content that is not displayed should be signaled to the user.Default value:clipInherited:noAnimatable:no. Read about animatableVersion:CSS3le.textOverflow="ellipsis"JavaScript syntax:object.style.textOverflow="ellipsis" CSS Synta.. 2017. 8. 16.
Git - Branch / Merge / Tag git checkout -b feature_x - “feature_x” 라는 branch 를 만들고 해당 branch 로 checkout git checkout master - master branch 로 돌아오기 git branch -d feature_x - branch 삭제 git push origin - push 가 되지 않으면 다른 사람들이 접근이 안됨 git pull - 로컬 저장소를 원격 저장소에 맞춰 갱신 git merge git tag 1.0.0 Discard / Revert / Reset Discard(Undo) - git checkout -- - Revert - Reverse Commit - 삭제 하지 않음, 순차적으로 진행. Reset - 삭제, 여러 단계를 뛰어 넣어서 가능 2017. 8. 2.
Git guide- https://rogerdudler.github.io/git-guide/index.ko.html Git guide- https://rogerdudler.github.io/git-guide/index.ko.html Git 저장소 만들기 - git init폴더를 하나 만들고, 그 안에서 git init 을 실행. Git 저장소 받아오기 - git clone /로컬/저장소/경로 git clone 사용자명@호스트:/원격/저장소/경로Working direcotry, Working copy -> add Unstaged / Staged(Index), Uncommitted changes/ HEAD(commit) Git Commit - only local / Push - remote Commitgit add , git add * , git commit -m “comment”(HEAD 에 반영)원격 저장소에 아직 반.. 2017. 8. 2.
Git 설치 - git-scm.com Source Code - https://github.com/git/git Linux - $yum install git-core Ubuntu - $apt-get install git Mac 에 설치하기 - https://git-scm.com/download/mac Window - https://git-scm.com/download/win SourceTree - www.sourcetreeapp.com 2017. 8. 2.
Git 기초 Git 핵심Git 을 배우려면 Subversion 이나 Perforce 같은 다른 VCS 를 사용하던 경험을 지워야..Git 은 미묘하게 달라서 다른 VCS 에서 쓰던 개념으로는 헷갈림.델타(각 파일에 대한 변화)가 아니라 스냅샷 Git 은 커밋하거나 상태를 저장할 때마다 파일이 존재하는 그 순간이 중요.크기가 아주 작아 성능이 탁월하다. Git은 성능을 위해 파일을 저장하지 않고, 이전 상태의 파일에 대한 링크를 저장한다. Git의 세가지 상태 - Committed, Modified, StagedCommitted - 데이터가 로컬 데이터베이스에 안전하게 저장.Modified - 수정한 파일을 Commit 하지 않은 것. Staged - 현재 수정한 파일을 곧 Commit 할 것이라고 표시. 2017. 7. 25.
GIT 사용법 - the stupid content tracker Git ( / ɡ ɪ t / ) - 컴퓨터 파일의 변경 내용을 추적 하고 여러 사람이 사용하는 파일에 대한 작업을 조율 하는 버전 관리 시스템 (VCS)입니다 . 주로 소프트웨어 개발에서 소스 코드 관리에 사용되지만 , 파일의 변경 내용을 추적하는 데 사용할 수 있습니다. 분산 개정 관리 시스템 으로서 속도, 데이터 무결성, 및 분산 된 비선형 워크 플로우에 대한 지원을 목표로합니다. Git은 리눅스 커널 개발을 위해 2005 년 리누스 토발즈 (Linus Torvalds) 에 의해 만들어졌으며 다른 커널 개발자들은 초기 개발에 기여했습니다. 2005 년 이래로 현재 유지 관리자는 Junio ​​Hamano 입니다. 대부분의 다른 분산 버전 제어 시스템과 마찬가지로 대부분의 클라이언트 - 서버 시스템 과.. 2017. 7. 25.
MyBatis Cache 성능을 개선하고 순환하는 의존성을 해결하기 위해 필요한 로컬 세션 캐싱을 제외하고 기본적으로 캐시가 작동하지 않는다. Mabatis 캐싱을 활성화하기 위해서 SQL 매핑 파일에 한줄을 추가하면 된다. 이 설정은 60 초마다 캐시를 지우는 FIFO 캐시를 생성한다. 이 캐시는 결과 객체 또는 결과 리스트를 512개까지 저장하고 각 객체는 읽기 전용이다. 캐시 데이터를 변경하는 것은 개별 쓰레드에서 호출자간의 충돌을 야기할 수 있다.매핑 구문 파일내 select 구문의 모든 결과가 캐시 될 것이다.매핑 구문 파일내 insert, update 그리고 delete 구문은 캐시를 지울(flush) 것이다.캐시는 Least Recently Used (LRU) 알고리즘을 사용할 것이다.캐시는 스케줄링 기반으로 시간순.. 2017. 7. 16.
Spring Application Config Spring Application Config application/json;charset=utf-8 2017. 5. 10.
Project Lombok https://projectlombok.org/ http://jnb.ociweb.com/jnb/jnbJan2010.html Installation java -jar lombok.jar MavenAdding lombok to your pom file org.projectlombok lombok 1.16.18 provided projectlombok.org http://projectlombok.org/mavenrepo Maven > Update Project.. Lombok features.valFinally! Hassle-free final local variables.@NonNullor: How I learned to stop worrying and love the NullPointerException... 2016. 4. 1.