Component 4

Chapter 01: Taste "React" - JSX, Babel, Multi Elements, Re-rendering, Event Handling, Component State, Hook and Ref

The goals 💪🏻What & Why? ✌🏻Basic knowledge of React 👍🏻Try React! DOM (Document Object Model) 메모리에 웹페이지 문서구조 표현->DOM으로부터 element개념이 등장 CDN (Content Delivery Network) 웹에서 사용되는 다양한 컨텐츠 (리소스)를 저장하여 제공하는 시스템 createElement를 이용해서 첫 인자로 "h1"을 주고 뒤에 props가 들어가는 부분에는 object로 각각 className과 children을 할당하고 또 "Hello, world!" 라는 값을 할당했는데 결과를 보면 태그 안에 class로 "title"이 들어가있고 children으로 "Hello world"할당. 과연 우리가 임의로 ..

React - From A To Z 2022.11.16

Section 08: Time to Practice - Time to apply what we learned thus far

The goals 💪🏻Let's Practice What We've Learned! event.preventDefault() The preventDefault() method cancels the event if it is cancelable, meaning that the default action that belongs to the event will not occur. For example, this can be useful when: Clicking on a "Submit" button, prevent it from submitting a form Clicking on a link, prevent the link from following the URL Note: Not all events are..

Section 04: User Interaction & State - Making Apps Interactive & Reactive

The goals 💪🏻Handling Events ✌🏻Updating the UI & Working with "State" 👍🏻A Closer Look At Components & States Define function first, and then connect it to the button to make a use of it! How React works? React reads all file first and renders. Sometimes we would like to change the looking of page wtih triggering action but React once it renders, doesn't read the file again to change. So in this c..

Section 03: Component - Driven User Interfaces - Building Interactive & Scalable UIs

The goals 💪🏻React Core Syntax & JSX ✌🏻Working with Components 👍🏻Working with Data What Are Components? And Why Is React All About Them? React is a JavaScript library for building user interfaces HTML, CSS & JavaScript are about building user interfaces as well React makes building complex, interactive and reactive user interfaces simpler React is all about "Components" -Because all user interfac..