Programming/Front4 자바스크립트 심화 문법 정리 (ES6+ 기준) 📌 카테고리 1: 비동기 처리 (async/await, Promise)✅ 기본 문법Promiseconst promise = new Promise((resolve, reject) => { const success = true; if (success) { resolve("성공!"); } else { reject("실패!"); }});promise.then(result => { console.log(result);}).catch(error => { console.error(error);});async/await (더 간단한 문법)async function fetchData() { try { const response = await fetch("https://api.example... 2025. 5. 27. 자바스크립트 기본 & 응용 문법 총정리 📌 카테고리 1: 변수와 데이터 타입✅ 기본 문법변수 선언const name = "John"; // 상수 let age = 30; // 변경 가능 변수 var city = "Seoul"; // 예전 방식 (지금은 잘 안 씀)데이터 타입숫자(Number): 42문자열(String): "Hello"불리언(Boolean): true, false배열(Array): [1, 2, 3]객체(Object): { key: value }null, undefined: 비어있거나 아직 값이 없음🌿 응용 예제const person = { name: "John", age: 30, city: "Seoul"};console.log(person.name); // "John"📌 카테고리 2: 연산자와 조건문✅ 기본 문법산술 .. 2025. 5. 27. CSS 레이아웃 & 포지션 핵심 정리 📚 CSS 레이아웃 & 포지션 핵심 정리🏗️ 1️⃣ Flex 컨테이너 주요 속성Flexbox는 가로/세로 방향으로 아이템을 배치하고 정렬하는 데 강력속성 설명justify-content주축(main axis) 정렬 (좌우)align-items교차축(cross axis) 정렬 (상하)flex-direction주축 방향 지정 (row/column)flex-wrap아이템 감싸기 (줄 바꿈 여부)✅ 예제.container { display: flex; flex-direction: row; /* row, row-reverse, column, column-reverse */ justify-content: space-between; /* start, center, end, space-between, spac.. 2025. 5. 26. CSS 기본 문법 & 응용 문법 📚 CSS 기본 문법 정리🔰 CSS란 무엇인가?CSS(Cascading Style Sheets)는 HTML 문서의 스타일과 레이아웃을 꾸미는 언어다.쉽게 말해, HTML이 웹 페이지의 뼈대라면 CSS는 그 뼈대에 옷을 입히는 역할을 한다.✅ 주요 역할색상, 크기, 폰트, 여백 등 디자인요소 배치 및 정렬반응형 레이아웃 구성애니메이션 및 전환 효과🌱 1️⃣ 기본 선택자와 구조선택자 설명 예시*모든 요소 선택* { margin: 0; }태그 선택자특정 태그 선택p { color: red; }클래스 선택자특정 클래스에 적용 (.).box { ... }아이디 선택자특정 아이디에 적용 (#)#header { ... }후손 선택자특정 요소 내부의 자식 선택 (A B)div p { ... }✅ 예제h1 { c.. 2025. 5. 26. 이전 1 다음
