How We Coding

[TS] ts-node

Reference2019. 4. 30. 02:12

Nodejs 에서 타입스크립트(Typescript) 사용하기

http://cosmiclatte.co.kr/nodejs-에서-타입스크립트typescript-사용하기/

 

Nodejs 에서 타입스크립트(Typescript) 사용하기 - 코스믹라떼

개요 nodejs 란 chrome 에서 사용하는 V8 엔진 위에 구동되는 자바스크립트 런타임을 말한다.nodejs 를 사용하면 자바스크립트를 통해서 서버사이드 프로그래밍과 OS가 제공하는 리소스에 직접적으로 접근이 가능하여 자바스크립트의 활용도를 한층 높여주었다.자바스크립트는 동적 타이핑 언어로 프로그래밍에 유연함을 제공하는 대신에 타입에 대해 안전하지 않으며, 인터페이스와 추상 클래스 같은 명시적인 추상화 도구를 제공하지 않는다.이를 해소하기 위한 하나

cosmiclatte.co.kr

> 한 줄 요약 : ts-node 는 메모리 상에서 티입스크립트를 transpile 하여 바로 실행할 수 있게 해준다.

'Reference' 카테고리의 다른 글

[Reading] 190512 - 190518  (0) 2019.05.12
[cmd] curl  (0) 2019.05.09
[CSS]  (0) 2019.04.26
[AWS] AWS 아키 자격증  (0) 2019.04.25
[ES6] Babel, Webpack, Sass  (0) 2019.04.24

[CSS]

Reference2019. 4. 26. 15:46

checkbox 디자인 변경하는 방법

https://ithub.tistory.com/m/229

 

checkbox 디자인 변경하는 방법

안녕하세요. 웹 작업을 하거나 하이브리드앱을 만들때 checkbox 또는 radio 버튼을 커스터마이징 해야하는 경우가 많습니다. 이때 간단하게 checkbox 디자인을 변경하는 방법에 대해서 알아봅니다. 체크박스 custo..

ithub.tistory.com

 

CSS / border-radius - 테두리 둥글게 만드는 속성

https://www.codingfactory.net/10957

 

CSS / border-radius - 테두리 둥글게 만드는 속성

border-radius border-radius는 테두리를 둥글게 만드는 속성입니다. CSS3에서 정의되었으며, IE는 버전 9부터 지원합니다.(IE8에서 사용하는 방법) 8개의 속성 값을 넣어야 하지만, 값이 같다면 짧게 쓸 수 있습니다. 다음 상자의 테두리를 여러 가지 [...]

www.codingfactory.net

 

CSS / box-shadow - 박스에 그림자 효과 만드는 속성

https://www.codingfactory.net/10628

 

CSS / box-shadow - 박스에 그림자 효과 만드는 속성

개요 box-shadow는 선택한 요소에 그림자 효과를 만들어주는 속성입니다. 기본값 : none 상속 : No 애니메이션 : Yes 버전 : CSS Level 3 문법 box-shadow: none [...]

www.codingfactory.net

 

 

CSS / background-size - 배경 이미지의 가로 크기와 세로 크기를 정하는 속성

https://www.codingfactory.net/10559

 

CSS / background-size - 배경 이미지의 가로 크기와 세로 크기를 정하는 속성

개요 background-size로 배경 이미지의 가로 크기와 세로 크기를 정할 수 있습니다. 기본값 : auto 상속 : No 애니메이션 : Yes 버전 : CSS Level 3 문법 [...]

www.codingfactory.net

 

 

'Reference' 카테고리의 다른 글

[cmd] curl  (0) 2019.05.09
[TS] ts-node  (0) 2019.04.30
[AWS] AWS 아키 자격증  (0) 2019.04.25
[ES6] Babel, Webpack, Sass  (0) 2019.04.24
[AWS] Lamda@edge 를 이용한 이미지 리사이징  (0) 2019.04.21

AWS 아키자격증 따는법 - '18년 업데이트

https://brunch.co.kr/@topasvga/233

 

31.(정보)AWS 아키자격증 따는법-'18년 업데이트

아키텍트 AWS 비공식 가이드입니다. | 자격증 종류 아키 준비기간  3개월. 비용은 150불.  약 17 만원 권장시험 시기 목차 1.  용어의 이해 필수 2.  AWS 기출문제 풀기,AWS온라인문서, 교제 보기. 3. 시험 예약 1.  용어의 이해 필수 1) AWS 용어이해 https://brunch.co.kr/@topasvga/76 https://brunch.co.kr/@topasv

brunch.co.kr

> 당장은 아니지만, 도전해보고 싶다!!

 

AWS 용어 알아보기

https://brunch.co.kr/@topasvga/76#comment

 

2. AWS 용어 알아보기

AWS를 대충 구축해 운영하려면 , 서버(EC2)만 생성해 사용하면 된다. 하지만 점점 회사가 커지면 보안적인부분과 가용성을 고려해야 한다. 우선, 네트워크 구성부터 고민해야 한다. 다음은 대규모 서비스를 운영하는 서버의 일반 네트워크 구성도이다. 기존 인프라들이 AWS용어로 어떻게 되는지 비교해보자. 1. 네트워크는 VPC라 불린다. 2.

brunch.co.kr

 

AWS 용어 자세히 알아보자

https://brunch.co.kr/@topasvga/1

 

1.[AWS] AWS용어 자세히 알아보자!

AWS 용어 이해하고, 재밌게 놀아보자 | 개발자가 클릭 몇번하면 인프라가 제공되는 시대가 되었다. 그중 하나인 아마존 웹서비스 AWS에 대해 알아보자. 구성은 1. 사용자 2. 관리자 페이지 3. 클라우드 인프라로 구성된다. 클라우드 서비스는 용어가 다르다. 용어부터 알아야 서비스 이해가 쉽다. AWS서비스 용어를 알아보자 ^^ AWS는 보안그룹,VPC,EC2,S3 ,

brunch.co.kr

 

 

'Reference' 카테고리의 다른 글

[TS] ts-node  (0) 2019.04.30
[CSS]  (0) 2019.04.26
[ES6] Babel, Webpack, Sass  (0) 2019.04.24
[AWS] Lamda@edge 를 이용한 이미지 리사이징  (0) 2019.04.21
[docker] Docker for Mac  (0) 2019.04.21

Babel과 Webpack을 이용한 ES6 환경 구축 ①

https://poiemaweb.com/es6-babel-webpack-1

 

Babel | PoiemaWeb

현재 브라우저는 ES6를 완전하게 지원하지 않는다. ES6+(ES6 이상의 버전)를 사용하여 프로젝트를 진행하려면 ES6+로 작성된 코드를 IE를 포함한 모든 브라우저에서 문제 없이 동작시키기 위한 개발 환경을 구축하는 것이 필요하다. 특히 모듈의 경우, 모듈 로더가 필요하다. 트랜스파일러(Transpiler) [Babel](https://babeljs.io/)과 모듈 번들러(Module bundler) [Webpack](https://webpack.js

poiemaweb.com

 

Babel과 Webpack을 이용한 ES6 환경 구축 ②

https://poiemaweb.com/es6-babel-webpack-2

 

Webpack | PoiemaWeb

앞에서 테스트해 본 바와 같이 ES6 모듈을 현재의 브라우저에서 사용하려면 [RequireJS](http://requirejs.org/) 또는 [SystemJS](https://github.com/systemjs/systemjs)와 같은 모듈 로더가 필요하다. [Webpack](https://webpack.js.org/)은 의존 관계에 있는 모듈들을 하나의 자바스크립트 파일로 번들링하는 모듈 번들러이다. Webpack을 사용하면 의존 모듈이 하나의 파일로

poiemaweb.com

 

Sass의 소개, 설치와 간단한 명령어 사용법

https://poiemaweb.com/sass-basics

 

Sass - Basics | PoiemaWeb

Sass(Syntactically Awesome StyleSheets)는 CSS pre-processor로서 CSS의 한계와 단점을 보완하여 보다 가독성이 높고 코드의 재사용에 유리한 CSS를 생성하기 위한 CSS의 확장(extension)이다. CSS의 간결한 문법은 배우기 쉬우며 명확하여 프로젝트 초기에는 문제가 없이 보이지만 프로젝트의 규모가 커지고 수정이 빈번히 발생함에 따라 쉽게 지저분해지고 유지보수도 어려워지는 단점도 가지고 있다. 이러한 CS

poiemaweb.com

 

'Reference' 카테고리의 다른 글

[CSS]  (0) 2019.04.26
[AWS] AWS 아키 자격증  (0) 2019.04.25
[AWS] Lamda@edge 를 이용한 이미지 리사이징  (0) 2019.04.21
[docker] Docker for Mac  (0) 2019.04.21
[AWS] scp  (0) 2019.04.21

람다 엣지로 이미지 리사이징 (1) - s3와 클라우드 프론트 설정

https://afrobambacar.github.io/2018/12/image-resizing-with-lambda-edge.html

 

람다 엣지로 이미지 리사이징 (1) - s3와 클라우드 프론트 설정

비교적 쉬운 파트지만 IAM은 골치아파

afrobambacar.github.io

 

람다 엣지로 이미지 리사이징 (2) - 람다 엣지 작성과 연결

https://afrobambacar.github.io/2018/12/image-resizing-with-lambda-edge-2.html

 

람다 엣지로 이미지 리사이징 (2) - 람다 엣지 작성과 연결

이제 여러가지 난관에 봉착하게 되는데 ...

afrobambacar.github.io

 

Lambda 한개로 만드는 On-demand Image Resizing

https://engineering.huiseoul.com/lambda-한개로-만드는-on-demand-image-resizing-d48167cc1c31

 

Lambda 한개로 만드는 On-demand Image Resizing

Lambda 단! 한개로 만드는 On-demand Image Resizing

engineering.huiseoul.com

 

Lambda@Edge를 활용한 이미지 리사이즈 자동화

https://blog.wisen.co.kr/?p=7258#3

 

Lambda@Edge를 활용한 이미지 리사이즈 자동화

여기서 다루는 내용 · Lambda@Edge 개요 · Lambda@Edge 서비스를 활용한 이미지 리사이즈 WorkFlow · 부록: AWS 블로그 버전과 김세준님 버전의 차이점 · 정리 What is Lambda@Edge? 안녕하십니까, GS네오텍 최준승입니다. 오늘은 평소와 다르게 여러분들이 좀 관심있을만한 실용적인 내용을 소개해 드리려고 합니다. 제목을 다시 한번 보겠습니다. "Lambda@Edge를 활용한 이미지 리사이즈 자동화" 네요. 문맥으로

blog.wisen.co.kr

 

AWS Lambda@Edge에서 실시간 이미지 리사이즈 & WebP 형식으로 변환

https://medium.com/daangn/lambda-edge로-구현하는-on-the-fly-이미지-리사이징-f4e5052d49f3

 

AWS Lambda@Edge에서 실시간 이미지 리사이즈 & WebP 형식으로 변환

안녕하세요, 당근마켓에서 백엔드 서버 개발 인턴으로 근무하고 있는 Marco입니다. 저는 이번에 당근마켓 서비스의 썸네일 생성 방식을 On-The-Fly 이미지 리사이징으로 새롭게 구현하였습니다. 이번 글을 통해 그 과정을 공유하려고 합니다.

medium.com

 

Lambda@Edge를 이용한 DIMS 구현

https://github.com/kimsejun2000/lambdaedgedims

 

kimsejun2000/lambdaedgedims

Contribute to kimsejun2000/lambdaedgedims development by creating an account on GitHub.

github.com

 

'Reference' 카테고리의 다른 글

[AWS] AWS 아키 자격증  (0) 2019.04.25
[ES6] Babel, Webpack, Sass  (0) 2019.04.24
[docker] Docker for Mac  (0) 2019.04.21
[AWS] scp  (0) 2019.04.21
[Web] HTTP  (0) 2019.04.19

Docker for Mac (맥북에 도커 설치, 빌드, 생성등)

 

https://daeson.tistory.com/290

 

Docker for Mac (맥북에 도커 설치, 빌드, 생성등)

최근 엄청난 인기를 누리고 있는 가상화 머신을 아주 쉽게 제공해주는 도커(Docker)를 맥북에 설치하고 생성해보면서 정리한 내용입니다. 아주 쉽게 가상화 머신을 생성하고 제거하고 관리를 할 수 있어 다양한 OS..

daeson.tistory.com

 

'Reference' 카테고리의 다른 글

[ES6] Babel, Webpack, Sass  (0) 2019.04.24
[AWS] Lamda@edge 를 이용한 이미지 리사이징  (0) 2019.04.21
[AWS] scp  (0) 2019.04.21
[Web] HTTP  (0) 2019.04.19
[AWS] git, node 설치  (0) 2018.09.02

[AWS] scp

Reference2019. 4. 21. 02:13

[AWS] EC2 ssh 원격 접속과 scp를 통한 파일 전송

 

https://ict-nroo.tistory.com/40

 

[AWS] EC2 ssh 원격 접속과 scp를 통한 파일 전송

AWS EC2 ssh 원격 접속과 scp를 통한 파일 전송 EC2 인스턴스 생성이 성공적으로 끝났다면, 다음과 같이 CLI환경에서 ssh를 통해서 EC2에 원격 접속을 할 수 있고, scp를 통해 간단한 파일 업/다운로드를 할 수 있..

ict-nroo.tistory.com

 

 

'Reference' 카테고리의 다른 글

[ES6] Babel, Webpack, Sass  (0) 2019.04.24
[AWS] Lamda@edge 를 이용한 이미지 리사이징  (0) 2019.04.21
[docker] Docker for Mac  (0) 2019.04.21
[Web] HTTP  (0) 2019.04.19
[AWS] git, node 설치  (0) 2018.09.02

[Web] HTTP

Reference2019. 4. 19. 16:44

- HTTP 개요

https://developer.mozilla.org/ko/docs/Web/HTTP/Overview

 

HTTP 개요

HTTP는 HTML 문서와 같은 리소스들을 가져올 수 있도록 해주는 프로토콜입니다. HTTP는 보통 브라우저인 수신자에 의해 요청이 초기화되는 것을 의미하는, 웹과 클라이언트-서버 모델 상에서 모든 데이터 교환의 기초입니다. 하나의 완전한 문서는 페치(Fetch)된 또 다른 하위 문서, 텍스트, 레이아웃 설명, 이미지, 비디오, 스크립트 등으로 구성됩니다.

developer.mozilla.org

 

- HTTP 란

https://www.zerocho.com/category/HTTP/post/5b344f3af94472001b17f2da

 

(HTTP) HTTP란 무엇인가 - 웹 개발자의 역할

안녕하세요. 이번 시간에는 HTTP에 대해서 알아보겠습니다. HTTP는 Hyper Text Transfer Protocol의 두문자어로, 인터넷에서 데이터를 주고받을 수 있는 프로토콜입니다. 프로토콜은 규칙이라고 생각하시면 됩니다. 이렇게 규칙을 정해두었기 때문에, 모

www.zerocho.com

 

- HTTP 메서드

https://www.zerocho.com/category/HTTP/post/5b3723477b58fc001b8f6385

 

(HTTP) HTTP 메서드 - GET, POST, PUT, PATCH, DELETE

안녕하세요. 이번 시간에는 HTTP 메서드에 대해 알아보겠습니다. 지난 시간 요청 메시지의 시작줄에 GET이라는 단어가 들어있는 것을 보셨을 것입니다. GET https://www.zerocho.com HTTP/1.1 위 한 줄을 볼 때, 어떤 생각이 드시나요?(아무

www.zerocho.com

 

- 알아둬야 할 HTTP 공통 & 요청 헤더

https://www.zerocho.com/category/HTTP/post/5b3ba2d0b3dabd001b53b9db

 

(HTTP) 알아둬야 할 HTTP 공통 & 요청 헤더

안녕하세요. 이번 시간에는 유명한 헤더들에 대해서 알아보겠습니다. 헤더 종류가 너무 많기 때문에 공통 헤더와 요청에서 사용되는 헤더를 먼저 알아봅니다. 잠깐 복습을 해볼까요? 서버의 역할이 클라이언트로부터 요청을 받아서 응답을 보내는 것이라고 했죠. 요청과 응답은 메시

www.zerocho.com

 

- 알아둬야 할 HTTP 응답 헤더

https://www.zerocho.com/category/HTTP/post/5b4c4e3efc5052001b4f519b

 

(HTTP) 알아둬야 할 HTTP 응답 헤더

안녕하세요. 이번 시간에는 HTTP 응답 헤더들에 대해 알아보겠습니다. 지난 시간의 공통 헤더 & 요청 헤더 강좌와 이어집니다. 응답 헤더 Access-Control-Allow-Origin 프론트엔드 개발자들에게 악명 높은 헤더입니다. 요청을 보내는 프론트 주소

www.zerocho.com

 

- 알아둬야 할 HTTP 쿠키 & 캐시 헤더

https://www.zerocho.com/category/HTTP/post/5b594dd3c06fa2001b89feb9

 

(HTTP) 알아둬야 할 HTTP 쿠키 & 캐시 헤더

안녕하세요. 이번 시간에는 쿠키 & 캐시 전용 헤더만 따로 알아보겠습니다. 웹 자원을 효율적으로 쓰기 위해서는 캐싱이 중요합니다. 똑같은 데이터를 계속해서 내려 받을 필요는 없죠. 쿠키는 클라이언트(프론트)와 서버 간에 데이터를 주고받는 가장 간단한 방법 중 하

www.zerocho.com

 

 

- 알아둬야 할 HTTP X 헤더

https://www.zerocho.com/category/HTTP/post/5b611b9e33b4636aa8bb1fc4

 

(HTTP) 알아둬야 할 HTTP X 헤더

안녕하세요. 이번 시간에는 X-로 시작하는 헤더들에 대해서 알아보겠습니다. 지금까지 많은 유명한 헤더들을 알아보았는데요. X-로 시작하는 헤더들은 무슨 의미를 갖고 있는지 궁금하셨을 것입니다. 예전에 사용자가 임의로 헤더를 정의할 때, 사용자가 정의한 헤더라는 것을 알

www.zerocho.com

 

'Reference' 카테고리의 다른 글

[ES6] Babel, Webpack, Sass  (0) 2019.04.24
[AWS] Lamda@edge 를 이용한 이미지 리사이징  (0) 2019.04.21
[docker] Docker for Mac  (0) 2019.04.21
[AWS] scp  (0) 2019.04.21
[AWS] git, node 설치  (0) 2018.09.02

- EC2 인스턴스에 git, node 설치


http://strongstar.tistory.com/28


http://programmingsummaries.tistory.com/374

'Reference' 카테고리의 다른 글

[ES6] Babel, Webpack, Sass  (0) 2019.04.24
[AWS] Lamda@edge 를 이용한 이미지 리사이징  (0) 2019.04.21
[docker] Docker for Mac  (0) 2019.04.21
[AWS] scp  (0) 2019.04.21
[Web] HTTP  (0) 2019.04.19