코딩자율학습단 19기 | 13일차 학습일지 – 자바스크립트 함수 정의/호출, 매개변수·return

오늘 학습 정보 오늘의 핵심 키워드 3개 개념 정리 2-1) 함수란 무엇이고 왜 쓰나 역할: 특정 목적의 코드를 블록으로 묶어 필요할 때 호출해 재사용/유지보수성을 높임 핵심 포인트: 짧은 예시(코드): 2-2) 함수 정의 방법 3가지(선언문/표현식/화살표) 역할: 같은 “함수”라도 작성(정의) 방식이 다름 핵심 포인트: 짧은 예시(코드): 추가 포인트(헷갈리기 쉬운 부분): 짧은 예시(코드): 2-3) 매개변수(parameter)와 인수(argument)로 함수 확장하기 … 더 읽기

코딩자율학습단 19기 | 12일차 학습일지 – 조건문(if/switch)·반복문(while/for)·흐름제어(break/continue)

오늘 학습 정보 오늘의 핵심 키워드 3개 개념 정리 2-1) 조건문(if / else if / else)로 흐름 분기하기 역할: 조건식 결과(true/false)에 따라 실행 흐름을 나눈다. 핵심 포인트: 짧은 예시(코드): 2-2) switch 문으로 “값” 기준 분기하기 역할: 특정 값이 어떤 case와 일치하는지에 따라 분기한다. 핵심 포인트: 짧은 예시(코드): 2-3) 반복문(while / do…while / for)로 같은 작업 … 더 읽기

코딩자율학습단 19기 | 11일차 학습일지 – 변수/상수(let·const) · 자료형 · 연산자 우선순위/형변환

오늘 학습 정보 오늘의 핵심 키워드 3개 개념 정리(가장 중요) 2-1) 변수/상수 선언과 동작(var·let·const) 역할: 값을 저장(변수)하거나, 바뀌지 않는 값을 고정(상수)하기 위한 “식별자”를 만드는 것 핵심 포인트: 짧은 예시(코드): 2-2) 식별자(변수/상수 이름) 명명 규칙 역할: 변수/상수를 “구분”하기 위한 이름 규칙 정리 핵심 포인트: 짧은 예시(코드): 2-3) 자료형(data type) 정리(문자열/숫자/논리/undefined/null/객체·배열) 역할: 값의 “종류”를 구분해 올바르게 저장·연산하기 … 더 읽기

코딩자율학습단 19기 | 2주차 총정리 – CSS 선택자 심화 + 레이아웃/효과 + 반응형 + JS 시작

2주차 한 줄 결론 CSS에서 “선택자 → 배치(레이아웃) → 효과(애니메이션/변형) → 반응형(뷰포트/미디어 쿼리)” 흐름으로 웹 화면을 설계하는 감각을 잡았고, 마지막에는 자바스크립트의 기본 연결 방식과 오류 확인 루틴까지 시작했습니다. 이번 주 진행 범위 일일 학습일지 인덱스 이번 주 핵심 개념 TOP 5 TOP 1)CSS 선택자 심화 TOP 2)CSS 스타일 속성 기본기 TOP 3)레이아웃 배치 TOP 4)효과 … 더 읽기

코딩자율학습단 19기 | 9일차 학습일지 – 반응형 웹(미디어 쿼리) + 그리드 배치 + 정렬 속성

오늘 학습 정보 오늘의 핵심 키워드 3개 태그/속성/개념 정리(가장 중요) 2-1) 플렉스 박스 레이아웃(Flexbox) 핵심 플렉스 박스 구성 요소 역할: 1차원(가로 또는 세로) 레이아웃 정렬/배치를 쉽게 만드는 모델 핵심 포인트: 기본 형식: 짧은 예시(코드): flex-direction (주축 방향 결정) 역할: 아이템이 쌓이는 방향(주축)을 지정 핵심 포인트: 기본 형식: 짧은 예시(코드): flex-wrap (줄 바꿈 여부) 역할: 아이템이 … 더 읽기

코딩자율학습단 19기 | 7일차 학습일지 – 텍스트 스타일링·박스 모델 ·background 속성

오늘 학습 정보 오늘의 핵심 키워드 3개 개념 정리 2-1) CSS 선언 기본 구조(공통) 역할: “선택자”로 대상을 고르고, { } 안에 “속성: 값;” 형태로 스타일을 적용 핵심 포인트: 기본 형식: 예시(코드): 2-2) 텍스트 관련 속성(가독성 세팅의 핵심 묶음) color(글자 색) 역할: 텍스트(글자) 색상을 지정 핵심 포인트: 기본 형식: 예시(코드): font-size(글자 크기) 역할: 텍스트 크기를 지정 … 더 읽기

코딩자율학습단 19기 | 6일차 학습일지 – 구조적 가상 클래스, 가상 요소, 형제/하위 선택자

오늘 학습 정보 오늘의 핵심 키워드 3개 내용 정리 2-1) 기본 선택자(전체/태그/id/class) CSS에서 “어떤 요소에 스타일을 적용할지” 가장 기본적으로 고르는 방법이에요. 역할: 스타일 적용 대상을 가장 기본 규칙으로 선택 핵심 포인트: 전체/태그/id/class는 가장 자주 쓰는 출발점 기본 형식: 짧은 예시(코드): 2-2) 속성 선택자(기본/문자열 속성) 요소의 “속성”과 “속성값 조건”으로 대상 요소를 고르는 방식입니다. 링크(a), input 같은 … 더 읽기

코딩자율학습단 19기 | 1주차 총정리 – HTML 기초 + CSS 첫 적용

1주차 한 줄 결론 HTML로 웹페이지 구조(문서/텍스트/목록/링크/폼/시맨틱) 를 잡았고, 마지막 날에는 CSS를 처음 적용하면서 스타일을 붙이는 3가지 방법을 정리했습니다. 이번 주 진행 범위 일일 학습일지 인덱스 이번 주 핵심 개념 TOP 5 TOP 1) HTML 문서 기본 골격 TOP 2) 자주 쓰는 텍스트/구조 태그 정리 TOP 3) 목록과 링크/이미지 TOP 4) 폼(form)과 input 핵심 속성 … 더 읽기

코딩자율학습단 19기 | 5일차 학습일지 – CSS 첫날: 문법과 적용 방법 3가지

오늘 학습 정보 출처: 코딩 자율학습단 카카오톡 채널 메시지 캡처 오늘의 핵심 키워드 3개 내용 정리 2-1. CSS 기본 문법 CSS는 기본적으로 선택자(selector) 와 선언부(declaration block) 로 구성돼요. 선언부 안에는 속성(property): 값(value); 형태를 쓰고, 여러 줄 작성할 땐 보통 세미콜론(;) 으로 구분합니다. 기본 형식: 선택자 { 속성: 값;} 2-2. CSS 주석 CSS에서도 코드 설명을 남길 … 더 읽기

코딩자율학습단 19기 | 4일차 학습일지 – 폼(Form) 기초, 시맨틱 태그, 글로벌 속성 정리

오늘 학습 정보 출처: 코딩 자율학습단 카카오톡 채널 메시지 캡처 오늘의 핵심 키워드 3개 태그/속성 정리 2-1. 폼(Form) 구성하기 form 역할: 입력 요소들을 묶어서 서버로 전송할 “폼”을 만든다. 형식: <form action=”서버 url” method=”get 또는 post”> … </form> 자주 같이 쓰는 속성: input 역할: 다양한 형태의 입력 필드 형식: <input type=”종류” name=”이름” value=”초깃값”> 자주 같이 쓰는 … 더 읽기