웹 앱 화면 설계하기
·
BootCamp_Codestates/HTML & CSS
Achievement Goals 만드려는 앱을 와이어프레임으로 그려볼 수 있다. 와이어프레임만 보고 HTML로 코딩할 수 있다. div (또는 section, header 등의 시맨틱 태그)로 영역을 구분하는 이유를 이해할 수 있다. HTML에서 어느 때에 id, 어느 때에 class를 사용해야 하는지 이해할 수 있다. 와이어프레임 와이어프레임(wireframe)은 골격 단순한 도형만을 사용하여 제품의 인터페이스를 시각적으로 묘사 레이아웃과 제품의 구조를 보여주는 용도 목업 실제 작동되는 모습처럼 HTML 코드를 작성. 하드코딩하는 것을 말한다. 혼동되는 용어를 정리해보자. 이곳에서 시각적인 차이를 느껴보자. https://brunch.co.kr/@cysstory/103
CSS 기초
·
BootCamp_Codestates/HTML & CSS
CSS 란? CSS는 쉽게 말해 **사용자 경험(UX)**을 위한 디자인이다. 적당한 위치에 콘텐츠 배치 (레이아웃) 텍스트 강조와 같은 최소한의 타이포그래피(조판, typography) 최소한의 접근성 (예를 들어 색상) UX 의 중요성. 리디자인(왼쪽부터) 예시 UI: 적당한 위치에 콘텐츠 배치 (레이아웃). 훌륭한 내부 기능을 갖고 있더라도 UI가 없으면 소용이 없습니다. 잠깐, 프론트엔드 개발자 소양이란...? 화면 구성을 할 줄 아는 능력 (레이아웃) 보기 좋은 화면을 만들 줄 아는 능력 (타이포그래피, 색상) 정렬이 어긋나거나 배색이 좋지 않음을 인지할 수 있는 감각 사용자가 사용하기 편한 앱이 무엇인지, 왜 편하게 느끼는지에 대한 이유를 분석해본 경험 원문: medium.com/actuali..
CSS 중급
·
BootCamp_Codestates/HTML & CSS
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
·
BootCamp_Codestates/Pre Tech Blog
Closure란? 클로져는 "함수와 함수가 선언된 어휘적(lexical) 환경"의 조합을 말합니다. 이 환경은 클로저가 생성된 시점의 유효 범위 내에 있는 모든 지역 변수로 구성됩니다. 통상적으로 "외부함수의 변수에 접근할 수 있는 내부함수"를 클로져 함수라 부릅니다. 외부함수의 실행이 종료된 후에도, 클로져는 외부함수의 스코프를 참조할 수 있습니다. 클로저 사용 예시: 클로저를 통해 커링(currying, 함수 하나가 n개의 인자를 받는 대신 n개의 함수를 만들어 각각 인자를 받게 하는 방법), 클로저 모듈(변수를 외부 함수 스코프 안쪽에 감추어, 변수가 함수 밖에서 노출되는 것을 막는 방법) 등의 패턴을 구현할 수 있습니다. 클로저의 단점: 일반 함수였다면 함수 실행 종료 후 가비지 컬렉션(참고 자료..
Day11
·
카테고리 없음
오늘 한일 JavaScript Koans 주요 내용 블로그 정리 JavaScript Koans 스프린트 리뷰 참가 코플릿 배열, 객체 리뷰 및 블로그 정리 개발자 콘솔 디버깅 사용법 숙지 CSS Selector Lesson 진행 및 블로그 정리 Full IM 21 후기 공유회 참가 학습내용 및 성취 Koans 주요 개념 공부 CSS Selector 요소 및 범위 학습 코플릿 배열, 객체 못 풀었던 문제 해결 Full IM 21 후기 공유회를 통해 공부 자세 및 취업 관련 팁 Get. 느낀점 : ... 나름 열심히 하고 있다. 뭔가... 블로그 정리하는데에 많은 시간을 쏟아붓고 있는 것 같다. 머릿속에도 집어넣도록 하자.
Day 10
·
BootCamp_Codestates/TIL
오늘 한일 Lesson 진행 및 블로그 개념정리 - 개발자 도구 설치, Command Line, Git JavaScript Koans 진행 및 제출 학습내용 및 성취 CLI 주요 명령어 학습, koans 과제 적용 Git WorkFlow 에 대한 이해 및 터미널을 통한 git command 실습 Koans 통해 expect, type, const , scope, data type, Array, Object, Spread Syntax 공부. (주요 개념 복습 필요) 느낀점 알게 모르게 많은 지식들을 습득하고 있는 느낌이다. 특히, 이번 Koans 스프린트를 통해 내가 배웠던 지식에 대한 재확인을 할 수 있어서 좋았다. 개념을 명확히 머리속에 정리하면서 새로운 내용들을 흡수해야 한다.(고 생각하는데, 시간이..