학습단 한 줄 요약 프로젝트 하면서 필요할 때만 찾아 쓰던 HTML/CSS/JS를, 이번에는 기초부터 다시 쌓으면서 머릿속 지식이 정돈되는 느낌을 확실히 받았어요. 기록까지 남기니까 나중에 다시 찾아보기 쉬운 내 레퍼런스가 생긴 것도 가장 큰 수확이었습니다. 참여 정보 시작하게 된 이유 저는 그동안 프로젝트를 하면서 필요한 부분만 검색해서 끼워 맞추는 방식이었어요. 동작은 하는데, 개념이 머릿속에서 정리되지 않아서 … 더 읽기
오늘 학습 정보 오늘의 핵심 키워드 3개 개념 정리 2-1) 프로젝트 기본 세팅(문서 뼈대/외부 리소스 연결) 역할: HTML 기본 문서 구조를 만들고(메타/타이틀), 아이콘 폰트(CDN)와 CSS 파일을 연결 핵심 포인트: lang, meta charset, viewport, link rel=”stylesheet” 흐름을 먼저 고정해두면 이후 작업이 안 정적 짧은 예시(코드): 2-2) 헤더 영역 만들기(로고 + 메뉴 배치) 역할: 상단 헤더에 로고/메뉴를 … 더 읽기
오늘 학습 정보 오늘의 핵심 키워드 3개 개념 정리 2-1) 폼 요소 값/상태 다루기 역할: 핵심 포인트 → 짧은 예시(코드) (1) 텍스트 입력 값 가져오기/설정하기 역할: input에 입력된 값을 읽거나 바꾸기 핵심 포인트: value 속성으로 접근/대입 짧은 예시(코드): (2) 체크박스/라디오 선택 상태 제어하기 역할: 체크/선택 상태 확인 및 기본 선택 지정 핵심 포인트: checked 속성으로 … 더 읽기
오늘 학습 정보 오늘의 핵심 키워드 3개 개념 정리 2-1) DOM(Document Object Model) 이해: “문서가 트리로 보인다” 역할: HTML 문서를 노드(Node)들의 트리 구조로 표현해서 JS로 접근/조작 가능하게 함 핵심 포인트: 짧은 예시(코드): 2-2) 요소 노드 선택: getElementById vs querySelector(All) 역할: DOM에서 “원하는 요소 노드”를 찾아 변수로 잡아두기 핵심 포인트: 짧은 예시(코드): 2-3) 콘텐츠 조작: textContent … 더 읽기
오늘 학습 정보 오늘의 핵심 키워드 3개 개념 정리 2-1) 표준 내장 객체 한 번에 잡기 역할: 자바스크립트에 “기본으로 내장된 객체”를 활용해 문자열/배열/날짜/수학 연산을 빠르게 처리 핵심 포인트: 짧은 예시(코드): 2-2) String 객체: “문자열 다루는 기본기” 역할: 문자열 길이 확인, 포함 여부 판단, 치환, 분리, 대/소문자 처리, 공백 제거 등 핵심 포인트: 짧은 예시(코드): 2-3) … 더 읽기
3주차 한 줄 결론 이번 주는 자바스크립트를 “찍먹”하는 것이 아니라 언어의 뼈대(변수·자료형·연산·제어) 를 먼저 고정하고, 그 위에 함수(정의→매개변수/return→스코프·호이스팅·IIFE) 를 얹은 다음 객체(속성 접근/수정/추가/삭제 + 참조 자료형의 얕은 복사) 까지 연결해서 실수 포인트를 미리 차단하는 주였습니다. 이번 주 진행 범위 범위: JS 11~15일차 교재: 「코딩 자율학습 HTML + CSS + 자바스크립트」(김기수 지음, 길벗) 일일 학습일지 인덱스 … 더 읽기
오늘 학습 정보 오늘의 핵심 키워드 3개 개념 정리 2-1) 객체(Object) 기본: “키(key) – 값(value)” 묶음 데이터 역할: 여러 값을 하나의 덩어리로 구조화(속성들의 집합) 핵심 포인트: 짧은 예시(코드): 2-2) 객체 속성 접근: 대괄호([ ]) vs 마침표(.) 역할: 객체 안의 특정 속성값을 읽어오기 핵심 포인트: 짧은 예시(코드): 2-3) 속성값 변경/추가/삭제: “접근 후 할당 / delete” 역할: … 더 읽기
오늘 학습 정보 오늘의 핵심 키워드 3개 개념 정리 2-1) 스코프: “어디서 선언했는가”가 접근 범위를 결정 역할: 식별자(변수/함수)를 어느 범위에서 참조할 수 있는지 결정하는 규칙 핵심 포인트: 짧은 예시(코드): 2-2) 호이스팅: “선언이 위로 끌어올려진 것처럼” 동작 역할: 코드 실행 전에 선언 정보를 미리 처리해, 실행 흐름에 영향을 주는 동작 핵심 포인트: 짧은 예시(코드): 2-3) 즉시 … 더 읽기
오늘 학습 정보 오늘의 핵심 키워드 3개 개념 정리 2-1) 함수란 무엇이고 왜 쓰나 역할: 특정 목적의 코드를 블록으로 묶어 필요할 때 호출해 재사용/유지보수성을 높임 핵심 포인트: 짧은 예시(코드): 2-2) 함수 정의 방법 3가지(선언문/표현식/화살표) 역할: 같은 “함수”라도 작성(정의) 방식이 다름 핵심 포인트: 짧은 예시(코드): 추가 포인트(헷갈리기 쉬운 부분): 짧은 예시(코드): 2-3) 매개변수(parameter)와 인수(argument)로 함수 확장하기 … 더 읽기
오늘 학습 정보 오늘의 핵심 키워드 3개 개념 정리 2-1) 조건문(if / else if / else)로 흐름 분기하기 역할: 조건식 결과(true/false)에 따라 실행 흐름을 나눈다. 핵심 포인트: 짧은 예시(코드): 2-2) switch 문으로 “값” 기준 분기하기 역할: 특정 값이 어떤 case와 일치하는지에 따라 분기한다. 핵심 포인트: 짧은 예시(코드): 2-3) 반복문(while / do…while / for)로 같은 작업 … 더 읽기