CSS 란? CSS는 쉽게 말해 **사용자 경험(UX)**을 위한 디자인이다. 적당한 위치에 콘텐츠 배치 (레이아웃) 텍스트 강조와 같은 최소한의 타이포그래피(조판, typography) 최소한의 접근성 (예를 들어 색상) UX 의 중요성. 리디자인(왼쪽부터) 예시 UI: 적당한 위치에 콘텐츠 배치 (레이아웃). 훌륭한 내부 기능을 갖고 있더라도 UI가 없으면 소용이 없습니다. 잠깐, 프론트엔드 개발자 소양이란...? 화면 구성을 할 줄 아는 능력 (레이아웃) 보기 좋은 화면을 만들 줄 아는 능력 (타이포그래피, 색상) 정렬이 어긋나거나 배색이 좋지 않음을 인지할 수 있는 감각 사용자가 사용하기 편한 앱이 무엇인지, 왜 편하게 느끼는지에 대한 이유를 분석해본 경험 원문: medium.com/actuali..

Before you learn, CSS의 기본적인 셀렉터 #와 .을 이해하고 있다.→ id, class 어떤 단위가 절대 단위인지, 상대 단위인지 알고 있다. → px 절대, em,rem 상대 CSS 박스 모델에 대해 이해하고 있다. → position, margin, border, padding, content 박스 측정 기준 두가지의 차이를 이해하고 있다.(box-sizing) content-box: 컨텐츠 기준으로 height, width 측정. border-box: border, padding, 컨텐츠 모두 포함하여 height, width 값 측정. Achievement Goals 다양한 CSS 셀렉터 규칙을 이해할 수 있다. 레이아웃을 위한 HTML을 만들 수 있다. Flexbox를 이용해 레..

Closure란? 클로져는 "함수와 함수가 선언된 어휘적(lexical) 환경"의 조합을 말합니다. 이 환경은 클로저가 생성된 시점의 유효 범위 내에 있는 모든 지역 변수로 구성됩니다. 통상적으로 "외부함수의 변수에 접근할 수 있는 내부함수"를 클로져 함수라 부릅니다. 외부함수의 실행이 종료된 후에도, 클로져는 외부함수의 스코프를 참조할 수 있습니다. 클로저 사용 예시: 클로저를 통해 커링(currying, 함수 하나가 n개의 인자를 받는 대신 n개의 함수를 만들어 각각 인자를 받게 하는 방법), 클로저 모듈(변수를 외부 함수 스코프 안쪽에 감추어, 변수가 함수 밖에서 노출되는 것을 막는 방법) 등의 패턴을 구현할 수 있습니다. 클로저의 단점: 일반 함수였다면 함수 실행 종료 후 가비지 컬렉션(참고 자료..

오늘 한일 Lesson 진행 및 블로그 개념정리 - 개발자 도구 설치, Command Line, Git JavaScript Koans 진행 및 제출 학습내용 및 성취 CLI 주요 명령어 학습, koans 과제 적용 Git WorkFlow 에 대한 이해 및 터미널을 통한 git command 실습 Koans 통해 expect, type, const , scope, data type, Array, Object, Spread Syntax 공부. (주요 개념 복습 필요) 느낀점 알게 모르게 많은 지식들을 습득하고 있는 느낌이다. 특히, 이번 Koans 스프린트를 통해 내가 배웠던 지식에 대한 재확인을 할 수 있어서 좋았다. 개념을 명확히 머리속에 정리하면서 새로운 내용들을 흡수해야 한다.(고 생각하는데, 시간이..

과제 진행 방법 Codestates 깃헙에서 Fork 개인 깃헙에서 Clone 복사 Clone 복사할 위치에서 git clone (복사한 클론 주소) 한 주제(폴더) 변경이 끝나면 커밋하기(기록남기기) 커멘드창에서 koans 폴더 위치로 이동후 git status: 변경된 파일 확인 가능 git add '변경된것' (ex:koans/01_Introduction.js) : staging area 로 올라간다.( 두개 이상 파일 올리려면 git add . ) git commit -m '커밋내용': commit(기록=log) 한 내용은 git log(기록 저장소) 로 알 수 있다. 5. 과제 제출하기 마지막으로 주제를 커밋을 해준다. git status git add 'modified' git commit -..

Scope란? : 무언가 제한된 범위를 잘 들어다보기 위해 사용되는 개념, 범위가 있어야 함수가 잘 작동하는지 확인할 수 있다 Achievement Goals JavaScript의 Scope의 의미와 적용 범위를 이해할 수 있다 JavaScript의 Scope 주요 규칙을 이해할 수 있다 중첩 규칙 block scope(block-level scope) vs. function scope(function-level scope) let, const, var의 차이 전역 변수와 전역 객체의 의미 Rule1: Scope: 변수 접근 규칙에 따른 유효범위 변수는 어떠한 환경 내에서만 사용 가능. 프로그래밍 언어는 각각의 변수 접근 규칙을 가짐. 변수와 그 값이, 어디서부터 어디까지 유효한지를 판단하는 범위 자바스..