오블완23 (react) yarn이란? Yarn이란?Yarn은 JavaScript 프로젝트에서 패키지(모듈)를 관리하는 도구로써 npm과 비슷한 기능을 제공하지만, 더 빠르고 안정적인 패키지 설치를 보장하며, 몇 가지 추가적인 기능을 통해 개발자의 편의성을 높여줌. Yarn의 주요 특징병렬 다운로드와 캐싱 기능을 통해 npm보다 훨씬 빠른 설치 속도yarn.lock 파일을 통해 정확한 패키지 버전을 관리하여, 다양한 개발 환경에서도 동일한 결과한 번 설치한 패키지는 캐시에 저장되어 오프라인 상태에서도 설치가 가능다양한 플러그인을 통해 Yarn의 기능 확장 예시# 특정 패키지 설치yarn add react# 프로젝트 초기화yarn init -y# package.json 파일 생성 및 의존성 관리# package.json 파일은 프로젝트에 필.. 2024. 11. 10. (react) NPM이란? npm이란?npm은 Node Package Manager의 약자로, Node.js로 개발된 모듈(패키지)을 관리하는 도구로써 마치 레고 블록을 조립하듯, 이미 만들어진 다양한 기능들을 모아 나만의 프로젝트를 빠르게 구축할 수 있도록 돕는 역할 npm이 하는 일패키지 설치: npmjs.com에 있는 수많은 패키지를 프로젝트에 설치패키지 관리: 설치된 패키지의 버전을 관리하고, 필요에 따라 업데이트 또는 삭제의존성 관리: 여러 패키지 간의 의존 관계를 자동으로 관리하여, 프로젝트가 정상적으로 동작하도록 해줌패키지 공유: 자신이 만든 패키지를 npmjs.com에 공개하여 다른 개발자들과 공유 가능 장점빠른 개발: 이미 만들어진 패키지를 활용하여 개발 시간을 단축코드 재사용: 다른 개발자가 만든 코드를 활용하.. 2024. 11. 9. [react] 바벨(Babel)이란? JSX란 React 스크립트 안에서 일반적인 HTML의 형태의 문법을 사용할 수 있도록 자바스크립트를 확장한 문법인데, JSX는 JavaScript 코드가 아니기 때문에 JSX를 브라우저가 이해할 수 있는 JavaScript로 컴파일해주어야 함. 이때 Babel이 사용됨. Babel이란? Babel은 자바스크립트 코드를 변환해주는 도구로 최신 자바스크립트 문법으로 작성된 코드를 이전 버전의 브라우저에서도 실행될 수 있도록 변환해주는 트랜스파일러(transpiler). 왜 Babel이 필요할까?ES6(ECMAScript 2015) 이후로 자바스크립트는 매년 새로운 기능이 추가되고 있으나 모든 브라우저가 최신 자바스크립트 문법을 완벽하게 지원하는 것은 아니기 때문에, 최신 문법을 사용하여 개발된 코드를 모.. 2024. 11. 8. [react] jsx란? JSX란?JSX는 JavaScript XML의 약자로, 자바스크립트에 XML과 유사한 문법을 추가하여 UI를 더욱 직관적으로 작성할 수 있도록 해주는 확장 문법으로 주로 React와 같은 JavaScript 라이브러리에서 사용되며, HTML과 비슷한 문법으로 UI를 구성할 수 있다는 장점을 가짐. 왜 JSX를 사용할까?HTML과 유사한 문법으로 UI를 작성하기 때문에, 개발자가 UI를 쉽게 이해하고 작성JSX 안에 JavaScript 표현식을 직접 삽입하여 데이터를 동적으로 표현UI 요소를 독립적인 컴포넌트로 만들어 재사용성을 높여서 코드 관리 용이 JSX 특징은?JSX는 자바스크립트 표현식으로 결국 자바스크립트로 컴파일되어 실행JSX 안에서 중괄호({}) 안에 JavaScript 표현식을 삽입할 수 .. 2024. 11. 7. 21일동안 매일 글쓰면 선물을? 티스토리에서 3주동안 글을 매일 올리면, 아이폰16pro, 애플워치, 스마트모니터 M7 등 경품 혜택이 있다고 함. 매일 쓰지 못하더라도 오블완 일수에 따라 여러가지 경품 혜택이 있으니11월 7일부터 도전 고고? https://www.tistory.com/event/write-challenge-2024 작심삼주 오블완 챌린지오늘 블로그 완료! 21일 동안 매일 블로그에 글 쓰고 글력을 키워보세요.www.tistory.com 2024. 11. 4. 이전1 1 2 3 다음 728x90 반응형