| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | 2 | |||||
| 3 | 4 | 5 | 6 | 7 | 8 | 9 |
| 10 | 11 | 12 | 13 | 14 | 15 | 16 |
| 17 | 18 | 19 | 20 | 21 | 22 | 23 |
| 24 | 25 | 26 | 27 | 28 | 29 | 30 |
| 31 |
- DP
- BinaryTree
- Context
- 비트연산
- leetcode
- array
- JSX
- c++
- nodeJS
- MySQL
- priority_queue
- routes
- Navigation
- state
- bit
- event
- Callback
- map
- server
- queue
- treenode
- count
- component
- UE5
- axios
- node.js
- React
- css
- route
- Props
- Today
- Total
목록component (2)
우사미 코딩
[React] 관리자모드에서 component 확인하기 (ft. 크롬 확장 프로그램)
1. 크롬에서 React Developer Tools 확장프로그램을 설치한다 https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi/related React Developer Tools Adds React debugging tools to the Chrome Developer Tools. Created from revision 2468a8735 on 5/19/2023. chrome.google.com 2. 열어두었던 페이지를 새로고침하고 관리자 도구를 켠다 화살표누르고 components 클릭한다 3. 현재 페이지의 components와 props를 확인할 수 있다 끝
1. 태그를 컴포넌트화(부품화)하여 코드 재사용율을 높이고, 코드 수정이 쉽게 한다. 전 직장에서 소프트웨어 개발할 때 모든 ui를 부품화하여 개발했는데 그거랑 비슷한 개념임. 굿! 버튼에 클릭 이벤트를 넣는다던가 별도의 함수를 호출한다? 그럼 해당 컴포넌트에 함수를 작성하면 됨. 굿! 2. 웹에서 ui를 실시간으로 고치는 작업은 비용이 크다고 한다. 그런데 react를 사용하면 ui를 새로 그리는 비용이 줄어든다고 함. 3. jsx function App() { return ( Hello ); } React에서 위와 같이 html코드를 return하는 스타일을 jsx라고 하고 파일명도 .jsx로 되어있다. 4. component import React from "react" import TodoItem..