목록FrontEnd/쉽게 배우는 HTML5& CSS3 그리고 JavaScript (6)
The Debugging Chronicles : "코드의 미학"
section01. 프로젝트 구조 설계 - 웹의 구조도 작성 1. 웹 앱 구조도 · 앱의 전체 흐름을 파악하는데 도움을 준다. · 메인 페이지로부터 각 주요 화면의 연결 구조를 계층 구조로 작성하여 표현한다. · 주요 화면에 딸린 내용이 많을 경우 다시 그에 따른 각각의 하위 화면도 구조에 포함시킨다. - 필요 페이지 명세서 1. 웹 앱의 메인 화면과 주요 화면에 해당하는 페이지의 명세서 작성 · 페이지의 명세서에는 각 페이지가 표시하거나 처리하는 내용등을 간략하게 기술해서 실제로 구현될 때 사용한다. · 명세서 예시페이지명파일명페이지가 표시하는 내용[main] 페이지index.html사이트의 개략적인 소개와 메인 페이지에서 각 주요 화면으로 이동하는 내비게이션 바 제공[movies] 페이지s1.htm..
section01. 자바스크립트로 Canvas 제어 - HTML5 캔버스의 사용법 · 캔버스는 그래픽을 그릴 수 있는 영역을 말하며, 태그와 자바스크립트를 사용해서 웹 페이지 상에서 그래픽을 그린다. · 태그는 단지 그래픽을 그릴 수 있는 영역을 제공하는 컨테이너(그릇)로 실제로 그래픽을 그리기 위해서는 자바스크립트를 사용해야 한다. · 태그는 너비(width)와 높이(height)를 속성으로 가진다. · 캔버스를 제어하기 위해서는 id 속성도 필요하다. · 캔버스에 표시할 마우스 포인터의 상대적인 위치를 얻기 위해 특정 구역을 정의하는데 쓰이는 태그 안에 넣어서 사용하는 것이 좋다. - 캔버스 제어하기 · 만들어진 캔버스에 도형이나 그림 등을 그리거나, 그려진 것들을 움직이게 만드는 등의 ..
(function(인수리스트){처리할 문장})();section01. 자바스크립트의 개요 *자바의 리터럴(데이터의 값)리터럴은 값을 의미하며 숫자 타입은 그냥 기술하고, 문자열 타입은 큰따옴표(" ")로 둘러 싸서 표현하다.부울(boolean)타입, 문자(character)타입 및 함수, 객체 ,배열, 값도 리터럴로 취급한다. 리터럴(값)설명5정수 리터럴5.0실수 리터럴"test", 'test'문자열 리터럴, 자바스크립트는 문자열 표현에" ", ' '를 둘다 사용할 수 있음false부울 리터럴nullnull 리터럴, 레퍼런스 타입(객체 타입)변수의 초기화 등에 사용.객체 변수가 이 값을 갖게 되면, 할당된 객체가 없다는 의미[1,2,3]배열 리터럴function(){}함수 리터럴{id: "aaa"}객체 ..
01 css 개요 및 css 기본 사용법- CSS는 디자인, 레이아웃, 다양한 기기 및 화면 크기에 따른 디스플레이의 다양성 문제를 포함한 웹 페이지의 스타일을 정의할 때 사용한다. - CSS는 작성 위치에 따라 스타일시트를 태그의 style속성에 기술하는 인라인(inline)스타일시트, 스타일시트를 html 문서 내에 포함해서 작성하는 내부(internal) 스타일시트, 스타일시트를 별도의 파일로 작성하는 외부(external)스타일 시트가 있다. - 스타일 시트를 구성하는 규칙 집합(rule set or rule)은 셀렉터(selector)와 선언 블륵 ({ })으로 구성된다. 셀렉터에는 태그명,id속성 값, class 속성 값이 올 수 있다 02 CSS의 주요 속성과 값종류속성설명값기본 값적용 대상..
Section01. HTML 개요 및 기본 태그HTML· 마크업 언어로 웹 문서를 작성하며, 태그를 사용해서 문서의구조 등을 기술하는 언어이다. · HTML 태그 이름은 으로 둘러싸서 표현한다. · 태그는 일반적으로 시작 태그 와 종료태그 한 쌍으로 기술되며 같은 단독 택그도 있다. · html 문서는 웹 브라우저에서 실행되며, html 문서가 웹 브라우저에서 실행될 때는 화면에 태그 이름은 실행되지 않고 내용 부분만 표시된다. class태그에 적용할 스타일의 이름을 지정 ex) dir 내용의 텍스트 방향을 지정왼쪽에서 오른쪽으로(ltr)이 기본 값이며, 오른쪽에서 왼쪽으로(rtl) 등으로 표현된다.(왼쪽 맞춤, 오른쪽 맞춤)ex) id태그에 유일한 id를 부여함.자바스크립트 제어에서 주로 사용한..
Section01. HTML5, CSS3, JavaScript를 알아보자!1. HTML은 웹 페이지를 작성할 때 사용하는 프로그래밍 언어로, 웹 문서인 웹 페이지의 구조를 ,,,등의 태그를 사용해서 표현한다. 2. CSS는 캐스케이딩 스타일시트(Cascading Style Sheets)의 약자로 HTML 웹 페이지를 웹 브라우저에 표현하는 방법을 제공한다. 3. 자바스크립트는 웹 브라우저에서 동작하는 프로그래밍 언어로 , 주로 태그 등을 클릭하여 어떤 동작을 처리할 때 사용한다.Section 02. HTML, CSS3, JavaScript 는 다양한 곳에 쓰인다1. 일반/ 반응형/ 모바일 전용 웹 사이트 작성에 사용된다. 2. 센서를 사용해서 사물 인터넷을 구현할 때도 사용할 수 있다. 3. HTML의 ..