여러 파일로 하나의 어플레케이션을 분리할 때, 각각의 파일들을 모듈이라고 부름 1) 모듈 내보내기 export const func = () => {}; export const a = 1; 2) 모듈 가져오기 Import fileObj from ʻ./file.jsʼ; fileObj .func(); Import { func, a } from ʻ./file.jsʼ; func(); 3) 모듈 시스템 내보내지 않은 변수는 외부로 노출되지 않아 자원 보호가 가능함 CommonJS const func = require(ʻ./file.jsʼ) ES Modules Import func from ʻ./file.jsʼ; export const bark = () => { console.log('Bow-wow'); }; imp..

1. 객체 기본 객체는 사전적인 정의로 실제 존재하는 것을 의미함 1) 객체 생성: {}중괄호나 객체 생성자로 생성 const obj = {}; const obj = new Object(); 2) 객체 구조 사람 = { key: value} // 이 때 중괄호 안에 들어가는 key: value를 프로퍼티(property)라고 함 3) 객체 접근 점 표기범 : obj.key 대괄호 표기법 : obj[key] 사람. 성별 사람. 말하다() 2. 객체 응용 1) 객체 관련 함수 삭제 : delete obj.name; 프로퍼티 유무 : property1 in obj 반복 : for (변수 in obj) { // 변수를 이용한 코드 } 옵셔널 체이닝 : obj?.property?.subProperty 구조 분해 ..

HTML/CSS과제를 끝내며 과제별로 하나하나 정리를 하면서 회고를 해볼까 생각을 하다가 아직 과제가 채점중이고 해설강의도 올라오지 않아서 혼자 다시 정리를 해봐야 똑같을 것 같다는 생각에 그냥 과제를 하면서, 그리고 끝내면서 느낀 생각들을 정리하려고 한다. 과제를 시작 하기전에 나는 강의도 충분히 들었다고 생각을 해서 HTML/CSS는 어려울게 없을것 같다고 생각을 했다. 하지만 내가 들은 강의들은 기초에 불과했고.... 그것들은 다 합쳐서 과제를 하려니 내 생각대로 되지 않는 것이 많았다. 유효성 검사에서부터 걸리기 시작하였다. 브라우저에는 정상적으로 보여서 문제가 없는 것 같았는데 유효성 검사에서 ERROR가 뜨기도 하고, 안될것 같았던데 되기도 하면서 의아한 부분이 있었다. 내가 제일 오랜 시간을..

애니메이션 개요 transition과 비슷하지만 차이가 있음 transition은user의 action에 의해 효과가 나타나지만 animation은 요소가 계속 스타일이 변경될 수 있게 설정 가능함 transition은 a에서 b로만 전환되도록 설정 할 수 있지만 animation은 a에서 b,c,d등 다수의 스타일 전환을 할 수 있음 @keyframes 여러개의 스타일을 자동으로 작동하게 하는것이기 때문에 여러개의 스타일 시트를 정의해둘 수 있음 @keyframes slidein{ from{ margin-left: 100%; width: 300%;} to { margin-left: 0%; width: 100%; } } animation-name, animation-duration animation-na..

Sass란 ● 컴파일해서 css파일을 만드는 스타일 시트 Sass 7-1 패턴 ● 7가지 패턴에 맞춰 파일관리 ○ base/ ○ components/ ○ layout/ ○ pages/ ○ themes/ ○ abstracts/ ○ vendors/ Sass @import ● 파일명 앞에 _가 붙는 경우 @import되어 사용될 것으로 파악 Sass Variables ● 자주쓰는 색이나 사이즈 등을 변수로 저장하여서 사용 Sass @mixin ● 자주쓰는 코드 집합, 재사용이 높은 코드들의 집합 Sass @function ● 변수를 받아서 return

1. 서버/ 클라이언트/ 웹의 동작 개념 「브라우저는 요청을 보내고, 받은 HTML 파일을 그려줌」 - 브라우저는 그려주는 역할을 함 •우리가 보는 웹 페이지는 모두 서버에서 미리 준비해두었던 것을 받아서 브라우저에서 우리가 볼 수 있도록 그려주는 역할 수행. • 즉 브라우저는 요청을 보내고, 요청의 답으로 받은 HTML 파일을 그려주는 일 • 우리가 보는 브라우저는 주소를 통해 API로 요청을 보내고, API는 요청에 맞는 HTML파일을 돌려주고 브라우저는 받은 것을 화면에 그려줌 • 항상 HTML 파일로 돌려주진 않고 데이터만 받아서 갈아끼우는 식으로 작동하게 됨