본문 바로가기

Development

[Angular] Angular2 Component 사이트들 1. Angular Script오픈소스 컴포넌트만 있어 좋다 ㅎSite : http://angularscript.com/ 2. Angular Expo여긴 상용/프리가 섞여 있는 것 같다.Site : http://angularexpo.com/ 3. Material Side Menu말 그대로 옆에 나오는 메뉴 컴포넌트. AngularJS 용인듯...ㅜㅜSite : https://github.com/marcosmoura/angular-material-sidemenuDemo : http://marcosmoura.com/angular-material-sidemenu/ 4. Gridster2대시보드 꾸미기 좋은 컴포넌트Site : https://github.com/tiberiuzuld/angular-gridster..
[Docker] Error response from daemon: Get https://xxx.com/v2/: x509: certificate signed by unknown authority Error: Using default tag: latest Error response from daemon: Get https://docker-registry.xxx.com:5000/v2/: x509: certificate signed by unknown authority Solution: Windows에서는 Docker Settings -> Daemon에서 Insecure Registies에 해당 주소를 추가해주면 된다. MAC도 비슷하게 설정해주면 되고, Linux는 설정 방법이 다르다.
간단한 팁 모음 IntelliJ IDEA를 Eclipse나 다른 툴들을 사용해보지 않고 바로 이 제품을 사용하는 사람은 드물 것이다. 거기에서 오는 불편함(단순히 좀 다르다에 불과하지만)과 IntelliJ는 상용 프로그램이다 보니까 잘만들어져 있고, 많은 기능을 포함하고 있어 오픈소스 툴에 비해서 좀 어렵다? 복잡하다고 느껴질 수 있을 것이다.(나만 그러나..?ㅜㅜ) 여튼 그런 사용자를 위해서(본인을 위해서) 간단 간단한 팁들을 모아놓으려고 한다. 링크가 없으면 글을 아직 안 쓴 것임 ㅋ대소문자 안 가리고 자동완성 기능 사용하기syso와 같은 단축 코드 기능을 설정해서 사용하자(Live Template)properties 파일에서 한글도 보이게 하기저장하지 않은 파일(수정한 파일)에 * 표시하기해당 클래스를 사용하고 있..
[IntelliJ] properties 파일에서 한글 보기 다국어 또는 정적 설정 등의 이유로 아직 *.properties 파일을 사용하는데 이 파일에서 한글을 보려면 Eclipse의 경우엔 Properties 플러그인을 설치해야 볼 수 있다. IntelliJ IDEA에서는 간단한 설정을 통해 한글을 볼 수 있는데 방법은 다음과 같다.Preferences -> Editor -> File Encodings 에서 'Transparent native-to-ascii conversion'를 체크하면 된다.
[Javascript] JSON.parse() 사용 방법 feat. Object.assign JSON.parse()란?Javascript에는 JSON이라는 클래스가 있다. 클래스 이름대로 Javascript에서 JSON을 컨트롤하기 위한 유틸 클래스이다. Object 타입 객체를 JSON 형태의 String 타입으로 변환하려면 JSON.stringify() 함수를 사용하면 되고, 반대로 String 타입 JSON에서 Object 타입으로 변환할 때는 JSON.parse() 함수를 사용하면 된다. let jsonStr = JSON.stringify( { name: 'coffee', price: 3000 } ); console.log( jsonStr ); // {"name":"coffee","price":3000} let object = JSON.parse( jsonStr ); console.log..
[Javascript] Array.every() 사용 방법 Array.every()란?Array.forEach()와 다르게 loop를 돌다가 중간에 멈출 수 있는 아주 좋은 함수이다. 그래서 Array.forEach()를 사용할 때는 어떤 일이 일어나도 0번부터 N번까지 돌아야 할 때 사용하고, Array.map()은 마찬가지로 어떤 일이 일어나도 0번부터 N번까지 돌지만, 값에 변형을 줘야 할 때 사용한다. 그리고 이 Array.every() 어떤 일이 발생하면 loop를 멈출 필요가 있을 때 사용한다. 아래 예제를 참고하자.Array.every() 사용법아래 소스를 보면, input을 통해 값을 받고, 그 값이 Array에 존재하는지를 확인한다. every 함수 안에서 true를 리턴하면 loop를 계속 진행하고, false를 리턴하면 리턴한 시점에서 멈춘다..
[Angular] Typescript로 다른 Router-Outlet의 화면 변경하기 가끔 여러 개의 Router-Outlet을 선언해서 사용해야 할 때가 있다. 여러 개를 선언하면 어느 Router-Outlet의 페이지를 변경시킬 것인지 명시를 해줘야 하는데 아래와 같이 사용하면 된다. 선언 이 이런 식으로 선언되어 있다고 가정했을 때, 아래와 같이 사용하면 된다. navigate 사용 방법this.router.navigate( [ `./`, { outlets: { 'headerOutlet': 'header11' } } ] );아 참고로 header11이 path이다. 그리고 router 객체를 가져오는 건 provider를 이용하면 된다.
각종 Fiddle(Playground) 목록 (작성 중) Fiddle?Fiddle은 Playground라고도 하는데 웹상에서 프로그래밍 언어를 테스트 해보고 간단한 샘플을 작성하여 다른 사람과 공유할 수 있는 사이트를 말한다. JSFiddle ( https://jsfiddle.net/ )JSFiddle는 웹 관련 Fiddle이다. 외부 라이브러리(링크만)를 지원하고 HTML, CSS, JavaScript, TypeScript, CoffeeScript, Babel를 지원한다. 가입하면 저장한 소스 목록을 볼 수 있지만 이름이나 폴더 등을 지원하고 있지 않아서 저장한 소스가 많아지면 좀 불편해진다. Fiddle Salad ( http://fiddlesalad.com/typescript )Typescript 언어를 테스트해볼 수 있는 Fiddle이다.
[macOS] Homebrew를 통해 iTerm 설치하기 iTerm은 맥에서 사용할 수 있는 터미널 유틸이다. 맥 기본 터미널에서는 할 수 없는 여러가지 편한 기능들을 제공해서 터미널을 사용하기 편리하다. 자세한 장점과 사용방법은 아래 링크를 통해 확인할 수 있다. iTerm2 사이트 : http://iterm2.com백투더맥 리뷰 : http://macnews.tistory.com/4472 그리고 홈브류(Homebrew)를 사용하면 설치 및 업데이트 관리가 편하니 Download 받아서 설치하는 것보다 홈브류를 통해 설치하는 게 좋다. 터미널을 열고 아래 커맨드를 입력하면 된다. $ brew install Caskroom/cask/iterm2 그럼 아래와 같이 설치된다. 설치 화면 iTerm 실행화면 추가. Alfred를 사용한다면 iTerm 관련 workf..
[Windows] 관리자 권한으로 실행하는 단축키 터미널이나 기타 프로그램을 관리자 권한으로 실행해야 할 때가 있다. 그럴 때마다 시작을 누르고 프로그램을 찾거나 검색을 통해 화면 상에 보이게 한 뒤, 마우스 오른쪽 클릭 후 관리자 권한으로 실행을 눌렀었는데 단축키가 있다는 걸 오늘 첨 알았다. 멍청하면 손발이 고생이다!ㅠㅠ마우스 오른쪽 클릭을 통해 관리자 권한으로 실행한 방법단축키는 바로 Control + Shift + Enter 이다. 그냥 누르는 건 아니고 검색이나 프로그램을 찾아 화면에 나오게 한 다음에 눌러야 한다.(아래 스샷 참고) 여기서 단축키로 실행하면 된다.아. 참고로 실행창(Windows Key + R)에서는 안 먹는다....... 추가. 데스크탑 관련 단축키(Windows 10 or higher)Control + Windows Key..
[iBatis] isEmpty 태그 사용법 개요isEmpty는 들어오는 속성의 값이 null이나 ""인지를 판별하여 실행해주는 태그이다.사용법 NAME = #name# 설명prepend는 태그 안의 값(NAME = #name#)에 추가로 붙여주는 접두어(prefix)이다. 보통 논리식(AND, OR)이나 WHERE을 주로 쓴다.property는 Empty 상태인지를 판별할 변수를 지정한다.태그 안에는 isEmpty 조건이 참일 때 나와야 하는 Query를 넣어준다. prepend 속성을 지정하기 귀찮다면 요 부분에 추가해서 써도 상관 없다.
[Webpack] Bootstrap tooltips require Tether Tether(http://tether.io/)는 HTML에서 절대 위치(ex. position:absolute, 수동위치, x,y 사용)를 이용한 화면을 만들 때 편리한 라이브러리이다. Bootstrap에서는 tooltip 컴포넌트가 이 라이브러리를 이용하여 개발되었다. 그래서 Tether도 같이 인클루딩 해줘야 한다. 아래는 Webpack에서 안 했을 때 나는 에러이다.Error : Error: Bootstrap tooltips require Tether (http://tether.io/) at http://localhost:9060/main.bundle.js:2754:11 이런 에러가 날 때는 간단하게 아래와 같이 Webpack Config의 ProvidePlugin에 추가해주면 된다.(대소문자 유의..