본문 바로가기

전체 글136

[Hoon] Vuejs 강의 - SPA (Single-Page Application)는 무엇인가? SPA (Single-Page Application)는 무엇인가? ●서버로부터 완전한 새로운 페이지를 불러오지 않고 현재의 페이지를 동적으로 다시 작성함으로써 사용자와 소통하는 웹 애플리케이션을 말한다. 웹 애플리케이션 - 위키백과, 우리 모두의 백과사전 위키백과, 우리 모두의 백과사전. 웹 애플리케이션(web application) 또는 웹 앱은 소프트웨어 공학적 관점에서 인터넷이나 인트라넷을 통해 웹 브라우저에서 이용할 수 있는 응용 소프트웨어를 말한다. 웹 애플리케이션은 클라이언트로서 웹 브라우저를 사용하는 사람이 많기 때문에 인기를 누리고 있다. 수천만 대의 PC에 굳이 소프트웨어를 배포해서 설치하지 않아도 웹 애플리케이션을 유지 관리할 수 있다는 점이 장점 중의 하나이다. 웹 애플리케이션은 웹 .. 2020. 2. 17.
[Hoon] Vuejs 강의 - PWA (Progressive Web Application) 는 무엇인가? PWA (Progressive Web Application) 는 무엇인가? ● 웹 소프트웨어의 일종으로, HTML, CSS, 자바스크립트를 포함한 웹 기술들을 사용하여 만듦. HTML - 위키백과, 우리 모두의 백과사전 위키백과, 우리 모두의 백과사전. HTML은 하이퍼텍스트 마크업 언어(HyperText Markup Language, 문화어: 초본문표식달기언어, 하이퍼본문표식달기언어)라는 의미의 웹 페이지를 위한 지배적인 마크업 언어다. HTML은 제목, 단락, 목록 등과 같은 본문을 위한 구조적 의미를 나타내는 것뿐만 아니라 링크, 인용과 그 밖의 항목으로 구조적 문서를 만들 수 있는 방법을 제공한다. 그리고 이미지와 객체를 내장하고 대화형 양식을 생성하는 데 사용될 ko.wikipedia.org 종.. 2020. 2. 17.
[Hoon] Vuejs 강의 - 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.
[Hoon] MySQL - Too many connections 해결 및 튜닝 MySQL - Too many connections 해결 및 튜닝 MySql 이나 Mariadb 를 운용할때 종종 만나게 되는 too many connections 의 해결과 성능 튜닝에 대해서 알아보자. # 상태 확인 show variables like '%max_connections%'; show status like '%connect%'; "Aborted_connects" "53" - MySQL 서버에 접속이 실패된 수 "Connections" "10832" "Max_used_connections" "101" - 최대로 동시에 접속한 수 "Threads_connected" "100" - Thread Cache의 Thread 수 show status like 'Aborted%'; "Aborted_cl.. 2019. 1. 8.
[Hoon] AngularJS - Angular Style Guide & Angular 2 Angular Style Guide & Angular 2 The Angular 1 Style Guide. The Angular 2 Style Guide. https://angular.io Angular angular.io https://angular.io/docs/ts/latest/quickstart.html Angular angular.io https://angular.io/resources/live-examples/quickstart/ts/eplnkr.html Angular angular.io https://angular.io/docs/ts/latest/tutorial/ Angular angular.io AngularJS Patterns: Clean Code https://github.com/john.. 2019. 1. 4.
[Hoon] AngularJS - 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.
[Hoon] 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 bit.ly/3fXOzon 인프런 인강 55%할인 쿠폰 - 커피한잔으로 Vue.j.. 2019. 1. 4.
[Hoon] 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.
[Hoon] AngularJS - PhoneCat Tutorial App PhoneCat Tutorial App Environment Setup Install 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.
[Hoon] AngularJS - Componets, Directives, Localization Example Directives Directives are a unique and powerful feature available in AngularJS. Directives let you invent new HTML syntax, specific to your application. Reusable Components We 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. Locali.. 2018. 12. 31.
[Hoon] 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.
[Hoon] 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 directives promote sane defaults and best practices optimized for component-based archit.. 2018. 12. 31.
[Hoon] AngularJS - The AngularJS AngularJS AngularJS 개발자 구글 발표일 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.
[Hoon] 핵전쟁 위기 Internet 을 만들다 - 한국은 어떻게 극복할 것인가? 핵전쟁 위기 Internet 을 만들다 - 한국은 무엇을 만들어 내며, 어떻게 극복할 것인가? 스푸트니크 쇼크 동서 냉전이 한창이던 1957년 미국은 사거리 6000km 수준의 아틀라스 A 로켓을 발사 성공하였다. 그때 소련이 사정거리 8000km 에 이르는 세계 최초의 ICBM 인 R-7 로켓을 실전에 배치하였다는 선전이 들렸다. 미국과 서방은 이를 믿지 앉고 무시했지만, 1957년 10월 4일 소련이 세계 최초의 인공위성 '스푸트니크'를 성공적으로 발사한 사건이 발생했다. 이로써, 미국을 비롯한 서방 국가들은 엄청난 충격과 공포, 위기감을 받게 되었다. 대륙 간 탄도 미사일 ICBM 기술을 소련이 가장 먼저 보유하게 되면서, 핵탄두를 장착한 미사일의 선제공격을 가할 수 있다는 사실이, 공포와 위기감을.. 2017. 9. 5.
[Hoon] 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: clip Inherited: no Animatable: no. Read about animatable Version: CSS3le.textOverflow="ellipsis" JavaScript syntax: object.style.textOverflow="ellipsis".. 2017. 8. 16.
[Hoon] 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 - 삭제, 여러 단계를 뛰어 넣어서 가능 bit... 2017. 8. 2.
[Hoon] 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 Commit git add , git add * , git commit -m “comment”(HEAD 에 반영) 원격 저장소에 .. 2017. 8. 2.
[Hoon] 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 Sourcetree | Free Git GUI for Mac and Windows A Git GUI that offers a visual representation of your repositories. Sourcetree is a free Git client for Windows and Mac. www.sou.. 2017. 8. 2.
[Hoon] Git 기초 Git 핵심 Git 을 배우려면 Subversion 이나 Perforce 같은 다른 VCS 를 사용하던 경험을 지워야.. Git 은 미묘하게 달라서 다른 VCS 에서 쓰던 개념으로는 헷갈림. 델타(각 파일에 대한 변화)가 아니라 스냅샷 Git 은 커밋하거나 상태를 저장할 때마다 파일이 존재하는 그 순간이 중요. 크기가 아주 작아 성능이 탁월하다. Git은 성능을 위해 파일을 저장하지 않고, 이전 상태의 파일에 대한 링크를 저장한다. Git의 세가지 상태 - Committed, Modified, Staged Committed - 데이터가 로컬 데이터베이스에 안전하게 저장. Modified - 수정한 파일을 Commit 하지 않은 것. Staged - 현재 수정한 파일을 곧 Commit 할 것이라고 표시. .. 2017. 7. 25.
[Hoon] GIT 사용법 - the stupid content tracker Git ( / ɡ ɪ t / ) - 컴퓨터 파일의 변경 내용을 추적 하고 여러 사람이 사용하는 파일에 대한 작업을 조율 하는 버전 관리 시스템 (VCS)입니다 . 주로 소프트웨어 개발에서 소스 코드 관리에 사용되지만 , 파일의 변경 내용을 추적하는 데 사용할 수 있습니다. 분산 개정 관리 시스템 으로서 속도, 데이터 무결성, 및 분산 된 비선형 워크 플로우에 대한 지원을 목표로합니다. Git은 리눅스 커널 개발을 위해 2005 년 리누스 토발즈 (Linus Torvalds) 에 의해 만들어졌으며 다른 커널 개발자들은 초기 개발에 기여했습니다. 2005 년 이래로 현재 유지 관리자는 Junio ​​Hamano 입니다. 대부분의 다른 분산 버전 제어 시스템과 마찬가지로 대부분의 클라이언트 - 서버 시스템 과.. 2017. 7. 25.
[Hoon] MyBatis Cache 성능을 개선하고 순환하는 의존성을 해결하기 위해 필요한 로컬 세션 캐싱을 제외하고 기본적으로 캐시가 작동하지 않는다. Mabatis 캐싱을 활성화하기 위해서 SQL 매핑 파일에 한줄을 추가하면 된다. 이 설정은 60 초마다 캐시를 지우는 FIFO 캐시를 생성한다. 이 캐시는 결과 객체 또는 결과 리스트를 512개까지 저장하고 각 객체는 읽기 전용이다. 캐시 데이터를 변경하는 것은 개별 쓰레드에서 호출자간의 충돌을 야기할 수 있다. 매핑 구문 파일내 select 구문의 모든 결과가 캐시 될 것이다. 매핑 구문 파일내 insert, update 그리고 delete 구문은 캐시를 지울(flush) 것이다. 캐시는 Least Recently Used (LRU) 알고리즘을 사용할 것이다. 캐시는 스케줄링 기반으로.. 2017. 7. 16.
[Hoon] Spring Application Config 설정 Spring Application Config Base Package Servlet Handler Message Converter application/json;charset=utf-8 Annotation Config DataSource DataSourceSpied Mybatis Transaction Mapper Auto Scan bit.ly/3fXOzon 인프런 인강 55%할인 쿠폰 - 커피한잔으로 Vue.js 핵심 강의! 인프런 인터넷 강의 55% 할인 쿠폰 - 커피한잔(5000원)으로 배우는 Vue.js 핵심 강의! 모바일 환경에서도 강의를 수강할 수 있도록 강의가 많이 개선되었습니다. 인프런 인터넷 강의 선착순 100명 55% � plogger.tistory.com bit.ly/2TtRHis [V.. 2017. 5. 10.
[Hoon] Project Lombok https://projectlombok.org/ http://jnb.ociweb.com/jnb/jnbJan2010.html Installation java -jar lombok.jar Maven Adding lombok to your pom file org.projectlombok lombok 1.16.18 provided projectlombok.org http://projectlombok.org/mavenrepo Maven > Update Project.. Lombok features. val Finally! Hassle-free final local variables. @NonNull or: How I learned to stop worrying and love the NullPointerExcep.. 2016. 4. 1.
자동차 박사 - 차의 모든 것 스포츠카 자동차 배경화면 최근 자동차에 관심을 가지면서, 자동차 박사라는 새로운 어플을 하나 개발하였다. 위키를 연동하여, 자동차와 브랜드의 역사나 폭넚은 상식을 연결시켰다. 멋진 스포츠카 갤러리도 만들었다. 스포츠카 사진으로 스마트폰 배경화면 변경도 가능하다. 아무쪼록 나와같이 자동차에 관심이 있는 이들에게 도움이 될수 있었으면... 자동차 박사는 2013. 5. 6.
[Hoon] MySql 에서의 현재시각 sysdate vs now MySql 에서의 현재시각 sysdate vs now MySql 에서 현재시각을 위한 함수 sysdate() 와 now() 두 함수 모두 현재시각을 반환하지만, 몇가지 차이가 있음. 하나의 SQL 문에서 여러번 now()가 사용된 경우, now() 는 동일한 결과를 반환, sysdate()는 동일 SQL 문 내에서도 호출되는 시점에 따라 결과값이 달라짐. example> select now(), sysdate(), sleep(5), now(), sysdate(); result> now() sysdate() sleep(5) now() sysdate() 2013-05-03 오전 11:18:31 2013-05-03 오전 11:18:31 5 2013-05-03 오전 11:18:31 2013-05-03 오전 11.. 2013. 5. 3.
안드로이드 앱 SD 카드로 이동, 수평 스크롤 메뉴 안드로이드 앱 SD 카드로 이동, 수평 스크롤 메뉴 manifest 에 android:installLocation="auto" 퍼미션 허용 수평 스크롤 메뉴 -> HorizontallScrollView 를 이용 .. .. .. bit.ly/3fXOzon 인프런 인강 55%할인 쿠폰 - 커피한잔으로 Vue.js 핵심 강의! 인프런 인터넷 강의 55% 할인 쿠폰 - 커피한잔(5000원)으로 배우는 Vue.js 핵심 강의! 모바일 환경에서도 강의를 수강할 수 있도록 강의가 많이 개선되었습니다. 인프런 인터넷 강의 선착순 100명 55% � plogger.tistory.com bit.ly/2TtRHis [Vue.js 입문] 초보 실전 웹앱 개발 - 1부 : vue 개념 ~ 핵심 문법 - 인프런 이 강의를 수강하.. 2013. 5. 3.
오라클 문자열 split 하기 오라클 문자열 split 하기 SELECT SUBSTR ('홍길동#과장#IT', (SELECT INSTR ('홍길동#과장#IT', '#') FROM DUAL) + 1, (SELECT INSTR ('홍길동#과장#IT', '#', 1, 2) FROM DUAL) - ((SELECT INSTR ('홍길동#과장#IT', '#', 1, 1) FROM DUAL) + 1) ) AS RESULT FROM DUAL bit.ly/3fXOzon 인프런 인강 55%할인 쿠폰 - 커피한잔으로 Vue.js 핵심 강의! 인프런 인터넷 강의 55% 할인 쿠폰 - 커피한잔(5000원)으로 배우는 Vue.js 핵심 강의! 모바일 환경에서도 강의를 수강할 수 있도록 강의가 많이 개선되었습니다. 인프런 인터넷 강의 선착순 100명 55% �.. 2013. 5. 3.
경제통 - 뉴스 신문 금융 취업 면접 상식 주식 증권 경제통은 안드로이드 앱입니다. 구글마켓에 등록되어 있습니다. 아래 링크를 통해 주용정보를 확인 및 설치할 수 있습니다. 2011. 7. 20.
변비에 좋은 섬유질이 많은 음식 알아보자 섬유질음식 변비와 다이어트, 숙변제거에 좋은 섬유질이 많은 음식들을 알아보도록해요. 섬유질이란 우리몸에서 소화되지않으며 씹을때 아삭하거나 질긴 실같은 느낌이 나는것을 말합니다. 섬유질은 야채와 곡물, 과일, 해조류 등에 많이 들어있습니다. 식이섬유인 섬유질은 많이 먹으면 변의 양이 증가하고 부드럽게 해주며 장운동을 도와 배변활동을 촉진시켜 변비를 호전시키는데 좋은 효과가 있으며 숙변제거에도 좋습니다. 또한 식이섬유가 많으 들어있는 음식은 적은 양으로도 쉽게 포만감을 느끼도록 해주어 과식을 막아 살이 찌는것은 예방하고 다이어트에도 좋은 도움이 될 수가 있습니다. 섬유질이 많은 음식 1. 현미같은 잡곡류 우리가 평소에 먹는 흰쌀밥에도 섬유질이 포함되있기는 하지만 현미같은 잡곡에는 흰쌀보다 3~4배가량 많은 식이섬유가 .. 2011. 2. 6.
<癌을 극복하는 사람들-암을 이기자> ‘서구형 식습관’이 부른 대장암… 붉은색 고기·섬유질 많은 음식 피해야 대표적인 서구형 암종인 대장암은 2008년 기준 전체 암 발생의 12.7%로 3위를 기록했다. 특히 남성에서는 2007년 3위에서 2008년 2위로 올라설 정도로 암 발생이 크게 늘어나고 있다. '강남세브란스병원 암전문의가 함께 만든 암을 이기는 건강 밥상(북센스 2010년)'에 따르면 대장암은 쇠고기, 돼지고기와 같은 붉은색 육류와 가공육을 많이 섭취하는 사람에게서 발생할 확률이 높다. 또한 육류를 고온으로 가열해 조리하거나 직화로 구이할 때, 고열량 식사를 하거나 알코올을 섭취할 때, 비만과 적은 활동량 등이 암 발생 위험을 높인다. 반면 식이섬유소 함유 식품, 채소, 과일, 우유, 칼슘은 대장암을 예방하는 것으로 보고되고 있다. 대장암 환자는 보통 수술 치료, 항암약물 치료, 방사선 치료 중 한 가.. 2011. 2. 6.