분류 전체보기

좋은 함수1.작게만들기void authenticateUser() { /* 사용자 인증 */ }void validateRequest() { /* 요청 검증 */ }void executeRequest() { /* 요청 실행 */ }void logRequest() { /* 요청 로그 기록 */ }  2.하나의 함수는 하나의 역할만하기void saveUser(User user) { validateUser(user); // 사용자 검증 insertUserIntoDatabase(user); // 사용자 데이터베이스에 삽입 sendWelcomeEmail(user); // 환영 이메일 발송}3.함수의 추상화수준을 같게하라void processOrder() { validateOrder(); ..

좋은 이름1.의도가 드러나는 이름을 사용해라int userAge; // 사용자의 나이double accountBalance; // 계좌 잔고String customerName; // 고객 이름 2.일관있게,의미있게 구분하라double totalRevenue; // 총수익double totalCost; // 총비용double netProfit; // 순이익 3.발음하기 쉬운 이름 사용int maxScore; // 최대 점수int minScore; // 최소 점수String firstName; // 이름String lastName; // 성 4.검색하기 쉬운 이름 사용int employeeCount; // 직원 수String ..

모던 자바스크립트 Deep Dive를 참고하여 학습,작성하였습니다.화살표 함수간략하게 함수를 선언시킨다.(x, y) => { ... } 방식으로 선언     🎈참고자료https://poiemaweb.com/es6-arrow-function

모던 자바스크립트 Deep Dive를 참고하여 학습,작성하였습니다.템플릿 한번에 여러줄의 문자열을 입력받을수있다. ` 를 사용한다.

모던 자바스크립트 Deep Dive를 참고하여 학습,작성하였습니다.1.letvar키워드를 통한 함수레벨 스코프를 가지는것 대신 let 키워드를 사용하여다른 언어처럼 블록레벨 스코프를  지원할수있다.    2.const상수를 위해 사용(재할당 불가능 = 선언과동시에 할당)블록레벨 스코프를 갖는다하지만 const의 타입이 객체일때 객체의 프로퍼티는 변경가능하다.const me={age:20};me.age=10;document.write(me.age+"")    🎈참고자료https://poiemaweb.com/es6-block-scope

1.수평정렬 1 2 3 inline요소 1 2 3 블록요소 1 2 3 flex 1 2 3   1 2 3 inline요소 1 2 3 블록요소 1 2 3 flex 1 2 3 " data-ke-type="html">HTML 삽입미리보기할 수 없는 소스     2.수직정렬 ..

1.flexdisplay: flex; justify-content: space-around;로 요소를 동적으로 변화할때 유연한 레이아웃을 구현할수있다. 1 2 3 4 1 2 3 4 " data-ke-type="html">HTML 삽입미리보기할 수 없는 소스      2.Flexbox  속성2-1.flex-direction row(기본값) 1 2 3 4 row-reverse 1 2 3 4 column 1 2..

1.반응형 레이아웃layout을 방문자의 화면 해상도를 고려해서 만드는것    2.viewport웹페이지의 가시영역을 의미 디바이스의 특성과 디바이스의 화면 크기 등을 고려하게한다.       3.@media서로 다른 미디어 타입에 style을 지정할수있게한다.@media 미디어_타입 and (조건) { /* 조건이 만족될 때 적용될 CSS 스타일 */} 3-1.미디어 타입all : 모든것print :인쇄secreen : 화면기반장치(컴퓨터,태블릿,스마트폰) 3-2.조건width / height: viewport의 너비와 높이min-width / max-width: 최소/최대 너비min-height / max-height: 최소/최대 높이orientation: 화면의 방향 (portrait 또는 l..