Machine_웅_Note

import { createStackNavigator } from 'react-navigation-stack'; import { createAppContainer, createSwitchNavigator } from 'react-navigation'; import { createDrawerNavigator } from 'react-navigation-drawer'; import login from './Login/login' import intro from './intro' // 로그인과 인트로 화면은, 스텍으로 const Loging_in_Index = createStackNavigator( { login: { screen: login } } ) const Intro_in_Index = createSt..

export default class App extends Component{ render(){ return( SomeText ); } } const styles = StyleSheet.create({ container:{ marginLeft:20, marginTop:20 }, message:{ fontSize:18 }, warning:{ color:'red' } }) Text의 스타일을 배열을 열어서, 여러가지 StyleSheet를 적용 하였다. 만약에, 동일한 설정을 배열에 담게되면, 마지막으로 들어간 설정이 적용 된다.

/** * @format */ import React from 'react' import {AppRegistry} from 'react-native'; //import App from './app/App'; import App from './app/test'; import {name as appName} from './app.json'; const TodoApp =()=> AppRegistry.registerComponent(appName, () => TodoApp); AppRegistry.registerComponent(appName, () => TodoApp); 의 두번째 인수에서 앱의 진입점을 변경한다.

1. 컴포넌스 생성부터 완료의 호출 순서를 보면 constructor ➡️ componetWillMount(depricated) ➡️ render ➡️ componetDidMount 2.prop변화가 있을 경우 호출 순서를 보면 componentWillReceiveProps(depricated) ➡️ shouldComponetUpdate (false 시 업데이트 취소) ➡️ componetWillUpdate(depricated) ➡️ render ➡️ componetDidUpdate 3.state변화가 있으면.. shouldComponetUpdate (false 시 업데이트 취소) ➡️ componetWillUpdate(depricated) ➡️ render ➡️ componetDidUpdate 4.컴포..

특징 1) props는 부모 컴포넌트로 부터 전달된 속성 값이나, 상속 받은 값이다. 2) 컴포넌트에 상속이 되고나면 props 값은 변경이 불가능 하다. 1. 정적 props // 부모 export default class App extends Component{ render(){ return( // 자식에게 props 로 값 전달. ); } } // page 74 // 자식 class BookDisplay extends Component{ render(){ return( //부모로 부터 전달 받은 값은 자식 컴포넌트에서 this.props.이름 으로 사용 할 수 있다. {this.props.book} {this.props.note} ) } } 2. 동적 props : 외부를 통해서 변하는 속성 // ..

export default class App extends Component{ render(){ return( ); } } // stateless 컴포넌트 ( 기본적으로 유지하는게 없는 순수한 함수 상태) function test(testValue){ return 테스트1 } // 또는 const test_2 = () =>{ 테스트1 의 다른 방식 } /* alt + shift + a function test2(){ return This is English } */ // stateful 컴포넌트 ( 고유한 상태를 유지하는 컴포넌트 ) class Car extends Component { render() { return This is car; } } 사용예시 export default class App e..

react-native로 앱을 개발하기 위해서는 Nodejs, Python, Android studio등을 설치해야 합니다. 각 단계를 하나씩 하나씩 자세히 살펴 보도록 하겠습니다. Chocolatey 설치 Chocolatey는 윈도우(Windows)에서 필요한 패키지를 설치하고 관리하는 윈도우(Windows)용 패키지 관리자입니다. Chocolatey를 사용하면 윈도우(Windows)에서 간단하게 필요한 패키지를 설치할 수 있습니다. Chocolatey: https://chocolatey.org/ Chocolatey를 설치하기 위해서, 명령 프롬프트(cmd)를 관리자 권한으로 실행하고, 아래에 명령어를 실행합니다. @"%SystemRoot%\System32\WindowsPowerShell\v1.0\po..

Props란? properties의 약어이며, 컴포넌트가 생성될 때, 매개변수로 props가 전달된다. 이렇게 받아온 데이터를 사용하는 것을 말한다. 변동되지 않는 데이터를 다룰 때 사용한다. 부모에 의해 설정되며, 컴포넌트가 살아있는 동안만 유지된다. state와 다르게 props 는 컴포넌트 내에서 갱신되지 않는다. State란? state는 컴포넌트가 다루는 값들의 집합체, 리액트에서는 UI를 state를 다루는 기계장치로 보면된다. setState함수를 사용해 state를 변경하게 되면, 리액트는 컴포넌트를 다시 랜더링 하게 된다. 만약에 자식 컴포넌트가 props에 부모의 state를 받아서 사용하게 된다면, 부모 컴포넌트의 state 값이 변경되면 자식 컴포넌트도 다시 렌더링 된다. 데이터를 ..

컴포넌트란? 컴포넌트는 프로그래밍의 한 부분을 의미하며 재사용이 가능한 최소 단위를 말한다. 그래서 객체지향언어를 사용할 때 자주 사용되며 재사용이 가능하기 때문에 컴포넌트 단위로 분류하거나 이동 가능하다는 특징이 있다. 이는 모듈(Module)과 혼동될 수 있는데 모듈은 특정 기능을 온전히 수행할 수 있도록 만들어 졌다면 그 모듈 내에서도 재사용이 가능한 단위가 컴포넌트라 할 수 있다.