Component 3

React 컴포넌트 with 클래스

일반적으로 React 에서 컴포넌트를 만들때 에로우 함수를 사용하여 아래와 같이 구현을 하는데요. 클래스 형태로 컴포넌트를 사용하는 방법도 어렵지는 않습니다. const App = () => { return ( ) } 클래스는 class 라는 키워드와 함께 extends 를 사용하고 React.Component 를 하고 중괄호로 묶어주고 render 함수안에 구현을 하면 됩니다. 컴포넌트가 함수 형태 이든 클래스 형태이든 아직은 공부하는 중이라서 크게 차이는 모르겠지만 프로그래밍을 공부해오신 분들이라면 class 형태를 더 권장하실 수도 있을것 같습니다. class App extends React.Component { render() { return ( ) } }

props 예제 : React

PROPS 를 사용한 React 예제 : tag 에서 컴포넌트(component)로 값을 전달할때 사용됨 여기서는 incrementBy 값이 사용이 되어짐 props 라는 변수로 받았지만 aa 나 임의의 변수 이름으로 사용이 가능함. import React, {useState} from "react"; const MyButton = (props) => { const [currentCount, setCurrentCount] = useState(0); const handleClick = () => { setCurrentCount(currentCount+props.incrementBy); } return ( +{props.incrementBy} {currentCount} ) } export default My..

Angular + Node JS 시작하기

1. Angular 첫 시작 ng 는 Angular 의 약칭이며 명령어로 사용이 된다. 그리고 npm 은 Node Package Manager 의 약칭이며 이 또한 명령어로 사용이 된다. Angular 를 사용하려면 우선은 Angular CLI (Command Line Interface)가 설치되어야 한다. https://cli.angular.io/ 주소로 들어가게 아래와 같은 화면이 나온다. 위의 이미지와 같이 angular 를 설치하기 위해서는 npm 명령어를 사용하여 설치를 하게 된다. 그런데 npm 은 서두에 언급한것과 같이 Node Package Manager 명령어 이므로 Node JS (노드JS)를 설치를 해야한다. Node JS 를 설치하기 위해서는 https://nodejs.org/en/..