![]()
제목 : Yarn 과 pnpm 패키지 매니저는 무엇인가?이 글을 작성하는 이유방대한 JavaScript 기반의 패키지 레지스터를 보유하고 있는 장소가 바로 NPM 이다.JavaScript 는 언어 자체로 IO(Input Output) 빌트인 메서드가 간단하며,또한 표현식이 간단하여 프로그래머들의 진입 언어로 매우 유용하게 사용되고 있다.그런 만큼, 그 커뮤니티의 크기는 감히 말할 수 없을 정도로 커졌으며,언어 자체가 가지고 있던 성능의 한계를 다양한 내장 메서드 최적화,재사용 코드 캐싱 등의 기능으로 돌파하고 있다. (그래도 저레벨 언어에 비해서는 한계가 있지만.)npm 은 JavaScript 기반의 템플릿 프로젝트를 만들기 위해서 필수적인 요소이다.주로 프로젝트 루트에 package.json 을 생성하..
코드 이해하기먼저, src/ 내부의 모든 ts, tsx 파일은 맨 위에 디폴트로 import 해야하는 항목이 있습니다.import React from 'react';typescript 를 적용하기 위해서 필수로 입력해야 하는 문장입니다.먼저, yarn create react-app [생성한 프로젝트 이름] --template typescript로 생성한파일을 이해하기 위해 src/App.tsx 파일을 열어봅니다.import React from 'react';import logo from './logo.svg';import './App.css';function App() : JSX.Element { return ( Edit src/App.ts..
1장에 대한 요약1. React 서론컴퓨터의 성능이 매우 발전함에 따라 동적인 페이지 에 대한 필요도가 높아졌습니다.이에 FaceBook이 최대한 성능을 아끼고 동적인 웹을 보여줄 수 있는 "React" 라는 시스템을 개발했습니다.성능을 아끼는 방법은, 수많은 Component 에서 몇 개의 정보가 변경되었을 때, 모든 Component를 변경하는 것이 아니라, 변경 된 Component 만 변경하는 방식입니다.이 방식은 Virtual DOM을 사용하여 성능을 아낍니다.Virtual DOM : 변경된 Component를 가상의 환경에서 만든 후, 실제로 변경 된 DOM을 비교하여 반영하는 방식2. 작업 환경 설정 - 저는 "Mac"입니다.Node.js / npm, yarn 설치하기코드 에디터 - ..
