본문 바로가기

개발 공부

(32)
웹 퍼블리싱 1주차 ▶퍼블리싱 기본 개념 : Figma, Photoshop 등 그래픽 리소스를 html + css + js 로 변환해 브라우저에 표현하는 것. ▶퍼블리싱에 대한 개념 : 마크업 : HTML을 통해 기본 뼈대를 만듭니다. 스타일링 : CSS로 마크업에 색상 등의 속성을 입혀 스타일을 지정합니다. 부가 기능 : Javascript로 특정 요소에 기능을 만들어 부여합니다. ▶HTML은 크게 head와 body로 구성되며, head안에는 페이지의 속성 정보를, body안에는 페이지의 내용을 담습니다. head 안에 들어가는 대표적인 요소들: meta, script, link, title 등 페이지의 속성을 정의하거나, 필요한 스크립트들을 부릅니다. 즉, 눈에 안 보이는 필요한 것들을 담는 것. 나중에 body 작업..
혼공스 Chapter.6 ▶요소 : 배열 내부에 있는 값. ▶속성 : 객체 내부에 있는 값. ▶메소드 : 속성 중에 함수 자료형인 것. ▶this 키워드 : 객체 내부의 머소드에서 객체 자신을 나타내는 키워드. ▶동적 속성 추가/제거 : 객체 생성 이후에 속성을 추가하거나 제거하는 것. ▶확인 문제 1. 다음과 같은 대상을 자바스크립트 객체로 선언하라. 자료형은 알맞다고 생각하는 것으로 지정하라. 속성 이름 속성 값 name 혼자 공부하는 파이썬 price 18000 publisher 한빛미디어 ​ 2. 다음 중 객체에 동적으로 속성을 추가하는 문법은? add 객체[속성] = 값 객체.add('속성',값) 객체[속성] = 값 (O) 객체[속성] add 값 3. 다음 중 객체에 동적으로 속성을 제거하는 문법은? delete 객체[..
혼공스 Chapter.5 ▶익명 함수 : 이름이 없는 함수 function () {} 형태 ▶선언적 함수 : 이름이 있는 함수 function 함수 이름 () {} ▶매개변수 : 함수의 괄호 안에 넣는 변수. 매개변수를 통해 함수는 외부의 정보를 입력받을 수 있음. ▶리턴값 : 함수의 최종적인 결과. 함수 내부에 return 키워드를 입력하고 뒤에 값을 넣어서 생성. ▶가변 매개변수 함수 : 매개변수의 개수가 고정되어 있지 않은 함수. 나머지 매개변수(...)를 활용해서 만듦. ▶전개 연산자 : 배열을 함수의 매개변수로써 전개하고 싶을 때 사용. ▶기본 매개변수 : 매개변수에 기본값이 들어가게 하고 싶을 때 사용하는 매개변수. ▶확인 문제 1. A부터 B까지 범위를 지정했을 때 범위 안의 숫자를 모두 곱하는 함수를 만들어라. 2..
혼공스 Chapter.4 ▶배열 [ ]: 여러 개의 변수를 한 번에 선언해 다룰 수 있는 자료형. ▶요소 : 배열 내부에 있는 값. ▶비파괴적 처리 : 처리 후에 원본 내용이 변경되지 않는 처리. ▶파괴적 처리 : 처리 후에 원본 내용이 변경되는 처리. ▶확인 문제 1. 다음 배열들의 2번째 인덱스에 있는 값을 찾아라. ["1","2","3","4"] → "3" ["사과","배","바나나","귤","감"] → "바나나" [52, 273, 32, 103, 57] → 32 2. 다음 코드의 실행결과는? 4 5 3. 다음 표시된 함수들이 파괴적 처리를 하는지 비파괴적 처리를 하는지 구분하라. > const strA = "사과,배,바나나,귤" undefined > strA.split(",") (4) ["사과", "배", "바나나", "..
혼공스 Chapter.3 ▶if 조건문 : 조건에 따라 코드를 실행하거나 실행하지 않도록 하기 위해 사용하는 구문. ▶else 구문 : if 조건문 뒤에 사용하며, if 조건문이 거짓일 때 사용. ▶중첩 조건문 : 조건문을 중첩해서 사용하는 경우를 의미. ▶if else if 조건문 : 중첩 조건문에서 중괄호를 생략한 형태, 겹치지 않는 3가지 이상의 조건으로 나눌 때 사용. ▶확인 문제 1. 다음 예제 중에서 '참입니다'를 출력하는 것은? ① ② ③ 정답 : 3번 2. 사용자로부터 숫자 2개를 입력받아 첫 번째 입력받은 숫자가 큰지, 두 번째 입력받은 숫자가 큰지를 구하는 프로그램 완성하라. 3. 중첩 조건문은 2장에서 배운 논리 연산자를 적용해 하나의 if 조건문으로 만들 수 있다. 어떤 논리 연산자가 들어가야 하는가? if..
혼공스 Chapter.2 ▶자료형 : 자료의 종류 ▶문자를 표현할 때 : 문자열 자료형 사용 ▶숫자를 표현할 때 : 숫자열 자료형 사용 ▶참 거짓을 표현할 때 : 불 자료형 사용 ▶확인문제 1. 다음 연산자들의 피연산자가 어떤 자료형인지 적어라. 연산자 피연산자 자료형 +(문자열 연결 연산자) 문자열 +(덧셈 연산자) 숫자 && 불 - 숫자 * 숫자 || 불 2. 다음 프로그램의 실행 결과를 예측해 보아라. → # 연습문제 \\\\ 3. 다음 프로그램의 실행 결과를 예측해 보아라. -> 녕 하 세 요 4. 다음 프로그램의 실행 결과를 예측해 보아라. → 0 4 ▶상수 : 변하지 않는 값을 저장하는 식별자. const 키워드로 선언 ▶변수 : 변하는 값을 저장하는 식별자. let 키워드로 선언 ▶선언 : 상수 또는 변수를 생성하는..
혼공스 Chapter.1 ▶ 자바스크립트 : 웹브라우저에서 작동하는 프로그래밍 언어. ▶ 웹 애플리케이션 : 기존의 웹 페이지보다 많은 기능을 구현한 웹 페이지. ▶ 확인 문제 1. 인터넷을 돌아다니면서 보았던 쉽게 사용 할 수 있고, 기능이 많다고 느꼈던 웹사이트 5개 - 넷플릭스 - 구글 - 페이스북 - 네이버 - 트위터 2. StatCounter에서 현재 시점의 웹 브라우저 점유율 확인하기 - 크롬이 압도적으로 1위... ▶확인 문제 1. 구글 크롬 개발자 도구의 콘솔을 실행하고 다음 명령을 입력했을 때 나오는 결과를 반칸에 적어라. > "안녕하세요" "안녕하세요" > console.log("안녕하세요") 안녕하세요 undefined "안녕하세요 VM244:1 Uncaught SyntaxError: Invalid or un..
항해99 웹개발 종합반 1~2주차 강의 요약 1강 요약 1. 웹 브라우저 원리 - 서버에 요청 -> 서버는 HTML, CSS, JS 제공 -> 그대로 보여줌(프론트엔드) 2. HTML : 웹의 뼈대를 잡아주는 구역을 나타내는 코드. - Head : 페이지의 속성 정보(눈에 안 보이는 필요한 것들을 담는 것) - Body : 페이지의 내용 - 줄 정렬은 shift + alt + f 3. CSS : HTML을 통해 작성된 뼈대의 속성을 선택해 꾸며주는 코드. - 안에 로 공간을 만들어 작성 4. 자주 쓰는 css - h1-h6 : 구획 제목 - background-image - background-size - background-position color - width : 너비 - height : 높이 - border-radius : 테두리 둥글게 만..