이것저것 다 개발

이전 글에서 React와 ReactDOM을 사용한 React 코드를 작성해보았습니다.http://yongyi1587.tistory.com/37 < React 기초 -React와 ReactDOM 라이브러리 React.createElement() 라는 API를 호출하여 HTML코드를 만들고 ReactDOM.render()를 호출하여 렌더링을 하였습니다. 이번 글에서는 JSX를 이용하여 element를 정의하는 법을 적어보려고 합니다.JSX는 javascript의 확장으로 HTML과 비슷한 구문을 이용해 react element를 정의할 수 있게 해줍니다. 먼저 JSX를 사용하기 위해서는 Babel이 필요합니다. 1. Babel 모든 브라우저는 ES6나 ES7을 지원하지 않으며 JSX를 지원하지 않습니다. 그..

React와 ReactDOM React를 사용하기 위해서는 먼저 React와 ReactDOM이라는 라이브러리가 필요합니다. React는 View를 만들기위한 라이브러리이고, ReactDOM은 UI를 실제로 브라우저에 렌더링 할 때 사용하는 라이브러리 입니다. CDN으로 React와 ReactDOM 라이브러리를 추가하겠습니다. https://reactjs.org/docs/cdn-links.html //여기에 react Element 추가 위처럼 간단한 html 코드를 작성하고 react와 reactDOM의 라이브러리를 추가하였습니다. 그리고 그 아래 script 태그가 react 코드를 작성할 공간입니다. react 코드를 작성해보겠습니다. React는 렌더링 과정에서 React.createElement로..

Javascript ES6 variable declaration Javascript ES6 이후로 let과 const 두가지 변수 선언 키워드가 생겼습니다. 이해하기 쉽게 var, let, const를 이용한 변수선언을 예제로 설명하겠습니다.1. Variable Declaration 1-1. var var c = 'c1' var c = 'c2' console.log(a) 위와 같이 c 라는 변수를 선언했을때 아무런 오류 없이 console에는 c2 가 찍힙니다. 1-2. let let c = 'c1' let c = 'c2' console.log(a) 하지만 let으로 변수를 선언하게 된다면 에러가 나게됩니다. 이처럼 let은 중복선언을 허용하지 않습니다. const도 마찬가지로 중복선언을 허용하지 않습니..

ConstraintLayoutConstraintLayout은 View 또는 View Group 간의 상대적인 위치 지정을 하여 View를 배치하는 Layout 입니다. 위 화면은 instagram의 화면을 따라서 만든 화면입니다. 화면을 보시면 각 View간 화살표로 연결되어 있는것을 볼 수 있습니다. Android Studio에서 Drag & Drop으로activity_**.xml Design 탭에서 이런 화면을 간단하게 만들 수 있습니다.안드로이드 layout의 xml을 다루지 못하는 사람도 누구나 쉽게 Layout을 배치하고 만들 수 있습니다.Text 탭으로 넘어가게 되면 코드가 작성되있는 것을 볼 수 있습니다.각 View 객체를 이루고있는 4개의 선에는 끌어당길 수 있는 점 4개가 존재합니다.4개..

1. Function정의 : 특정 기능을 하는 구문을 묶어 재사용 할 수 있는 함수function sum(a, b) {alert(a+b);return a+b // function 내부의 데이터를 외부로 보냄} 호출 : functionName(); 종류 : 1. 자바스크립트 코어 함수alert();document.write();등등.. 2. 사용자 정의 함수sum(); //위 예제 같이 사용자가 만들어준 function 2. Class정의 : 연관된 function과 variable을 묶을때 사용하는 문법 인스턴스 : new 라는 키워드를 사용하여 인스턴스를 만듬var calculator = new Calculator(); 호출 :1. 인스턴스 생성2. 접근 연산자(.) 를 사용하여 호출calculator..