[암호화폐] React 공부 중
아직 가야할 길이 많이 남아있지만, 그래도 조금씩 이해가 되고 있으니 신이남니다.
어제 올린 표 보고 질려있었는데, @happyberrysboy님이 추천해주신 아래 영상을 보니,,, 할만 하다는 자신감이 뿜뿜하고 있습니다.
https://nomadcoders.co/react-for-beginners/lectures/3257
가끔씩 유튜브 영상보면서 지나쳤던 분인데, 이렇게 끝까지 시청을 하게되네요.
자바스크립트 과감하게 스킵하고 React 영상부터 보고 있는데요. 위 영상을 보면 자바스크립트 간단하게 설명하고 이를 React로 수정했을 때 얼마나 개발자 친화적인 비교 설명해줍니다. C/C++에 익수한 저로써는 아직도 낯선 코딩 형태이지만 그나마 Babel로 코드를 보니 이해가 됩니다.
<!DOCTYPE <!DOCTYPE html>
<html>
<body>
<div id="root"></div>
</body>
<script src="https://unpkg.com/[email protected]/umd/react.production.min.js"></script>
<script src="https://unpkg.com/[email protected]/umd/react-dom.production.min.js"></script>
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
<script type="text/babel">
const root = document.getElementById("root");
let counter = 0
function counterUp() {
counter = counter + 1
render()
}
function render() {
ReactDOM.render(<Container/>, root)
}
const Container = () => (
<div>
<h3> Total Clicks: {counter}</h3>
<button onClick={counterUp}> Click me </button>
</div>
);
render()
</script>
</html>
동작하는 모습은 아래와 같습니다. 버튼 click하면 숫자가 1씩 증가합니다.
간단한 프로그램이지만 많은 의미가 함축되어 있다고 생각이 듭니다.
남은 과정 빨리 이해한 후 간단한 웹 페이지 하나 만들어볼 예정입니다.
언제나 열심히 하시는군요 트아형님
멋지십니다~!!
@tradingideas transfered 15 KRWP to @krwp.burn. voting percent : 100.00%, voting power : 21.88%, steem power : 1908294.84, STU KRW : 1200.
@tradingideas staking status : 21190 KRWP
@tradingideas limit for KRWP voting service : 21.19 KRWP (rate : 0.001)
What you sent : 15 KRWP (Voting Percent over 100 %)
Refund balance : 9.907 KRWP [60836794 - c0c9ad7accdbab276022e0ba9bbeffb465a90206]
안뇽하쉽니꽈 니꼴라스 임미다