본문 바로가기

바이브코딩 개념사전10

변수는 '값을 담는 이름표'다: let/const 쉬운 정리 목차1. 주제 소개2. 핵심 내용3. 적용 방법4. 정리5. 자주 묻는 질문1. 주제 소개JavaScript를 시작하면 가장 먼저 만나는 개념이 변수입니다. 변수는 어렵게 생각할 필요 없이 "값을 담아두는 이름표"입니다. 특히 요즘 문법에서는 let과 const를 구분해 쓰는 습관이 매우 중요합니다.2. 핵심 내용const: 바뀌지 않을 이름표const는 재할당이 불가능한 변수를 선언할 때 사용합니다. 값이 고정되어야 하는 설정값이나 참조값에 적합하며, 기본 선택지로 쓰기 좋습니다.let: 나중에 바뀔 수 있는 이름표let은 재할당이 가능한 변수를 선언할 때 씁니다. 카운트 값처럼 실행 중에 값이 변하는 데이터에 사용합니다.var는 왜 덜 쓰일까?var는 함수 스코프와 호이스팅 특성 때문에 예기치 않은 .. 2026. 5. 5.
클래스(class)와 아이디(id), 언제 뭐를 써야 할까? 목차1. 주제 소개2. 핵심 내용3. 적용 방법4. 정리5. 자주 묻는 질문1. 주제 소개HTML을 작성하다 보면 class와 id를 언제 써야 할지 헷갈립니다. 둘 다 요소를 식별하는 이름표이지만 쓰임새가 다릅니다. class는 여러 개를 묶는 공용 이름, id는 문서 안에서 단 하나만 갖는 고유 이름이라고 기억하면 쉽습니다.2. 핵심 내용class: 반복되는 스타일과 그룹에 적합여러 카드, 버튼, 배지처럼 같은 디자인을 공유하는 요소들에는 class를 사용합니다. 한 요소에 class를 여러 개 붙일 수 있어 재사용성과 조합이 좋습니다.id: 한 페이지에서 유일한 대상에 사용헤더, 특정 섹션 앵커, 고유한 입력 필드처럼 "딱 하나"를 정확히 지목해야 할 때 id를 씁니다. 같은 id를 여러 요소에 중.. 2026. 5. 4.
태그(Tag)와 요소(Element)의 차이, 딱 이것만 알기 목차1. 주제 소개2. 핵심 내용3. 적용 방법4. 정리5. 자주 묻는 질문1. 주제 소개HTML을 배우다 보면 "태그랑 요소가 같은 말 아닌가요?"라는 질문이 자주 나옵니다. 비슷해 보여도 정확히는 다릅니다. 태그는 문법 기호이고, 요소는 그 태그가 만들어내는 실제 단위라고 이해하면 됩니다.2. 핵심 내용태그(Tag)는 꺾쇠 괄호로 된 표시예를 들어 , , 같은 기호 자체를 태그라고 부릅니다. 시작 태그와 종료 태그가 짝을 이루는 경우가 많고, 일부는 단독 태그 형태로도 사용됩니다.요소(Element)는 의미 있는 완성 단위안녕하세요 전체처럼 시작 태그, 내용, 종료 태그를 포함한 하나의 덩어리를 요소라고 합니다. 즉, 화면에 배치되는 "실제 구성 부품"이 요소입니다.왜 구분이 중요할까?오류를 찾을 .. 2026. 5. 3.
HTML, CSS, JavaScript는 각각 무슨 역할일까? 목차1. 주제 소개2. 핵심 내용3. 적용 방법4. 정리5. 자주 묻는 질문1. 주제 소개웹페이지를 처음 만들 때 가장 먼저 부딪히는 질문이 바로 "HTML, CSS, JavaScript는 뭐가 다르지?"입니다. 이 셋은 각각 다른 일을 맡는 팀처럼 움직입니다. HTML은 구조를 만들고, CSS는 모양을 꾸미고, JavaScript는 동작을 담당합니다.2. 핵심 내용HTML: 뼈대와 의미를 만든다HTML은 제목, 본문, 버튼, 이미지처럼 페이지의 구성요소를 배치하고 의미를 부여합니다. 예를 들어 은 큰 제목, 는 문단, 은 버튼임을 알려줍니다.CSS: 보이는 방식을 결정한다CSS는 색상, 글꼴, 여백, 정렬처럼 "어떻게 보일지"를 정합니다. 같은 HTML이라도 CSS를 바꾸면 전혀 다른 분위기의 사이트로.. 2026. 5. 2.