나디아 성장 일기

Rocks!   - HTML: Hypertext Markup Language | MDN" data-og-description="HTML 요소는 페이지의 스크립트 유형을 지원하지 않거나, 브라우저가 스크립트를 비활성화한 경우 보여줄 HTML 구획을 정의합니다." data-og-host="developer.mozilla.org" data-og-source-url="https://developer.mozilla.org/ko/docs/Web/HTML/Element/noscript" data-og-url="https://developer.mozilla.org/ko/docs/Web/HTML/Element/noscript" data-og-image="https://scrap.kakaocdn.net/dn/bojftm..

📌 React : React 애플리케이션을 정의하고 구성하는 데 필요한 주요 기능과 API를 제공 React  컴포넌트 정의 React 의 핵심 기능(상태 관리, 생명주기 메서드 및 Context API) 제공 JSX와 컴포넌트의 선언 처리    📌 React DOM : React 애플리케이션을 실제 DOM에 렌더링하는 데 필요한 기능을 제공 브라우저의 DOM과 상호작용을 담당 DOM에 변경 사항을 적용      ✅ React.createElement() : React 요소 생성 createElement(type, props, ...children)- type: 생성할 요소의 타입(HTML 태그 이름, 컴포넌트 등)- props: 요소에 대한 속성(properties) - children: 요소의..

📌 DOM(실제 문서 객체 모델) : HTML 코드를 웹 브라우저가 해석해서 생성한 객체 모델 🟰 HTML markup 상속되는 조상이 많아서 복잡하다. 👉 유지보수 비용 많이 듬// 부모(상위) 요소const figureElement = document.createElement('figure');// 자식(하위) 요소const figcaptionElement = document.createElement('figcaption');// 요소 간 관계 형성figureElement.append(figcaptionElement);// figure 객체의 children에 figcation이 생김console.dir(figureElement); // figure 객체// 렌더링const actualDomEl..

console.log(): 메시지와 변수의 값을 콘솔에 출력let user = 'Alice';console.log('Hello,', user); // 출력: Hello, Alice   console.clear(): 콘솔의 내용을 지움console.log('This will be cleared');console.clear(); // 콘솔이 비워집니다.console.log('Console has been cleared');   console.assert(condition, message) : 조건이 false일 때만 메시지를 출력 반드시 === 이후의 값을 반환하지 않으면 에러 뜨도록 테스트= TDD (Test Driven Development)console.assert(rem('25px') === '1...

✅ JavaScript 파일 (.js) : JavaScript 파일의 표준 확장자 웹 브라우저 또는 Node.js 환경에서 실행될 수 있다. commonjs와 ecmascript 모듈 시스템 모두를 사용할 수 있다.  ✅ CommonJS 모듈 파일 (.cjs): CommonJS 모듈 시스템을 사용하는 자바스크립트 파일의 확장자 모듈을 require() 함수로 가져오고, module.exports 또는 exports로 내보낸다. 웹 브라우저 환경에서는 기본적으로 지원되지 않으며, 브라우저에서는 Webpack, Browserify 같은 도구를 통해 변환해야 한다. 1.  type="commonjs" + 확장자 js { "type": "commonjs",}  const liveServer = requir..