원강민의 Wonhada 블로그

Category

리액트 네이티브

ES6: 배열 확산 [Array Spread]

배열 확산 구문을 사용하면 배열을 쉽게 확장 할 수 있습니다. 선택적으로 복사본에 다른 요소가 추가된 배열의 단순 복사본을 만드는 데 사용할 수 있습니다. [ 배열 확산 ] const animals = [’cat’, ‘dog’, ‘moose’] const newAnimals = […animals] const lotsOfAnimals =… Continue Reading →

ES6: 동적 객체 키 [Dynamic Object Keys]

ES5에서 객체 리터럴 키는 항상 문자열로 해석됩니다. ES6는 [myKey] 대괄호 구문을 사용하여 계산된 값을 객체 리터럴의 키로 사용할 수 있습니다. [ 동적 객체 키 ] const chosenAnimal = ‘cat’ const animals = {   [`animal${chosenAnimal}`]: true, } console.log(animals.animalcat) // true… Continue Reading →

ES6: 클래스 [Classes]

ES5에서 클래스는 MyFunction.prototype에 인스턴스 메소드가 할당된 함수일 뿐이었습니다. ES6를 사용하면 보다 간단한 class 구문을 사용할 수 있습니다. class는 인스턴스 함수, 정적 함수 및 상속을 제공합니다. 생성자는 클래스 인스턴스가 생성될 때마다 자동으로 호출되는 특수한 함수입니다. static 키워드를 사용하여 정적 클래스 함수를… Continue Reading →

ES6: 기본 파라미터 [Default Parameters]

함수 선언 내에서 함수 매개변수에 기본값을 할당할 수 있습니다. 정의되지 않은 경우 매개 변수에 기본값이 지정됩니다. [ Default parameters ] const printAnimal = (animal = ‘cat’) => {   console.log(animal) } printAnimal() // cat printAnimal(’dog’) // dog [ 바벨로 컴파일된… Continue Reading →

ES6: 가져오기와 내보내기 [Imports and Exports]

ES6는 널리 사용되는 CommonJS 패턴보다 더 고급화된 모듈 가져오기/내보내기 패턴을 제공합니다. 이전 module.exports = {…}와는 달리 이제 여러 개의 명명된 값을 내보낼 수 있습니다. 마찬가지로 여러 개의 명명된 값을 가져올 수 있습니다. 파일 당 하나의 기본 내보내기가 있으며 이 내보낸… Continue Reading →

ES6: 구조분해[Destructuring]

구조분해[Destructuring]은 객체 또는 배열에서 여러 키를 동시에 추출하고 로컬 변수에 값을 할당하는 편리한 방법입니다. [ 구조분해 ] const arr = [’one!’, ‘two!’, ‘three!’, ‘four!’] const [one, two, …rest] = arr const obj = {a: ‘x’, b: ‘y’, c: ‘z’} const… Continue Reading →

ES6: Fat Arrow[=>] 함수

fat arrow ‘=>’는 익명 함수를 정의하는 데 사용됩니다. function으로 정의된 함수와 비교할 때 이 함수의 동작에는 두 가지 중요한 차이점이 있습니다. 첫째, this 키워드에 대한 바인딩은 바깥과 fat arrow 함수 내부가 동일합니다. 이것은 function으로 선언된 함수와 다르며, 호출할 때 this를… Continue Reading →

ES6: 변수의 블록 범위 선언[Block Scoped Declarations]

var를 사용하여 지역 변수를 선언하는 대신 const와 let을 사용합니다. 가장 큰 차이점은 var는 함수의 범위를 지정하고 const와 let은 블록의 범위를 지정한다는 것입니다. 또한 const로 선언된 변수는 한 번만 값을 할당할 수 있습니다. 동일한 이름에 다른 값을 할당하면 컴파일러 오류가 발생합니다…. Continue Reading →

ES6

ECMAScript는 JavaScript 언어를 구현하는 데 사용되는 언어 사양입니다. ES6 또는 ECMAScript 6은 ES5가 2009년에 처음 출시된 이후의 언어에 대한 첫 번째 중요한 업데이트입니다. 많은 ES6 기능은 최신 자바스크립트 엔진에서 이미 사용할 수 있습니다. 그러나 Babel을 사용하면 더 많은 기능을 이용할… Continue Reading →

모던 자바스크립트[Modern JavaScript]

예전에는 웹 페이지의 헤더에 <script> 태그를 넣으면 JavaScript가 의도한대로 실행되었습니다. 요즘은 JSX와 같은 실험적인 기능들과 언어 확장에 액세스하기 위해 자바스크립트가 사전 처리됩니다. 바벨[Babel] Babel은 JavaScript를 사전 처리하는 데 사용되는 주요 도구입니다. Babel은 실험용 기능과 확장 기능을 사용하여 광범위한 플랫폼에서 지원되는… Continue Reading →

리액트 네이티브[React Native] 배우기

리액트 네이티브[React Native]는 크로스 플랫폼 앱을 제작하기 위한 프레임워크입니다. 리액트 네이티브로 앱을 만드는 것은 매우 효율적이고 중독성도 높습니다. 그러나 시작하기에 약간 까다로운 점이 있습니다. 이 가이드는 공식 Facebook 문서와 함께 참고해야 합니다. Facebook 가이드는 기본적으로 React에 대한 지식이 있다고 가정합니다…. Continue Reading →

네이티브 iOS (Swift)와 React-Native 간의 성능 비교

React-Native는 JavaScript만 사용하여 앱을 제작할 수 있는 하이브리드 모바일 프레임워크입니다. 그러나 다른 하이브리드 모바일 기술과 달리 “모바일 웹앱”(기본 컨테이너에 래핑된 웹 응용 프로그램)을 만들지 않습니다. 결국, 당신은 진짜를 얻습니다. 자바스크립트 코드 베이스로 만들지만 Objective-C 또는 Java를 사용하여 작성된 iOS, Android… Continue Reading →

안드로이드 에뮬레이터에 리액트 네이티브[React Native] 설정 창 띄우기

1. 터미널에서 Android Virtual Device (AVD) Manager를 띄웁니다. android avd 2. 에뮬레이터를 새로 만들거나 기존 것을 실행합니다. 3. 터미널에서 RN 프로젝트를 빌드하고 실행합니다. react-native run-android 4. 터미널에서 아래와 같이 입력합니다. adb shell input keyevent 82 세팅 창이 팝업됩니다. Live Reload와… Continue Reading →

리액트 네이티브[React Native] 스터디 샘플

리액트 네이티브[React Native] 튜토리얼 번역: https://wonhada.com/?docs=%EB%A6%AC%EC%95%A1%ED%8A%B8-%EB%84%A4%EC%9D%B4%ED%8B%B0%EB%B8%8Creact-native-0-41 리액트 네이티브[React Native] 스터디에서 아래 기획서대로 앱을 만들기로 했습니다. https://ovenapp.io/project/lyYmCSSN8CJjW3KVlLLTER9iLMeuzx17#Q2Hff 구현된 앱을 캡쳐했습니다. [[ 소스 코드 ]] /**  * Sample React Native App  * https://github.com/facebook/react-native  * @flow  */ import React, { Component } from… Continue Reading →

© 2017 원강민의 Wonhada 블로그 — Powered by WordPress

Theme by Anders NorenUp ↑