시멘틱 버저닝 - package.json

시멘틱 버저닝이란? 시멘틱 버저닝(Semantic Versioning, SemVer)은 소프트웨어 버전을 체계적으로 관리하기 위한 규칙이다. 프로젝트의 업데이트 상태와 변경 사항을 명확하게 표현하여 사용자와 개발자에게 일관된 정보를 제공한다. 시멘틱 버저닝은 주로 X.Y.Z 형태로 표현되며 각 숫자는 다음과 같은 의미를 가진다. MAJOR.MINOR.PATCH 형식으로 버전을 구성되어 각 숫자의 의미가 정해져 있어 개발자가 의도한 변경 사항을 명확하게 전달할 수 있다. 아래 package.json 파일은 시멘틱 버저닝을 이해하기 좋은 예시이다.// Pakage.json 파일 일부"devDependencies": { "@eslint/js": "^9.9.0", "@types/react": "^18..

• format_list_bulleted .ect
• · 2024. 9. 13.
• textsms

[React] 리액트의 렌더링 구조

리액트 렌더링?React는 UI를 업데이트하고 유지하는 효율적인 방식을 제공하는 라이브러리이다. 렌더링은 React에서 컴포넌트의 상태(state) 또는 props가 변경될 때 UI를 업데이트하는 과정이다. React의 렌더링은 클래스형 컴포넌트와 함수형 컴포넌트에서 다르게 동작하여 각각 동작 원리를 알아보아야 한다. 최근에는 함수형 컴포넌트를 지향하고 있으며 공식 문서에서도 함수형 컴포넌트 방식을 권장한다. 렌더링 프로세스렌더링 촉발(Triggering a Render)컴포넌트 렌더링(Rendering the Component)DOM에 커밋(Committing to the DOM)리액트 공식 문서에서는 아래와 같은 비유로 설명하고 있다.렌더링 촉발: 손님의 주문을 주방으로 전달하는 단계입니다.컴포넌트 ..

• format_list_bulleted Frontend/React
• · 2024. 9. 13.
• textsms

[Node.js] NVM 설정을 통한 버전관리

NVM(Node Version Manager)란?NVM은 여러 버전의 Node.js를 쉽게 설치하고 프로젝트마다 다른 버전을 사용할 수 있게 해주는 도구이다. NVM을 사용하면 특정 프로젝트에서는 Node.js 14 버전을 다른 프로젝트에서는 16 버전을 사용하는 것이 가능하다.주요 기능다양한 Node.js 버전 설치 및 관리프로젝트마다 필요한 Node.js 버전 전환필요 없는 Node.js 버전 제거NVM 설치 방법macOS / Linux에서 설치macOS와 Linux에서는 터미널을 통해 간단히 NVM을 설치할 수 있다. NVM의 GitHub 공식 저장소에서 제공하는 명령어를 사용한다.# NVM 설치 스크립트 실행curl -o- https://raw.githubusercontent.com/nvm-sh/..

• format_list_bulleted Backend/Node.js
• · 2024. 9. 12.
• textsms

JS 스코프 개념

스코프(Scope)란?자바스크립트에서 스코프(Scope)는 코드에서 변수나 함수가 어디에서 유효하고 접근 가능한지를 결정하는 규칙이다.스코프는 코드 작성 시 변수의 가시성(Visibility)과 생명주기(Lifetime)를 결정하기 때문에 스코프를 명확히 이해하는 것이 자바스크립트 프로그래밍에서 필수적이다.자바스크립트에서 스코프는 크게 두 가지로 나눈다. 전역 스코프(Global Scope)와 지역 스코프(Local Scope) 그리고 더 구체적으로,함수 스코프와 블록 스코프라는 개념이 지역 스코프의 하위 유형이다. 또한, 자바스크립트는 렉시컬 스코프(Lexical Scope)라는 규칙을 따르는데 이 규칙은 함수나 변수가 어디에서 정의되었는지에 따라 접근 권한이 결정된다는 것을 의미한다. 렉시컬 스코프는..

• format_list_bulleted Frontend/JavaScript
• · 2024. 9. 11.
• textsms

JS Promise란?

자바스크립트 Promise?자바스크립트에서 비동기 작업을 처리할 때 유용하게 사용되는 것이 Promise 객체이다. Promise는 비동기 작업을 처리하고 이를 통해 비동기 코드를 쉽게 작성하고 관리할 수 있다. 또한 Promise 콜백 함수의 콜백 지옥 문제점을 부분적으로 해결할 수 있다.Promise는 미래에 완료될 작업을 나타내며 성공(resolve) 또는 실패(reject) 여부에 따라 각각 다른 처리를 할 수 있다. 기본적으로 Promise는 비동기 작업의 결과를 추상화하여 성공했을 때와 실패했을 때 각각의 처리를 간편하게 할 수 있도록 도와준다.Promise의 상태Pending(대기): 아직 작업이 완료되지 않은 상태Fulfilled(이행): 작업이 성공적으로 완료된 상태Rejected(거부)..

• format_list_bulleted Frontend/JavaScript
• · 2024. 9. 9.
• textsms

JS Calllback 함수란?

콜백 함수란?콜백 함수는 다른 함수에 인수로 전달되는 함수이다. 자바스크립트는 함수를 1급 객체(First-class object)로 취급하기 때문에 함수를 변수에 할당하거나 함수의 인수로 전달할 수 있다. 콜백 함수는 일반적으로 비동기 작업을 처리하기 위해 사용된다. 비동기 작업이 완료된 후 호출될 함수를 미리 전달해두고 작업이 끝났을 때 해당 함수가 실행되도록 만드는 방식이다. 콜백함수의 구분콜백함수는 주로 비동기 작업을 처리하기 위해 사용되지만 동기 작업에도 사용할 수 있다. 두 가지 방법의 예시를 통해 콜백 함수를 알아보자. 먼저 두 가지 방식에 대한 차이점을 간단하게 설명하면 동기적 콜백 함수는 코드가 순차적으로 실행된다. 콜백 함수가 완료되기 전까지 다음 코드로 넘어가지 않는다. 비동기적 콜백..

• format_list_bulleted Frontend/JavaScript
• · 2024. 9. 9.
• textsms