728x90 반응형 SMALL 분류 전체보기136 Semantic HTML의 필요성 시멘틱 태그(Semantic Tag)는 사람이 이해하기 쉽도록 태그의 이름만 보고도 역할이나 위치를 알 수 있도록(=의미가 통하는, semantic) 만든 태그들이다. Semantic HTML Semantic HTML은 웹 페이지의 구조와 의미를 더 명확하게 표현하는 데 도움이 되는 HTML 마크업 방식이다. 이를 사용하면 웹 페이지가 보다 이해하기 쉽고, 접근성이 향상되며, 검색 엔진 최적화(SEO)에도 도움이 된다. ex) 웹 페이지의 제목 This is a top level heading // Non Semantic This is a top level heading // Semantic 제목은 웹페이지에서 가장 중요한 역할을 한다. Semantic HTML을 사용하지 않고, 제목을 단순히 스타일링하.. 2023. 4. 6. React의 state와 props React는 상태(state)와 속성(props)이라는 두 가지 개념을 중심으로 구성된 JavaScript 라이브러리다. props 와 state 는 React 에서 데이터를 다룰 때 사용하는 개념이다. State(상태) React 컴포넌트에서 state는 컴포넌트 내부에서 관리되는 값으로서 변경 가능하다. 이 값은 컴포넌트가 렌더링되는 동안 변할 수 있으며, 변경될 때마다 컴포넌트가 다시 렌더링된다. 즉, React에서 state는 컴포넌트 내에서 관리되는 상태 데이터이며, 컴포넌트 내부에서 변경할 수 있고, 컴포넌트의 렌더링 결과를 결정한다. State 사용 방법 1. State 초기화하기 import React, { Component } from 'react'; class Counter extend.. 2023. 4. 5. 순수 함수 (feat. 불변성, 사이드 이펙트) 함수형 프로그래밍 Funtional Programming은 순수함수를 중심으로 Side-Effect가 없도록 프로그래밍을 하는 것을 말한다. 순수함수 (Pure Function) input : 어떠한 함수에서 외부의 데이터를 직접적으로 사용하지 않고, 파라미터로 받는다. output : input값에 의해 output이 결정되기 때문에 외부의 값들이 변경되더라도 함수 자체에는 외부에 영향을 받지 않기 때문에 Side-Effect가 없다. 순수 함수는 동일한 입력에 대해 항상 동일한 출력을 반환하며, 외부 상태를 변경하지 않는 함수를 말한다. 즉, 함수 내부에서 어떤 값이 변경되지 않으며, 외부에서 관찰 가능한 상태에도 영향을 주지 않는 함수다. ex) 더하기 함수 function add(x, y) { r.. 2023. 4. 5. Cookie의 MaxAge, Expires 옵션 Session cookies - 웹브라우저가 켜져있는 동안 유효하고 끄고 다시 켜면 없어짐 → MaxAge와 Expires 옵션 중 하나라도 설정하지 않을 때 Permanent cookie - 웹브라우저를 껐다 켜도 유지됨 Permanent cookie 기간 설정할 때 쓰이는 옵션이 바로 MaxAge와 Expires 이다. MaxAge와 Expires 옵션은 둘 다 쿠키의 수명을 결정하는 데 사용된다. MaxAge 쿠키가 유지되는 시간(초)을 정의한다. 이 값은 현재 시간에서 더해져서 쿠키의 만료 시간이 계산된다. 예를 들어, MaxAge가 3600으로 설정되어 있으면, 쿠키는 1시간 동안 유지된다. Expires 쿠키가 만료되는 날짜와 시간을 정의한다. 이 값은 HTTP Date 형식의 문자열로 설정된.. 2023. 4. 4. const - 요소나 속성을 추가할 수 있는 이유 const란? const 선언은 블록 범위의 상수를 선언한다. 상수의 값은 재할당할 수 없으며 다시 선언할 수도 없다. 즉, const로 선언된 배열이나 객체의 경우, 해당 변수를 다른 값으로 재할당하는 것이 불가능하다. 또 다른 말로는, const로 선언된 변수에 다른 값을 할당하려고 하면 에러가 발생한다는 것이다. 하지만, 배열이나 객체의 요소나 속성에 대한 수정은 가능하다. 배열, 객체를 const로 선언했는데 요소나 속성을 추가할 수 있는 이유 const가 변수 자체를 불변으로 만드는 것이 아니라 변수가 참조하는 값의 변경을 막는 것이기 때문이다. 배열이나 객체는 참조 타입이고, const로 선언된 변수가 참조하는 메모리 공간 자체는 변경되지 않는다. 따라서 변수가 참조하는 배열이나 객체의 요소나.. 2023. 4. 3. require vs import 모듈 시스템 4가지 CommonJS (이하 CJS) – NodeJS 환경을 위해 만들어진 모듈 시스템 ES Module (이하 ESM) – ES6 에 도입된 자바스크립트 모듈 시스템 AMD – 가장 오래된 모듈 시스템, require.js 라이브러리를 통해 개발됨 UMD – AMD와 CommonJS 등 모듈 시스템을 함께 사용하기 위해 개발됨 모듈 내보내기, 불러오기 CJS : require, module.exports, exports ESM : import, export, export default CommonJS 문법 require : 가져오기 exports : 내보내기 module.exports : 내보내기 require 특징 NodeJS 에서 사용하고 있는 CommonJS 모듈 키워드 루비 언어 .. 2023. 4. 3. 이전 1 2 3 4 5 ··· 23 다음 728x90 반응형 LIST