본문 바로가기

interactive service/Web8

js로 react 프로젝트 실행하기 react 프로젝트인 경우, react 경로에서 [npm install] 명령어를 실행한다. 같은 경로에서 [npm start] 명령어로 react 서버를 구동한다. react, node 프로젝트의 경우, react와 node 경로에서 각각 [npm install] 명령어를 실행한 후 [yarn dev] 명령어로 react, node 서버를 동시에 구동한다. react, node 폴더 경로에는 각각 package.json 파일이 있는데, 프로젝트에서 사용하는 npm 패키지 리스트가 작성돼 있다. [npm install] 또는 [yarn install]을 실행하면 package.json 파일에 있는 패키지 리스트가 설치된다. create-react-app 템플릿으로 프로젝트를 생성하면, App.js의 ht.. 2022. 11. 7.
07. 코어 자바스크립트_클래스 자바스크립트는 프로토타입 기반 언어라서 클래스 및 상속 개념은 존재하지 않지만 프로토타입을 기반으로 클래스와 비슷하게 동작하게끔 하는 다양한 기법들이 도입돼 왔다. 클래스는 어떤 사물의 공통 속성을 모아 정의한 추상적인 개념이고, 인스턴스는 클래스의 속성을 지니는 구체적인 사례이다. 상위 클래스(superclass)의 조건을 충족하면서 더욱 구체적인 조건이 추가된 것을 하위 클래스(subclass)라고 한다. 클래스의 prototype 내부에 정의된 메서드를 프로토타입 메서드라고 하며, 이들은 인스턴스가 마치 자신의 것처럼 호출할 수 있다. 클래스 상속을 흉내 낼 수 있는 방법은 다음과 같다. 첫째, subClass, prototype에 SuperClass의 인스턴스를 할당한 다음 프로퍼티를 모두 삭제하.. 2022. 1. 4.
06. 코어자바스크립트_프로토타입 어떤 생성자 함수를 new 연산자와 함께 호출하면 Constructor에서 정의된 내용을 바탕으로 새로운 인스턴스가 생성되는데, 이 인스턴스에는 __proto__라는, Constructor의 prototype 프로퍼티를 참조하는 프로퍼티가 자동으로 부여된다. __proto__는 생략 가능한 속성이라서, 인스턴스는 Constructor.prototype의 메서드를 마치 자신의 메서드인 것처럼 호출할 수 있다. Constructor.prototype에는 constructor라는 프로퍼티가 잇는데, 이는 다시 생성자 함수 자신을 가리킨다. 이 프로퍼티는 인스턴스가 자신의 생성자 함수가 무엇인지를 알고자 할 때 필요한 수단이다. 직각삼각형의 대각선 방향, 즉 __proto__방향을 게속 찾아가면 최종적으로는 O.. 2022. 1. 4.
05. 코어 자바스크립트_클로저 클로저란 어떤 함수에서 선언한 변수를 참조하는 내부함수를 외부로 전달할 경우, 함수의 실행 컨텍스트가 종료된 후에도 해당 변수가 사라지지 않는 현상이다. 내부함수를 외부로 전달하는 방법에는 함수를 return하는 경우뿐 아니라 콜백으로 전달하는 경우도 포함된다. 클로저는 그 본질이 메모리를 계속 차지하는 개념이므로 더는 사용하지 않게 된 클로저에 대해서는 메모리를 차지하지 않도록 관리해줄 필요가 있다. 2022. 1. 4.