반응형 분류 전체보기580 [TypeScript] Interface / 타입 별칭 / 화살표 함수 1. Interface 인터페이스는 객체의 구조 규칙을 의미한다. 타입스크립트에서는 인터페이스를 이용하여 깔끔한 객체지향 프로그래밍이 가능하다. 아래 예시에 interface 선언, 객체 생성, 객체 사용에 대해 다루었다. 예제 1 //User interface 선언 interface User { readonly id:string; //읽기만 가능한 프로퍼티, 한번 초기화되면 수정 불가 pw:string; age?:number; //선택적 프로퍼티(?) - 생략 가능한 프로퍼티 vip:boolean; } //고객의 등급을 vip로 올린다. function vipUpgrade(user:User):User{ user.vip=true; return user; } //User 객체 생성 let jooyeok:U.. 2021. 4. 21. [TypeScript] Static Typing / Type의 선언, 단언, 가드 1. Static Typing 선언된 type대로 할당, 반환되는 원칙 타입스크립트에서는 변수를 한 번 선언하게 되면, 알아서 타입을 추론해서 확정시킨다. 예를 들어 아래 코드를 보자. a를 number형으로 한 번 확정지었기 때문에 문자열로 값을 바꾸면 오류가 표시되는 모습을 볼 수 있다. 2. Type 선언 다음과 같이 변수명 뒤에 콜론(:)과 type을 붙여 선언할 수 있다. let _name:string = "Hello, TypeScript!"; let age:number = 24; let isHuman:boolean = true; 데이터 타입 string : 문자열 number : 숫자(부동 소수점, 2진법, 8진법, Infinity, NaN 가능) boolean : true/false any .. 2021. 4. 20. [TypeScript] TypeScript 소개 및 설치 1. TypeScript 소개 JavaScript를 기반으로 만들어졌고 변수에 데이터 type을 지정할 수 있는 언어 JavaScript를 기반으로 한 언어이기 때문에, JavaScript의 모든 기능과 함께 JavaScript에 없는 새로운 기능을 제공한다. TypeScript의 장점으로는 객체지향 프로그래밍이 가능하다는 점, 버그를 줄일 수 있다는 점, 유지 보수가 편리하다는 점이 있다. 또한, TypeScript를 이해하지 못하는 브라우저를 위해 JavaScript로 컴파일 해주는 기능도 제공한다. 2. TypeScript 설치 TypeScript는 npm명령으로 설치하기 때문에 Node.js를 설치해야 하는데, 설치는 간단하므로 자세한 설명은 생략한다. nodejs.org/ko/download/ .. 2021. 4. 20. [Webpack] config 파일(2) - loader, plugin 1. Loader webpack은 기본적으로 자바스크립트 모듈을 bundle 해주는데, Loader을 이용하면 다른 확장자 파일들도 같이 bundle 해줄 수 있다. 예를 들어 js, css를 bundle해보자. 다음 예제는 엔트리파일(index.js)과 css파일(reverse.css)을 같이 bundle하는 것이 목표이다. 다음 webpack문서를 보면 CSS파일을 로딩하는 방법을 알 수 있다. webpack.js.org/guides/asset-management/#loading-css Asset Management | webpack webpack is a module bundler. Its main purpose is to bundle JavaScript files for usage in a bro.. 2021. 4. 19. [Webpack] config 파일(1) - entry, output, mode 1. 설정 파일 생성 및 entry, output 옵션 설정 이전 webpack 포스팅에서 다음 명령어로 bundle작업을 수행했다. npx webpack --entry [Entry file 경로] --output-path [bundle 파일을 생성할 경로] 이렇게 직접 입력해도 되지만, 위 명령이 너무 길어서 불편한 분들은 설정(config) 파일을 도입해보는 것도 괜찮다. Configuration파일 관련 내용은 아래 문서에서 확인할 수 있다. webpack.js.org/configuration/ Configuration | webpack webpack is a module bundler. Its main purpose is to bundle JavaScript files for usage in a .. 2021. 4. 16. [Webpack] Webpack 사용법 이전 포스팅에 올렸던 순서도를 그대로 가져왔다. 이제 본격적으로 위의 절차를 그대로 따라 Bundle 파일을 생성하고, 이 Bundle 파일을 html의 script에 포함시켜서 웹사이트를 실행시켜볼 것이다. 1. 자바스크립트 파일 생성 [자바스크립트 파일들을 생성한 뒤, 각 파일마다 외부로 보낼 변수를 export default로 지정해주는 단계] p1.js let s = "원숭이 엉덩이는 빨개"; export default s; p2.js let s = "빨가면 사과"; export default s; p3.js let s = "사과는 맛있어"; export default s; 2. Entry 파일 생성 [자바스크립트 모듈들을 한 파일에 모으는 단계] index.js 모듈을 사용하여 p1.js, p2.. 2021. 4. 15. [Webpack] Webpack 소개 Webpack이란? 대표적인 자바스크립트 모듈 번들러 이번 포스팅에서는 모듈과 번들러의 개념을 이해하여, Webpack이 무엇인지 알아보는 시간을 가져볼 것이다. 1. 모듈 많은 자바스크립트 패키지를 사용하다보면, 파일간에 변수명이 겹치는 경우가 발생하여 어플리케이션이 의도와 다르게 동작할 수 있다. 이러한 문제는 모듈을 이용하여, 어느 변수가 어느 자바스크립트 파일에 있는 변수인지 구분하여 충돌을 방지할 수 있다. 모듈은 쉽게 말하자면 부품같은 개념이다. 그렇다면 다음 예제를 통해 모듈을 더 깊게 이해해보자. 모듈 사용 예 오른쪽 창의 helloworld.js을 보면, 외부에서 사용할 변수 a를 export default로 지정해준 모습이다. 그리고 이 값을 태그 내에서 받기 위해서는 type옵션을 반.. 2021. 4. 15. [Linux] SSH / rsync 1. SSH secure shell, 서버에 원격 접속을 안전하게 할 수 있게 해주는 시스템 참고로, 원격 접속이 필요한 사물인터넷에 많이 이용된다. 1) 동작 원리 다른 컴퓨터에 있는 리눅스 사용자의 계정에 원격 접속을 하기 위해서, 요청을 보내는 컴퓨터에는 SSH 클라이언트가 설치되어 있어야 하고, 요청을 받는 컴퓨터에는 SSH 서버가 실행되고 있어야 한다. SSH 클라이언트가 원격 접속할 사용자명과 원격 접속할 서버의 ip주소를 가지고 요청하면, SSH 서버에서는 이 정보를 받아서 원격 접속을 허용한다. 2) 설치 (1) SSH 클라이언트 설치 sudo apt-get install openssh-client (2) SSH 서버 설치 sudo apt-get install openssh-server ※.. 2021. 4. 14. [Git] git archive / 특정 commit 주석 수정하기 1. git archive git archive명령으로 프로젝트 폴더 내의 소스코드 파일만 압축할 수 있다. 프로젝트 구성은 이렇다. .git과 개발썸네일은 각각 폴더와 이미지 파일이다. 아래 명령어로 소스코드만 압축된 zip또는 tar파일을 생성할 수 있다. git archive --format=[zip 혹은 tar] [브랜치명] -o [이름] ※ -o옵션: output 명령을 실행했더니 이렇게 main이라는 이름의 zip파일이 생성되었고, 소스코드 파일만 잘 압축되었다. 2. 특정 commit 주석 수정하기 git commit --amend은 최근 커밋 주석을 수정하는 명령이다. 그렇다면 특정 commit 주석 을 수정하는 방법도 있을까? git rebase의 -i옵션을 이용하면 된다. i는 inte.. 2021. 4. 9. 이전 1 ··· 32 33 34 35 36 37 38 ··· 65 다음
