본문 바로가기

javascript12

React Native Typescript(타입스크립트)로 프로젝트 생성하는 법 보통 React Native 프로젝트를 생성할 때 아래 명령어를 사용하게 된다. npx react-native init MyTestApp 하지만 이렇게 하게되면 자바스크립트 기준으로 프로젝트가 생성되기 때문에 나중에 타입스크립트로 전환이 쉽지 않다. 처음부터 타입스크립트로 프로젝트를 생성하면 자바스크립트와 타입스크립트를 같이 사용할 수 있게 된다. 왜냐면 타입스크립트는 자바스크립트의 Superset이기 때문이다. 다음 명령어로 React Native 프로젝트를 타입스크립트 프로젝트로 생성 할 수 있다. npx react-native init MyTestApp --template react-native-template-typescript 조금 명령어가 다소 길어보이나.. 유용하게 써먹을 수 있을 것이다. .. 2022. 3. 6.
NodeJS 바이너리 설치하기 / CentOS CentOS에서 nodeJS를 이용하는 방법은 yum 패키지 설치, 소스컴파일, 바이너리 설치가 있다. yum 패키지 설치의 경우 최신버전이나 특정 버전을 설치하기 어렵다. 또 소스컴파일 방법의 경우 개발 툴셋이 설치 되어 있어야하며 빌드 시간이 오래 걸린다는 단점이 있다. 때문에 바이너리 설치 방법이 가장 빠르고 편한 방법이 될 수 있다. 1. NodeJS 바이너리 아카이브 다운로드 NodeJS 홈페이지(nodejs.org/en/download/)에서 원하는 버전의 압축파일을 다운로드 받는다. 우리는 CentOS에 설치 할 것이므로 Linux x64 바이너리를 wget 명령어를 이용하여 적절한 위치에 다운로드 받는다. 2. 압축 풀기 tar명령으로 다운로드 받은 바이너리를 적절한 경로에 풀어준다. ta.. 2020. 12. 28.
Javascript ES6 - 템플릿 문자열 템플릿 문자열 자바스크립트에서 문자열안에 값을 써야 하는 경우가 아주 많습니다. ES6이전에는 이러한 처리를 다음과 같이 문자열 병합으로 해결 했었습니다. var value = 5; console.log("값은 "+ value + "입니다."); //값은 5입니다. 하지만 ES6에서는 템플릿 문자열이라는 기능을 제공합니다. 마치 C언어에서 FormatString과 같이 문자열에 값을 바인딩 하여 사용 할 수 있습니다. 다음은 위 코드를 템플릿 문자열을 사용하여 value를 문자열에 바인딩 한 예입니다. var value = 5; console.log(`값은 ${value}입니다.`); //값은 5입니다. 템플릿 문자열을 사용할때는 작은 따옴표' 나 큰따옴표" 를 사용하지 않고 백틱(backtick)문자 .. 2020. 3. 31.
Javascript ES6 - 함수(function) 정리 4 / 화살표 표기법 12. 화살표 표기법 자바스크립트 ES6에는 화살표 표기법이 도입 되었습니다. 화살표 표기법은 function이라는 단어와 중괄호를 줄이려고 고안된 단축 문법이라고 합니다. 화살표 함수에는 세 가지 단축 문법이 있습니다. function을 생략 함수에 매개변수가 단 하나 뿐이라면 ()도 생략할 수 있음. 함수 바디가 표현식 하나라면 중괄호와 return도 생략할 수 있음. 화살표 함수는 또한 항상 익명이기 때문에 변수에 할당 할 수 있지만 이름이 있는 함수를 만들 수 없습니다. const f1 = function() { return "hello"}; const f2 = ()=> "hello"; //function 생략 const f3 = function(name) { return `hello ${name.. 2020. 3. 31.
Javascript ES6 - 함수(function) 정리 3 지난번 Javascript ES6 함수 정리 1, 2에 이어서 계속 ES6의 함수에 대해서 알아 보겠습니다. https://lucidmaj7.tistory.com/127 Javascript ES6 - 함수(function) 정리 1 1. 함수 선언 자바스크립트에서 함수 선언은 function 함수명(인자,인자..) 형태로 선언됩니다. 그 예는 아래와 같습니다. function sayHello() { console.log("Hello !!"); console.log("hi"); } sayHello(); //.. lucidmaj7.tistory.com https://lucidmaj7.tistory.com/128 Javascript ES6 - 함수(function) 정리 2 5. 함수를 결정하는 것 보통 다른.. 2020. 3. 30.
Javascript ES6 - 함수(function) 정리 2 5. 함수를 결정하는 것 보통 다른 프로그래밍 언어에서는 함수의 시그니처에 매개변수가 포함됩니다. C++에서 f()와 f(int a)는 다른 함수이죠. 하지만 자바스크립트에서는 매개변수가 다르더라도 함수의 이름이 같다면 같은 함수를 가리킵니다. function foo(x) { console.log(`x는 ${x}`); } const param = 5; foo(); //x는 undefined foo(param); //x는 5 6. 매개변수 해체 자바스크리트 함수의 매개변수는 해체 될 수 있습니다. 그 예는 아래와 같습니다. 프로퍼티 이름은 반드시 유효한 식별자여야 하고 들어오는 객체에 해당하는 프로퍼티가 없는 변수는 undefined를 할당 받습니다. function getSentence({subject,.. 2020. 3. 24.
Javascript ES6 - 함수(function) 정리 1 1. 함수 선언 자바스크립트에서 함수 선언은 function 함수명(인자,인자..) 형태로 선언됩니다. 그 예는 아래와 같습니다. function sayHello() { console.log("Hello !!"); console.log("hi"); } sayHello(); // 함수 호출 Hello! 함수를 선언하고나서 함수를 call해야 실행이 됩니다. 2. 함수의 반환(return) 함수는 호출 후 값을 반환 할 수 있습니다. 이때 return이라는 키워드를 통해 함수를 즉시 종료하고 값을 반환합니다. 그 예제 코드는 다음과 같습니다. function sayHello() { return "hello!!"; //값 리턴 } let val = sayHello(); // 함수 호출 값 저장 console... 2020. 3. 24.
macOS 10.15 카탈리나에서 npm 패키지 설치시 권한 오류 macOS 10.15카탈리나에서 npm 패키지 설치시 권한 오류가 발생 하는 경우가 있습니다. sudo 명령어를 같이 써줘도 권한문제가 발생합니다. Error: EACCES: perminsion denided 이때 npm의 기본 경로를 유저 홈디렉터리 밑으로 옮겨주고 환경변수를 다시 설정하여 권한 문제를 해결 할 수 있습니다. 1. 유저 디렉터리에 설치경로 생성 Wonheeui-MacBookPro:~ lucidmaj7$ mkdir ~/.npm-global 2. npm config set prefix Wonheeui-MacBookPro:~ lucidmaj7$ npm config set prefix '~/.npm-global' 3. 환경변수 설정 Wonheeui-MacBookPro:~ lucidmaj7$ e.. 2020. 3. 22.
NodeJS, NPM설치 하기 - 자바스크립트(Javascript) , macOS 자바스크립트 ES6개발 환경을 구축하기 앞서 npm을 설치 해야합니다. nodeJS개발 환경에서 npm은 필수이지만 프론트엔드 개발 환경에서 npm은 필수가 아닙니다. 하지만 프론트엔드 개발에서 ES6를 사용한다면 npm을 사용하는 것이 훨씬 편리해집니다. npm을 통해서 빌드도구인 gulp와 트랜스컴파일러인 babel을 설치 할 수 있습니다. npm은 node를 설치할 때 같이 설치 됩니다. nodejs홈페이지에서 node를 다운 받아서 설치 하면됩니다. 설치 버전은 stable버전인 LTS버전을 설치하면 되겠습니다. macOS버전 기준으로 node-v12.16.1.pkg을 받았습니다. 우클릭->열기를 통해 인스톨러를 실행하면 아래와 같이 보안경고창이 뜹니다. 여기서 열기를 클릭하여 실행합니다. 해당 .. 2020. 3. 22.