ES6란? ECMAScript 2015 혹은 ECMAScript 6는 ECMAScript의 표준 버전이다. 문법의 해당 사항으로는 아래와 같다. 변수 선언, const & let 화살표 함수, Arrow Function 템플릿 리터럴, Template Literals 기본 매개 변수, Default parameters 배열, 객체의 비구조화, Array & object destructing 가져오기 및 내보내기, import & export 프로미스, promise 클래스, Class 나머지 매개 변수 및 확산 연산자, Rest parameter & Spread operator 변수 선언, const & let const와 let은 변수 선언을 위한 새로은 ES6의 키워드다. //기존 변수 선언 var ..

Http 모듈을 이용하여 서버를 활성화 하자 http 모듈은 내장 모듈로, 별도의 설치 없이 이용 가능하다. //http 모듈 추출 const http = require("http") //http.createServer 이용하여 서버 객체 생성 const server = http.createServer((req, res) => { //Get반응으로 "/" 경로 요청시 Hello Node JS 반환 if (req.url === "/" && req.method === "get") { res.statusCode = 200 res.end("Hello Node JS") } }) const port = 8080 server.listen(port, () => console.log(`Server on port : ${..

" data-ke-type="html">HTML 삽입미리보기할 수 없는 소스

React CDN React, ReactDom, Babel을 사용하기 위한 CDN이다. /* react cdn */ /* babel cdn */ JS를 이용하여 Counter 페이지 만들기 Btn을 클릭할 시 Total 횟수가 증가하는 Page를 JS를 이용하여 만들어보자. HTML 삽입 미리보기할 수 없는 소스 Click Total : 0 React를 이용하여 Counter 페이지 만들기

01. src 폴더 안에 components 폴더 생성 후 Hello.js파일 생성 cd src mkdir components cd components touch Hello.js 02. Hello Function 생성 후 Tag 반환 export default function Hello () { //1 return( Hello React ) } //1 export default 설정을 해두면 해당 파일을 읽을 때 기본적으로 해당 함수(Hello)를 호출한다. 03. App.js에서 호출하기 import Hello from "./components/Hello"; //1 export default function App() { return ( //2 ) } //1 import from을 사용하여 Hello ..

01. Node JS 설치 아래의 링크로 들어가 Node JS를 설치한다. 이 때 LTS 버전으로 설치하자. Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 02. npx react-create-app "폴더 이름" npx create-react-app pinoReact 03. 생성된 폴더에서 vscode를 실행시키면 아래와 같은 폴더 구조로 이루어짐 04. 프로그램 실행 아래의 명령어를 이용하여 프로그램을 실행한다. npm start 실행하면 아래와 같은 화면이 나오면 성공이다.

JavaScript의 자료형은 Number, String, Null, Boolean, Undefinded ...가 있는 데, 그 중 배열(array)와 객체(object)에 대해서 알아보자. 배열 Array 배열은 여러가지의 값을 한 번에 저장할 수 있는 자료형이며, 형태는 아래와 같다. //배열 생성 let ary1 = [1,2,3] //빈 배열 생성 let ary2 = [] 배열은 자료의 순서가 중요한 자료형이며, 배열에 속한 값을 꺼낼 때는 아래와 같다. let ary1 = [1,2,3] ary[0] //1 ary[1] //2 ary[2] //3 아래와 같은 방법으로 배열에 값을 넣거나, 수정할 수 있다. //ary1 let ary1 = [1,2,3] ary1[0] = 6 console.log(ar..

JavaScript에서 함수란 코드의 집합을 의미하며, 아래와 같이 작성한다. /* function 함수명(매개변수){ 실행 코드 } */ function MyFunction() { } 추가로 아래와 같이 함수를 선언 할 수 있다. //익명 함수 : 함수에 이름을 짓지 않고 선언하고, 변수에 저장한다. const myFunction = function(){ } //화살표 함수(Arrow Function) : 익명 함수의 ES6 표기 방법 /* function 키워드 대신 소괄호 뒤에 '=>'를 적어 선언 */ const myFunction = () => { } //콜백 함수 : 매개 변수로 넘어가는 함수를 의미하며 익명 함수(혹은 화살표 홤수)와 같이 작성한다. myFunction(() => {}) 함수..

022-05-02T02:19:44,021: [cli] Failed to open /Users/admin/Library/LaunchAgents/com.github.facebook.watchman.plist for write: Permission denied Fatal error detected at: 0 libfolly.0.58.0-dev.dylib 0x000000010f13832e _ZN5folly10symbolizer17getStackTraceSafeEPmm + 9 1 libfolly.0.58.0-dev.dylib 0x000000010f1396fb _ZN5folly10symbolizer21SafeStackTracePrinter15printStackTraceEb + 63 2 watchman 0x00000..

저는 Xcode 혹은 Android Studio를 설치하여 진행하지 않고, expo로 휴대폰과 연결하여 사용 합니다. 01. 터미널의 명령어를 이용하여 expo-cli를 다운 받고, expo init으로 프로젝트 생성 //Install expo npm install --global expo-cli //Create Project(project name : FirstApp) expo init FirstApp //Templete Blank 선택 02. App Store에서 Expo Go 어플 설치 및 실행 후 회원가입 및 로그인 진행 03. expo login 아래의 명령을 이용하여 로그인을 해준다. expo login // Username / Email Address : Eamil or ID 입력 // Pa..