What I Learned26 Learning React.js React Components Creating a React component A component lets you put together a user interface with independent reusable pieces. A component is a function that returns some UI. Always, always, always, components need to be capitalized. import React from 'react'; import ReactDOM from 'react-dom'; import './index.css'; function Hello() { return ( Hello React! ); } ReactDOM.render( , document.getEl.. 2021. 3. 8. Learning ECMScript 6+ (ES6+) 2. Variables and Data Structures 1) let keyword - let is helping us enforce block scoping in JavaScript. // Example 1(1) - var var topic = "JavaScript"; if (topic) { var topic = "ECMAScript"; console.log("block", topic); } console.log("global", topic); // expected "global ECMAScript" // Example 1(2) - let var topic = "JavaScript"; if (topic) { let topic = "ECMAScript"; console.log("block", topic.. 2021. 2. 25. React JS - State & Lifecycle Why use class components instead of function components? - To use "state" class App extends React.Component{ state = { } render(){ return } } React automatically execute the render method inside of the class component. A state is an object. The data can be change (dynamic data). The number is: {this.state.count} Add Minus If you write "this.add()", the method will be executed immediately, not wh.. 2021. 2. 24. React JS - JSX & Props function Food({ favorite }) { return I like {favorite}; } function App() { return ( Hello ); } JSX is something like HTML + JavaScript. In the example above, I made a JSX with Prop named "favorite" and put a value named "kimchi" The first example shows how to send value from one component to another. In this case, it is using prop favorite and the Food component is receiving the value using the .. 2021. 2. 23. 이전 1 2 3 4 ··· 7 다음