남산 아래 개발자들

TypeScript는 일반 JavaScriipt로 컴파일 되는 아니 정확히 말해서 변환되는 타입 혹은 유형을 가지는 상위 자바스크립트 언어입니다. TypeScript는 특징적으로 정적 타이핑, 클래스, 인터페이스, 제너릭 등을 제공하며 ES6 및 ES7의 거의 모든 기능을 지원합니다. 명시적으로 TypeScript 자체적으로 ES표준을 지원하는 것이 아니라 컴파일 과정을 거치 JavaScript코드 가 ES 표준을 지원한다는 것을 유의해야 합니다. TypeScipt 파일은 .ts 확장자로 저장됩니다. 타입이 지정된 JavaScript는 좀더 명확하게 코드를 이해할수 있으며, IDE를 통해 개발 시, Intelisense(자동완성) 기능을 사용할 수 있습니다   타입정의 기본타입은 boolean, number, string, Array 를 가질수 있습니다. name : string = ' david ' ; age : number = 20 ; isAlive : boolena = true ; hobbies : string [ ] ; anyType : any ; noType = 50 ; noType = ' Random String '   클래스 Java는 Object Oriented Programing 이지만, JavaScript는 Objective Programing 이라고 할수 있습니다. 클래스처럼 동작하기 위해 Prototype을 기반으로 상속을 구현한다고 할 수 있습니다. ES6에는 다음과 같은 클래스 구조로 표현할 수 있습니다. class Person { name : string ; constructor ( personName : string ) { this . name = personName ; } getName ( ) { return " the name is a " + this . name } } david

HTML 으로 코딩된 테이블, 그림, 글자 등 다양한 요소가 섞여 있는 문서를 PDF 또는 A4용지로 출력했을 때 각 요소가 중간에 끊어지지 않고 보기좋게 출력할 수 있는 방법이 있는지 알아보았습니다. 방법은 생각보다 간단한데요, CSS의 @media print 속성을 이용하면 가능했습니다. @media print 는 인쇄할 때만 적용되는 것으로 다양한 기능이 있지만 바쁜 분들을 위해 핵심 CSS만 보면, 이 두 개만 알아도 충분한 것 같습니다. @media print {       .page-divide {               page-break-after: always;        } } .page-divide 라는 클래스를 준 요소 뒤에는 언제나 페이지를 분할하도록 하는 CSS 입니다. table, figure, .sector {         page-break-inside: avoid; } table, figure 또는 sector 라고 클래스를 지정해 준 요소는 페이지 때문에 끊기지 않도록 처리해주는 구문입니다. 이렇게 지정한 요소가 만약 A4 용지 단위로 프린트물이 나올 때 중간에 걸리게 되면 통째로 그 다음 장으로 넘어가게 처리해줍니다. 간단 예제 소스보기 <style> @media print {      .page-divide {             page-break-after: always;      }      .no-print-page {             display: none; //작업의 편리함을 위해 넣은 페이지 구분선. 프린트 시에는 보이지 않음       } } h1, h2, h3, h4, h5 {       page-break-after: avoid; } table, figure, .sector {        page-break-inside: avoid; } .table {        width: 100%;  

안녕하세요. 남산돈가스입니다. 오늘은 AWS의 API Gateway에서 연결 된 API들의 API키 발급을 통한 요청 제한, 그리고 사용량 계획을 통한 사용량 조절을 알아보겠습니다. 네이버클라우드에서 제공하는 SENS를 통해서 문자 발송서비스를 OPEN API로 요청하는 법을 지난 포스팅에서 다루어 보았습니다. 문자발송서비스를 앞으로 다양한 사용자에게 제공한다고 가정해보았을 때, 각각의 사용자들의 모두 컨트롤하기 어려운 상황에 놓이기 마련입니다. 그런 경우에 대비하여 API Gateway는 연결해놓은 API에 한하여 사용자들에게 API Key를 관리하여 요청 권한을 제공하고, 사용량 계획을 이용하여 일,월 요청 수 또는 n초 당 m개의 요청 수를 제한하는 기능을 제공하고있습니다. 이 두가지의 기능만을 이용한다면, 다양한 사용자에 대한 API 관리가 용이해질 수 있습니다. 그럼, 차근차근 하나씩 설정을 해보도록하겠습니다. 먼저 API Gateway 콘솔 화면에서 좌측 사용량 계획탭을 선택합니다. 사용량 계획에 대한 이름과 설명을 입력한 뒤, 중간의 조절 부분을 보시면 요율과 버스트를 설정할 수 있습니다. 요율을 n초당 요청 수를 설정하는 곳이고, 버스트는 해당 n초에 대해서 m번의 요청을 가능도록 하는 지 설정하는 부분입니다. 조절부분의 설정을 마치셨다면, 하단의 할당량에서 일,주,월 당 n개의 요청건수를 허용하는 양을 설정합니다. 사용량 계획 설정을 마치고 다음을 선택하면, 연결 된 API 스테이지를 설정하는 화면입니다. 앞에서 설정한 사용량 계획을 어떤 API에 적용할 지 설정하는 부분입니다. 저는 nCloud_SENS API의 dev스테이지에 사용량을 설정했습니다. 다음 화면은 사용량 계획 API 키를 발급하는 화면입니다. 'API 키 생성 후 사용량 계획에 추가' 버튼을 선택합니다. API 키 생성 팝업에서 저는 남산돈가스(사용자)의 API 키를 발급했습니다. 다음과 같이

얼마전 Google Project Zero 팀에서 Intel社, AMD社, ARM社 CPU 제품의 취약점이 발견 되었다고 발표한 이후 파장이 지속되고 있습니다. Google Project Zero 팀 블로그 바로가기 https://googleprojectzero.blogspot.kr/2018/01/reading-privileged-memory-with-side.html 문제가 된 내용은 아래 3가지 이슈로 Variant 1: bounds check bypass (CVE-2017-5753) Variant 2: branch target injection (CVE-2017-5715) Variant 3: rogue data cache load (CVE-2017-5754) 핵심은 CPU의 부채널 공격(side channel attack)으로 인해 캐시 메모리의 저장된 정보가 노출되는 취약점 입니다. - Spectre(스펙터, CVE-2017-5753, CVE-2017-5715) - Meltdown (멜트다운, CVE-2017-5754) 해결방안은 칩셋 제조사및 OS 개발사에서 제공하는 업데이트를 적용하는 방법 입니다. 패치이후  CPU 성능저하 논란이 계속해서 일어나고 있는 상황이지만 인텔 측에서는 벤치마크 자료를 공개하고 성능저하는  미미한 차이라는 입장을 고수하고 있습니다. 원본출처 바로가기 https://newsroom.intel.com/editorials/intel-security-issue-update-initial-performance-data-results-client-systems/ 아래는 보호나라 기준  제조사별 패치현황 입니다. (2018년 1월 18일 기준) 제조사 패치 현황 배포 여부 Amazone 패치 버전 배포(‘18.1.14)[2] 배포완료 AMD 장비 제조사 및 OS 개발사를 통해 패치 권고 [3] 배포중 Apple iOS, macOS 등 멜트다운 취약점에 대한 패치버

1. ionic 설치하기 먼저 Node.js가 설치되어 있어야 합니다. 그런 다음 최신 Cordova 및 Ionic 터미널에 아래의 명령어를 입력하여 설치하십시오. Android 및 iOS 플랫폼 가이드에 따라 개발에 필요한 도구를 설치하십시오. npm install - g cordova ionic 2. 앱 시작하기 일반적으로 사용하는 앱 템플릿 중 하나를 선택하여 이오니아 앱을 만들거나 Blank 형태의 빈 앱을 만들수 있습니다. ionic 디자인 마켓을 방문하면 여러 형태의 템플릿 앱을 확인할 수 있습니다. https://market.ionicframework.com/starters/ v1 프로젝트의 경우, --type ionic1 플래그를 사용하십시오. ionic start myApp tabs 3. 앱 실행하기 앱의 대부분은 터미널 창에  ionic serve  입력하여  대부분의 브라우저에서 바로 확인할 수 있습니다. 앱을 실제 기기에 배포 할 준비가되면 배포 가이드를 확인하기 바랍니다.

안녕하세요. 남산돈가스입니다. 오늘은 제가 개인적으로 Node JS를 개발하면서 굉장히 유용하게 사용하는 모듈을 소개드리려고 합니다. 데이터들을 처리하는 과정에서 꼭 빠지지않는 것들이 날짜 데이터들이죠. 이 날짜 데이터들을 아주 유연하게 변경 및 비교, 계산까지 해줄 수 있는 것이 이 moment.js라고 할 수 있습니다. 지금부터 moment.js를 설치하고 사용하는 방법에 대해서 간단하게 소개드리겠습니다. 먼저 moment.js 모듈을 설치하기 위해서 npm 명령어를 실행합니다. npm install --save moment moment가 설치되었다면 이제 간단하게 사용법을 익혀보겠습니다. ◆ moment 선언 let moment = require ( 'moment' ) ; ◆ 현재 시각 console. log ( `moment => $ { moment ( ) } ` ) //moment => Mon Jan 15 2018 10:50:08 GMT+0900 ◆ Date 객체로부터 초기화 *month는 -1 값 지정 console. log ( `Date to moment => $ { moment ( new Date ( 2018 , 0 , 15 ) ) } ` ) ; //Date to moment => Mon Jan 15 2018 00:00:00 GMT+0900 ◆ 포맷을 지정하여 출력 console. log ( `포맷 지정 출력 => $ { moment ( ) . format ( "YYYY년 MM월 DD일" ) } ` ) //포맷 지정 출력 => 2018년 01월 15일 console. log ( `포맷 지정 출력 => $ { moment ( ) . format ( "YYYY-MM-DD HH:mm:ss" ) } ` ) //포맷 지정 출력 => 2018-01-15 11:01

* 이 문서는 지속적으로 업데이트 될 예정입니다 SNS 홍보 단가 같은걸 알아보다보면 CPC, CPA 등 생소한 용어가 많이 등장하는데요 한번 모아서 정리해보았습니다 ^^* 페이지뷰(PV: Page View) 웹사이트의 특정 페이지 열람횟수를 의미합니다. 예를 들어, 'A'사이트의 페이지뷰가 1,000이라고 하면 'A'사이트 하위에 속한 모든 페이지의 열람횟수의 합이 1,000회라는 의미입니다. 노출(Imp: Impression) 사이트 방문자에게 광고가 보여진 횟수입니다. 페이지 새로고침 시 노출수도 함께 증가됩니다. 프리퀀시(Frequency) 이용자 한 사람이 동일한 광고에 노출되는 평균 횟수(빈도)를 의미합니다. 예를 들어, 프리퀀시가 3이면 한사람이 동일한 광고에 평균 3번 노출된다는 의미입니다. Frequency = Target Impression ÷ Target Unique user 클릭율(CTR: Click Through Rate)  온라인 광고의 노출수 대비 클릭수를 의미합니다. 예를 들어, 클릭율이 0.2이면 광고가 1,000회 노출되었을 때 2번 클릭되었다는 의미입니다. CTR = (클릭수 ÷ 노출수) ×100 CPM(Cost Per Mill) CPM(Cost Per Mill) 광고의 가격을 책정하는 방법의 하나로, 광고를 1,000회 노출하는데 지불하는 가격입니다. 예를 들어, CPM 2,000원은 광고가 1,000회 노출될 때 가격이 2,000원이고, 1회 노출될 때 가격이 2원이라는 의미입니다. CPV(Cost Per View)  광고의 가격을 책정하는 방법의 하나로, 동영상 광고가 1회 재생될 때마다 지불하는 가격입니다. 예를 들어, CPV 2원은 동영상 광고가 1회 재생될 때 가격이 2원이라는 의미입니다. 타겟팅(Targeting) 사용자의 정보(나이, 지역, 성별 등)에 따라 원하는 사용자에게만 광고를 보여주는 광고기법입니다. 예를 들어, 서울

네이버 SENS API 를 활용한 SMS 발송 서비스 개발 진행 시 휴대전화 번호를 발신번호를 등록하고자 한다면 휴대폰 본인인증 서비스를 활용하면 됩니다. 핸드폰 본인인증을 통한 SMS 발신번호 등록 하지만 법인 서비스의 경우 회사 대표번호 등록을 통해 서비스를 구현해야 하는데 발신번호 사전등록제* 로 인해 별도의 인증절차가 추가로 필요하게 됩니다. 발신번호 사전등록제 시행 안내 전기통신사업법에 따라 2015년 10월 16일부터  발신번호 사전등록제 가 시행되었습니다. 발신번호 사전등록제는 전기 통신사업법 제 84조에 의거 거짓으로 표시된 전화번호로 인한 이용자 피해 예방을 위해서 이용고객이 사전등록된 발신번호로만 문자발송이 가능하도록 하는 제도입니다. 발신번호는 반드시 기업 또는 본인이 소유한 번호로 등록해야 하며, KISA가 발신번호 변조 의심으로 소명자료를 요청할 경우, 3일 이내에 제출하여야 합니다. 휴대푠 인증과 달리 서류인증으로 진행하게 되는데요 이때, 서류인증을 위해 필요한 문서가 바로 통신서비스 이용증명원* 입니다. * 통신서비스 이용증명원이란? 전기통신사업자가 이용자 본인이 사용하는 전화번호임을 증명하기 위해 발급하는 서류입니다. 가입자의 통신사명, 가입자의 성명/주소/생년월일(기업회원의 경우 사업자등록번호), 가입자 통신 서비스 종류(유선, 무선, 인터넷 전화 등) 및 전화번호가 포함되어 있어야하며, 등록 신청일 기준으로 3개월 이내에 발급된 서류여야만 합니다. 자세한 사항은 가입한 통신사 고객센터에 문의하시기 바랍니다. 사업자의 경우 통신사의 고객센터로 전화하여 상담원게 서류를 요청하거나 지점을 방문하여 이용증명원을 발급 받아야 한다고 합니다. <주요 통신사> <서비스 가입 확인서 예시> 통신서비스 이용증명원 발급이 완료되었다면 SENS SMS 발송 메뉴의 발신번호 등록 - 서류인증 요청 을

안녕하세요? 남산돈가스입니다. 지난 포스팅에서 네이버클라우드 SMS 발송 서비스인 SENS에 대해서 간략하게 소개하고, 실제 프로젝트를 생성하고, 콘솔 상에서 SMS 발송이 되는 것까지 확인해보았습니다. 이번 시간에는, SENS에서 제공하는 OPEN API를 활용하여 SMS를 발송해보는 법을 포스팅해보겠습니다. 일단, SENS OPEN API 사용설명서  를 확인해보면, API 사용을 위한 기본 정보가 자세히 설명되어있습니다. OPEN API 호출을 위한 기본적인 내용을 살펴보면 아래와 같습니다. Host -  https://api-sens.ncloud.com   Method - POST Path - /v1/sms/services/{serviceId}/messages * Header X-NCP-auth-key : 네이버 클라우드 플랫폼 회원에게 발급되는 개인 인증키 X-NCP-service-secret : 2차 인증을 위해 서비스마다 할당되는 service secret * Parameter serviceId - 프로젝트에 할당된 SMS 서비스 ID Body - SMS 발신 정보 요청 위에서 나열한 API 요청 정보를 하나씩 확인해보면, 먼저 Host는 네이버클라우드 API를 요청하기 위한 기본 URL입니다. 그리고 해당 API는 POST 매서드를 이용해 요청을 보낼 것이고, SENS SMS 발송 API를 위한 Path는 /v1/sms/services/{serviceId}/messages입니다. Path 내에 {serviceId} 부분은 지난 포스팅에서 생성했던 프로젝트의 serviceId를 삽입시켜주면 됩니다. 이 부분은 뒤에 다시 설명드리겠습니다. 여기까지 세가지 정보를 간단히 요약해보면, POST - https://api-sens.ncloud.com/v1/sms/services/서비스ID/messages 로 어떤 임의의 요청을 보내면 SMS가 발송되는구나라고 이해하

새해에도 가즈아~! 요새 핫 이슈인 비트코인 그래프에 귀여운 고양이들이 출몰하고 있네요 ㅎㅎ 사진 출처:  http://bit.ly/2CU8tOn 사진 출처:  http://bit.ly/2EZdIgv 사진 출처:  http://bit.ly/2AudbiQ 사진출처:  http://bit.ly/2CsxaAx 사진 출처:  http://bit.ly/2EYgH8L 코인고양이, 비트코인, 스트라티스, 에이다, ADA, bitcoin, coin cat