📖 책 찢기22 [모던 리액트 Deep Dive] 6장. 리액트 개발 도구로 디버깅하기 https://github.com/Study-FE-Techbook/Modern-React-Deep-Dive GitHub - Study-FE-Techbook/Modern-React-Deep-Dive: 모던 리액트 딥다이브 스터디모던 리액트 딥다이브 스터디. Contribute to Study-FE-Techbook/Modern-React-Deep-Dive development by creating an account on GitHub.github.com[6장] 리액트 개발 도구로 디버깅하기6.1 리액트 개발 도구란?React Dev Tools리액트로 만들어진 다양한 애플리케이션을 디버깅하기 위해 만들어졌으며, 리액트 웹 뿐만 아니라 리액트 네이티브 등 다양한 플랫폼에서 사용할 수 있다.6.2 리액트 개발 도.. 2024. 7. 16. [모던 리액트 Deep Dive] 5장. 리액트와 상태 관리 라이브러리 https://github.com/Study-FE-Techbook/Modern-React-Deep-Dive GitHub - Study-FE-Techbook/Modern-React-Deep-Dive: 모던 리액트 딥다이브 스터디모던 리액트 딥다이브 스터디. Contribute to Study-FE-Techbook/Modern-React-Deep-Dive development by creating an account on GitHub.github.com [5장] 리액트와 상태 관리 라이브러리5.1 상태관리는 왜 필요한가?📍웹 애플리케이션에서 상태로 분류될 수 있는 것들UI: ex) 다크/라이트 모드, input요소, 알림창 노출 여부URL: 사용자 라우팅에 따른 동적 주소폼: 로딩 중인지, 현재 제출됐는지.. 2024. 7. 13. [모던 리액트 Deep Dive] 4장. 서버 사이드 렌더링 https://github.com/Study-FE-Techbook/Modern-React-Deep-Dive GitHub - Study-FE-Techbook/Modern-React-Deep-Dive: 모던 리액트 딥다이브 스터디모던 리액트 딥다이브 스터디. Contribute to Study-FE-Techbook/Modern-React-Deep-Dive development by creating an account on GitHub.github.com [4장] 서버 사이드 렌더링4.1 서버 사이트 렌더링이란?✨싱글 페이지 애플리케이션의 세상📍싱글페이지 애플리케이션이란렌더링과 라우팅에 필요한 대부분의 기능을 브라우저의 자바스크립트에 의존하는 방식최초에 첫 페이지에서 데이터를 모두 불러온 이후에는 페이지 전.. 2024. 7. 10. [모던 리액트 Deep Dive] 3장. 리액트 훅 깊게 살펴보기 https://bori-note.tistory.com/32https://bori-note.tistory.com/32https://github.com/Study-FE-Techbook/Modern-React-Deep-Dive GitHub - Study-FE-Techbook/Modern-React-Deep-Dive: 모던 리액트 딥다이브 스터디모던 리액트 딥다이브 스터디. Contribute to Study-FE-Techbook/Modern-React-Deep-Dive development by creating an account on GitHub.github.com [3장] 리액트 훅 깊게 살펴보기3.1 리액트의 모든 훅 파헤치기훅은 클래스 컴포넌트에서만 가능했던 리액트의 핵심 기능을 함수에서도 가능하게 .. 2024. 7. 2. [모던 리액트 Deep Dive] 2장. 리액트 핵심 요소 깊게 살펴보기 https://github.com/Study-FE-Techbook/Modern-React-Deep-Dive GitHub - Study-FE-Techbook/Modern-React-Deep-Dive: 모던 리액트 딥다이브 스터디모던 리액트 딥다이브 스터디. Contribute to Study-FE-Techbook/Modern-React-Deep-Dive development by creating an account on GitHub.github.com [2장] 리액트 핵심 요소 깊게 살펴보기2.1 JSX란?XML과 유사한 내장형 구문이며, 리액트에 종속적이지 않은 독자적인 문법자바스크립트 코드 내부에 HTML과 같은 트리 구조를 가진 컴포넌트를 표현할 수 있다.render() { return ( .. 2024. 6. 29. [모던 리액트 Deep Dive] 1장. 리액트 개발을 위해 꼭 알아야 할 자바스크립트 https://github.com/Study-FE-Techbook/Modern-React-Deep-Dive GitHub - Study-FE-Techbook/Modern-React-Deep-Dive: 모던 리액트 딥다이브 스터디모던 리액트 딥다이브 스터디. Contribute to Study-FE-Techbook/Modern-React-Deep-Dive development by creating an account on GitHub.github.com 리액트 책 속으로 들어가며…🥹리액트 왜 씀?왜 리액트가 지난 몇 년간 많은 개발자들이 선호하는 라이브러리가 됐을까?단방향 바인딩만약 양방향으로 바인딩되면 뷰의 변화가 컴포넌트에 영향을 미칠 수도, 반대로 컴포넌트의 상태가 변경되면 뷰의 상태도 변할 수 있다.. 2024. 6. 27. [코어자바스크립트] 7장. 클래스 [7장] 클래스1. 클래스와 인스턴스의 개념 이해상위클래스 - superclass하위클래스 - subclass2. 자바스크립트의 클래스생성자 함수 Array를 new 연산자와 호출하면 인스턴스가 생된다.이때 Array를 일종의 클래스라고 하면, Array의 prototype 객체 내부 요소들이 인스턴스에 상속된다고 볼 수 있다.인스턴스에 상속되는지(인스턴스가 참조하는지) 여부에 따라 스태틱 멤버와 인스턴스 멤버로 나뉜다.// 생성자 함수var Rectangle = function (width, height) { this.width = width this.height = height}// 프로토타입 메서드 정의Rectangle.prototype.getArea = function () { return .. 2024. 6. 18. [코어자바스크립트] 6장. 프로토타입 [6장] 프로토타입자바스크립트는 프로토타입 기반 언어클래스 기반 언어에서는 상속을 사용하지만 프로토타입 기반 언어에서는 어떤 객체를 원형으로 삼고 이를 복제함으로써 상속과 비슷한 효과를 얻는다.❓원형(prototype) 모든 객체는 다른 객체로부터 직접적으로 생성된다. 이 때 생성된 객체는 원본이 되는 객체를 원형이라고 부른다.1. 프로토타입의 개념 이해어떤 생성자 함수를 new 연산자와 함께 호출하면constructor에서 정의된 내용을 바탕으로 새로운 인스턴스가 생성된다.이때 instance에는 __proto__ 라는 프로퍼티가 자동으로 부여되는데이 프로퍼티는 constructor의 prototype이라는 프로퍼티를 참조한다.var suzi = new Person('Suzi')suzi.__proto_.. 2024. 6. 18. [코어자바스크립트] 5장. 클로저 [5장] 클로저1. 클로저의 의미 및 원리 이해클로저함수와 그 함수가 선언될 당시의 lexical envrionment의 상호관계에 따른 현상어떤 함수에서 선언한 변수를 참조하는 내부함수에서만 발생하는 현상→ 어떤 함수 A에서 선언한 변수 a를 참조하는 내부함수 B를 외부로 전달할 경우 A의 실행 컨텍스트가 종료된 이후에도 변수 a가 사라지지 않는 현상var outer = function () { var a = 1 var inner = function () { console.log(++a) } return inner}var outer2 = outer()console.log(outer2()) // 2console.log(outer2()) // 3inner 함수의 실행 결과가 아닌 inner함수.. 2024. 6. 17. 이전 1 2 3 다음 반응형