웹(web) 프로그래머 공부 추천좀
-
게시물 수정 , 삭제는 로그인 필요
웹(web) 프로그래머 공부 추천좀
HTML5 + CSS + 자바스크립터 + J쿼리 따로 책을 사서 공부해야 할지
다음책중에 사서 공부해야할지 추천 바랍니다.(2권만 골라주세요)
----다음중 2권만 선택좀 혹은 1권만-----
((1번책))--인터랙티브 웹디자인북 웹디자이너를 위한 HTML5 + CSS3 + jQuery 사용설명서--최성일
CHAPTER 1. 왜 인터랙티브 웹인가?
__1.1 새로운 변화의 바람, HTML5
__1.2 HTML5의 상용화는 과연 언제?
__1.3 넘을 수 없는 4차원의 벽, JavaScript
__1.4 JavaScript vs jQuery
__1.5 작업환경 설정하기
__1.6 예제 작업을 위한 템플릿 폴더 구조 및 파일 만들기
CHAPTER 2. HTML5, CSS3, jQuery 필수 구문 정리
__SECTION 1 HTML5의 새로운 태그
__SECTION 2 〈video〉 태그
__SECTION 3 nth-child( )
__SECTION 4 text-shadow, box-shadow
__SECTION 5 border-radius
__SECTION 6 gradient
__SECTION 7 background-size
__SECTION 8 box-sizing
__SECTION 9 transform(2d 변형)
__SECTION 10 transform(3d 변형)
__SECTION 11 transition
__SECTION 12 animation
__SECTION 13 mediaquery
__SECTION 14 구글 웹 폰트
__SECTION 15 웹 폰트 아이콘
__SECTION 16 jQuery 선택자
__SECTION 17 .css( )
__SECTION 18 .attr( )
__SECTION 19 jQuery 탐색 구문
__SECTION 20 이벤트 연결하기
__SECTION 21 .animate( )
__SECTION 22 변수
_SECTION 23 문자열, 숫자
_SECTION 24 연산자
_SECTION 25 조건문(if문)
_SECTION 26 반복문(for문)
_SECTION 27 $(this)
_SECTION 28 .index( )
_SECTION 29 .width( ), .height( )
_SECTION 30 .hide( ), .show( ), .fadeout( ), .fadeIn( )
_SECTION 31 .addClass( ), .removeClass( )
_SECTION 32 .text( )
_SECTION 33 .html( )
_SECTION 34 e.pageX, e.pageY
_SECTION 35 .scrollTop( )
_SECTION 36 .offset( ).top
_SECTION 37 .load( ), .play( ), .pause( )
_SECTION 38 new Date( )
_SECTION 39 setInterval( )
_SECTION 40 mousewheel.js
CHAPTER 3. 실전 예제 작업하기
__SECTION 1배경 동영상을 활용한 웹 페이지
____1.1 예제 둘러보기
____1.2 Step by Step
____1.3 DESIGNER’s INTERVIEW
__SECTION 2화면의 폭에 따라 변화는 웹 레이아웃(반응형 웹)
____2.1 예제 둘러보기
____2.2 Step by Step
____2.3 DESIGNER’s INTERVIEW
__SECTION 3입체적으로 회전하는 웹 레이아웃
____3.1 예제 둘러보기
____3.2 Step by Step
____3.3 DESIGNER’s INTERVIEW
__SECTION 4마우스 오버 시, 동영상이 재생되는 콘텐츠 박스
____4.1 예제 둘러보기
____4.2 Step by Step
____4.3 DESIGNER’s INTERVIEW
__SECTION 5마우스 움직임에 따라 제어되는 이미지 시퀀스
____5.1 예제 둘러보기
____5.2 Step by Step
____5.3 DESIGNER’s INTERVIEW
__SECTION 6시간에 따라 달라지는 웹 디자인
____6.1 예제 둘러보기
____6.2 Step by Step
____6.3 DESIGNER’s INTERVIEW
__SECTION 7마우스 휠의 움직임에 따라 스크롤되는 웹 페이지
____7.1 예제 둘러보기
____7.2 Step by Step
____7.3 DESIGNER’s INTERVIEW
SECTION 8가로로 스크롤되는 갤러리 페이지
____8.1 예제 둘러보기
____8.2 Step by Step
____8.3 DESIGNER’s INTERVIEW
SECTION 9 z축으로 스크롤되는 웹 페이지
____9.1 예제 둘러보기
____9.2 Step by Step
____9.3 DESIGNER’s INTERVIEW
((2번책))--개발자가 되고 싶으세요? IT 입문 지식을 말하다--고종범, 김미진, 윤성열, 이상민, 이재근
1부_인터넷
1장 웹은 어떻게 동작하는 걸까?
웹이란 도대체 무엇일까?
웹 서비스를 왜 개발하나요? 사람들은 웹을 왜 사용하나요?
웹 서비스 환경 준비, 웹 서버
브라우저에 표시되는 웹 페이지의 정체, 웹의 구성요소들
웹을 위한 기초적이지만 필수적인 기술들 - JavaScript, CSS
기술의 발전, 웹을 위한 더 확장된 기술들 ? ASP, JSP, PHP
갑자기 너무 어려워요…… 이런 것들을 왜 사용하는 거죠?
웹2.0과 HTML5, 웹의 재도약
파편화와 크로스 브라우징(Cross Browsing)
웹 서비스에 멋진 이름을 붙여보자, 도메인
웹 서비스를 만들어 보자
웹 개발 분야의 전문가가 되려면?
정리하며
2장 요즘은 모바일이 대세라던데…
모바일 앱의 다양한 형태
네이티브 앱이 대체 뭔가요
모바일 웹은 뭐죠? 웹은 알겠는데…
그렇다면 도대체 하이브리드(Hybrid) 앱은 뭐지?
이제 앱 개발은 어떻게 해야 하나요?
안드로이드 앱 개발도구
아이폰 앱 개발 도구
앱 개발 과정
앱 개발 시 유의해야 할 사항들
다양한 크기의 모바일 기기, 어떻게 처리하나?
가로/세로 모드의 지원
태블릿 화면의 지원
플랫폼 별 UI의 특징을 구분해 사용하자
모바일 분야의 전문가가 되려면?
정리하며
2부_소프트웨어 개발 프로세스
3장 소프트웨어 개발 과정을 알고 싶어요
아이템 선정: 우선 무엇을 만들지 정해야겠지?
요구사항 분석: 자, 그럼 진지하게 생각해보자구!
설계: 어둠을 욕하기보다 촛불 하나 켜는 게 낫다
구현: 아쉽게도 컴퓨터는 그림을 못 알아먹는다
테스트: 재대로 만들었을까?
배포: 고객님들이 사용하실 수 있도록!
정리하며
4장. 그냥 제가 기획서 드리면 뚝딱 만들어지는 거 아닌가요?
그냥 말 그대로 ‘요구하는 사항’ 아니야?
요구사항 도출, 해보니까 끝이 없던데…
진짜로 이렇게 만들어 줄 수 있는 거 맞죠?
문서! 문서! 문서!
소설책 보다는 만화책이 읽기 쉽지
그림 그려보기
요구사항 분석은 계속되어야 한다. 쭈욱~
정리하며
5장. 이 그림들은 뭔가요? 흰 건 종이고, 까만 건…
설계란 무엇인가?
설계 대상에는 어떤 것이 있는가?
화면 설계, UX 설계하기
동작과 구조의 설계로 어플리케이션 설계하기
데이터 저장소 설계하기
네트워크, 시스템 구성 설계하기
요구사항이 변경되면 설계도 변경된다
설계 분야의 전문가가 되려면
정리하며
6장. 저도 테스트 잘 해요. (정말?)
테스트가 무엇이길래?
테스트는 어떻게 하나요?
테스트 케이스 만드는 방법
테스트에는 어떤 것들이 있나요?
코드를 만들면서 진행하는 단위 테스트
하나로 합쳐서 진행하는 통합 테스트
총체적 검사를 수행하는 시스템 테스트
품질을 확인하는 인수 테스트
테스트 분야의 전문가가 되려면?
정리하며
7장. 작은 프로그램 하나 만들 때에도 절차라는 게 필요하군요
시작은 창대하였으나 그 끝은 미약하리라?!
모든 일을 처리하는 데 필요한 프로세스
프로세스를 좌지우지하는 방법론
소프트웨어 개발 방법론의 종류
가장 대표적인 고전 개발 방법인 폭포수 모델
최근 인기가 많은 스크럼
나한테 맞는 개발 방법 찾기
정리하며
3부_프로그래밍
8장. 자바, 씨, 씨샵. 들어보긴 했는데
Programming Language(프로그래밍 언어)?
프로그래밍 언어의 종류는 많답니다
IT 분야의 분업화
프로그래밍은 어떤 작업을 수행하는 것일까?
Java 언어 구경하기
JavaScript로 프로그램을 직접 만들어 볼까요?
API는 개발자의 친구
정리하며
9장. 프로그래밍은 어떻게 하는 거에요? (기웃 기웃)
컴퓨터에는 숫자의 종류가 많답니다
어느 언어를 배우더라도 반드시 알아야 하는 내용
if … 만약에 …
정보들을 어디엔가 모아 두고 싶다면
for 루프와 while 반복 구문
프로그래밍 언어 종합 정리
정리하며
10장. 프레임워크, 도대체 그게 뭔지…
프레임워크가 무엇인가요?
프레임워크를 반드시 사용해야 하는가?
프레임워크에는 어떤 것들이 있나요?
웹 어플리케이션 프레임워크
모바일 어플리케이션 프레임워크
프레임워크를 직접 만들 수는 없을까?
개발 분야의 전문가가 되려면?
정리하며
4부_데이터 저장소
11장. 저장은 그냥 파일에 하면 되는 거 아닌가요?
데이터베이스란 무엇일까?
DB의 구성요소
검색 시스템
도서 관리 시스템 - 새로운 책의 추가, 삭제 그리고 수정
테이블간의 릴레이션
정규화
데이터베이스 암호화
데이터베이스 분야의 전문가가 되려면?
정리하며
토막 칼럼 | “데이터베이스 개발자는 이것을 주의해야 한다”
12장. 우리회사도 빅데이터 한다는데~
빅데이터의 사용
NoSQL?
NoSQL의 역사
NoSQL의 아키텍처
NoSQL은 단점이 없을까?
빅데이터를 분석하려면 툴이 필요하다
전문가들은 빅데이터를 어떻게 분석할까
빅데이터의 본질
부록 A. 도메인부터 웹 서비스 동작과정까지
부록 B. 플레이 프레임워크
부록 C. 어플리케이션 프레임워크 - 스프링
부록 D. 프론트엔드 프레임워크 - 부트스트랩과 jQuery
((3번책))--HTML5+CSS3 실무테크닉--김은기
Part 1 HTML5의 기초 다지기
Lesson 01 웹 브라우저의 언어, HTML5
HTML의 개념
HTML5의 개념
HTML5의 주요 기능
Lesson 02 웹 스타일을 책임지는 스타일시트, CSS3
스타일시트(CSS)의 개념
업그레이드된 CSS3
CSS3 주요 기능
HTML5와 CSS3를 지원하는 웹 브라우저
Lesson 03 웹 페이지를 새롭게 만드는 자바스크립트(JavaScript)
자바스크립트 소스
자바스크립트의 매력
Lesson04 HTML5, CSS3, JavaScript의 상관관계
HTML5, CSS3, JavaScript
웹 문서 작성 시 지켜야 할 규칙
Lesson 05 학습을 위한 준비
브래킷
웹 브라우저, 크롬
웹 사이트에서 샘플 다운로드하기
Part 2 HTML5 태그 정복하기
Lesson 01 HTML 기본 구조 들여다보기
HTML5의 기본 구조
HTML 태그의 특징
HTML 문서 연습하기
Lesson 02 웹 사이트의 안내자 〈meta〉 태그
〈head〉 태그 속의 〈meta〉 태그
문서의 문자 셋 선언하기
시간 설정하여 자동으로 페이지 이동하기
Lesson 03 HTML5 시멘틱 구조 태그
시멘틱 웹의 개념
제목 크기를 조절하는 〈h1〉~〈h6〉 태그
구획 정의를 위한 태그
Lesson 04 똑똑한 비서, 정리 태그 알아보기
〈br〉 태그 vs. 〈p〉 태그
수평선을 긋는 〈hr〉 태그
입력한 형태 그대로 보여주는 〈pre〉 태그
〈div〉와 〈span〉 태그
Lesson05 보기 좋은 목록을 만드는 태그
목록 만드는 태그
계층 구조를 만드는 〈dl〉 태그
Lesson 06 타이포에 마술을 거는 태그
글자 스타일을 바꾸는 태그
글자 위의 주석, 루비 글자 태그
특수 문자 입력하기
Lesson 07 웹 문서를 재미있게 꾸미는 태그
이미지를 삽입하는 〈img〉 태그
이미지 크기 지정하기
상대 경로와 절대 경로
웹 문서 속의 웹 문서 〈iframe〉
멀티미디어를 삽입하는 〈embed〉 태그
〈audio〉와 〈video〉 태그
동영상을 자동 재생하고 반복하기
이미지맵을 설정하는 〈map〉 태그
Lesson 08 깔끔한 웹 문서의 필수품, Table
〈table〉의 기본 태그
테이블로 문서 편집하기
가로, 세로 내 마음대로 셀 합치기
테이블 안에 아기 테이블 넣기
Lesson 09 웹 공간을 마음대로 헤엄치는 하이퍼링크
URL로 하이퍼링크 연결하기
하나의 문서 안에서 특정 위치로 이동하기
하이퍼링크로 할 수 있는 다양한 것
Lesson 10 폼(form)으로 방문자와 대화하기
server-side를 처리하기 위한 〈form〉
〈form〉 안에 사용되는 입력 양식
HTML5 〈input〉 태그
Lesson 11 HTML5에서 더 이상 지원하지 않는 태그
HTML5에서 지원하는 태그
HTML5에서 새로 지원하는 태그
Part 3 CSS 기초 이해하기
Lesson 01 나만의 스타일을 만드는 CSS3
스타일시트의 개념
스타일시트의 매력
Lesson 02 스타일시트를 적용하는 여러 가지 방법
외부 문서에서 연결하기(linked Style)
문서 내부에 정의하기(Embedded Style)
태그에 직접 정의하기(Inline Style)
Lesson 03 기초부터 알아보는 스타일시트
스타일시트 기본 형식
특정 태그에 스타일 지정하기
그룹으로 만든 태그에 스타일 지정하기
하위 태그에 스타일 지정하기
클래스 이용하기
아이디(ID) 이용하기
Lesson 04 배경을 꾸미는 스타일시트
배경 색상 바꾸기(background-color)
배경 그림 바꾸기(background-image)
반복되는 배경 그림 바꾸기(background-repeat)
배경 그림의 스크롤 지정하기(background-attachment)
배경 그림의 위치 지정하기(background-position)
배경 그림의 속성을 한 번에 지정하기(background)
Lesson 05 테두리를 폼 나게 꾸미는 스타일시트
테두리 형태 지정하기(border-style)
테두리의 색상 지정하기(border-color)
테두리의 두께 지정하기(border-방향-width)
테두리의 두께를 한 번에 지정하기(border-width)
Lesson 06 세련미를 풍기는 박스 여백
바깥 여백 지정하기(margin-방향)
바깥 여백 한 번에 지정하기(margin)
안쪽 여백 지정하기(padding-방향)
문단의 위치와 폭, 높이 지정하기
Lesson 07 다양한 글씨를 표현하는 스타일시트
글자 색상 바꾸기(color)
글꼴 지정하기(font-family)
글자 형태 지정하기(font-style)
글자 굵기 지정하기(font-weight)
글자 크기 지정하기(font-size)
글자 속성 한 번에 지정하기(font)
Lesson 08 문자와 문단을 꾸미는 스타일시트
자간 지정하기(letter-spacing)
단어 간격 지정하기(word-spacing)
줄 간격 지정하기(line-height)
공백과 줄바꿈 지정하기(white-space)
Lesson 09 내 마음대로 문서를 꾸미는 스타일시트
문단 들여쓰기 지정하기(text-indent)
글자에 밑줄 긋기(text-decoration)
영문자의 대/소문자 속성(text-transform)
Lesson 10 목록을 꾸미는 스타일시트
목록의 머리 기호 바꾸기(list-style-type)
그림으로 목록의 머리 기호 만들기(list-style-image)
목록의 들여쓰기 지정하기(list-style-position)
Lesson 11 하이퍼링크를 꾸미는 스타일시트
하이퍼링크 색상과 밑줄 표시하기
한 문서에 여러 가지 하이퍼링크 스타일 적용하기
Lesson 12 여러 개의 스타일을 동시에 적용하기
Part 4 업그레이드된 CSS3 살펴보기
Lesson 01 CSS3 살짝 맛보기
CSS3 접두어
Lesson 02 테두리 속성, border
다양해진 테두리 효과
테두리를 둥글게 만들기(border-radius)
테두리에 그림자 만들기(box-shadow)
테두리에 이미지 사용하기(border-image)
Lesson 03 배경 이미지 속성, background
배경 이미지 크기 지정하기(background-size)
배경 이미지 위치 지정하기(background-origin)
배경 이미지 여러 개 지정하기(background)
Lesson 04 그레이디언트 속성, gradient
선형 그레이디언트 주기(linear-gradient)
선형 그레이디언트에 방향 주기(linear-gradient)
선형 그레이디언트에 여러 개의 색상 주기(linear-gradient)
선형 그레이디언트에 투명도 주기(linear-gradient)
선형 그레이디언트 반복하기(linear-gradient)
방사형 그레이디언트 만들기(radial-gradient)
방사형 그레이디언트에 모양 주기(radial-gradient)
방사형 그레이디언트에 크기와 위치 지정하기(radial-gradient)
방사형 그레이디언트 반복하기(radial-gradient)
Lesson 05 텍스트와 관련된 여러 가지 속성
Text Shadow
Word Wrapping
Lesson 06 CSS3를 이용한 간단한 애니메이션
animation 정의하기
@keyframe을 이용하여 Animation의 중간 상태 기술하기
Lesson 07 위치, 모양, 크기를 내 맘대로, transform
transform 사용하기
Lesson 08 애니메이션 속도를 제어하는 transition
transition 사용하기
Lesson 09 사용자 인터페이스(Basic User Interface) 만들기
Resizing
Box Sizing
Outline Offset
Multi-column
Part 5 반응형 웹 디자인과 부트스트랩
Lesson 01 반응형 웹 디자인 이해하기
반응형 웹 디자인의 개념
반응형 웹 사이트
반응형 웹 디자인이 적용된 경우
반응형 웹 디자인을 위한 브레이크 포인트
Lesson 02 웹 디자인 레이아웃을 위한 그리드 시스템
그리드 시스템의 기능
그리드 시스템 참조 사이트
정적, 동적, 반응형 그리드 시스템
Lesson 03 float과 display로 3단 레이아웃 만들기
float로 만든 3단 레이아웃
display:table-cell로 만든 3단 레이아웃
Lesson 04 미디어 타입과 미디어 쿼리
미디어 타입
미디어 쿼리
미디어 쿼리의 문법
Lesson 05 반응형 웹 디자인 따라하기
브레이크 포인트
가변 그리드 패턴
단 드롭 패턴
레이아웃 시프터 패턴
작은 변화 패턴
오프 캔버스 패턴
Lesson 06 이전 웹 브라우저에서 HTML5 사용하기
사람들은 어떤 웹 브라우저를 많이 사용할까?
웹 브라우저 버전에 따른 HTML5 사용하기
IE7 미만에서 HTML 및 CSS 엘리먼트, 투명 PNG 지원하기
Lesson 07 트위터의 오픈 소스, 부트스트랩
부트스트랩의 특징
부트스트랩 다운로드
부트스트랩 기본 문서 템플릿
그리드 시스템
테이블
폼과 버튼
기타 다양하게 제공되는 CSS
다양한 컴포넌트
반응형 디자인
커스터마이징
Part 6 따라해보는 실무 예제 및 템플릿
Lesson 01 따라하기 전 준비 사항
Lesson 02 가장 많이 사용하는 드롭다운 상단 메뉴
Lesson 03 펼쳐지고 접혀지는 아코디언 메뉴
Lesson 04 그룹화시켜 보여주는 탭 메뉴
Lesson 05 CSS를 이용한 아이콘 버튼
Lesson 06 여러 가지 이미지를 보여주는 이미지 슬라이더
Lesson 07 동영상을 컨트롤하는 동영상 플레이어
Lesson 08 실무에서 바로 써먹는 웹 사이트 템플릿
웹 사이트의 기초 설계
Top Menu & Footer
Main Page
Photo Gallery
Movie Gallery
About
Contact
((4번책))--웹프로그래밍 완성 단계별 완벽실습을 통한--김형수
제1부 HTML, CSS, JAVA Script
제1장 HTML 기초
제2장 색상, 목록 태그
제3장 멀티미디어 처리
제4장 하이퍼링크
제5장 표와 프레임
제6장 폼과 스타일시트
제7장 JAVA Script
제2부 PHP, MySQL, APM
제1장 PHP 기본
제2장 자료형
제3장 제어문
제4장 배열과 객체
제5장 내장함수
제6장 MySQL 명령
제7장 PHP와 MySQL 연동
제8장 APM 활용
참고문헌
찾아보기
웹(web) 프로그래머 공부 추천좀
HTML5 + CSS + 자바스크립터 + J쿼리 따로 책을 사서 공부해야 할지
다음책중에 사서 공부해야할지 추천 바랍니다.(2권만 골라주세요)
----다음중 2권만 선택좀 혹은 1권만-----
((1번책))--인터랙티브 웹디자인북 웹디자이너를 위한 HTML5 + CSS3 + jQuery 사용설명서--최성일
CHAPTER 1. 왜 인터랙티브 웹인가?
__1.1 새로운 변화의 바람, HTML5
__1.2 HTML5의 상용화는 과연 언제?
__1.3 넘을 수 없는 4차원의 벽, JavaScript
__1.4 JavaScript vs jQuery
__1.5 작업환경 설정하기
__1.6 예제 작업을 위한 템플릿 폴더 구조 및 파일 만들기
CHAPTER 2. HTML5, CSS3, jQuery 필수 구문 정리
__SECTION 1 HTML5의 새로운 태그
__SECTION 2 〈video〉 태그
__SECTION 3 nth-child( )
__SECTION 4 text-shadow, box-shadow
__SECTION 5 border-radius
__SECTION 6 gradient
__SECTION 7 background-size
__SECTION 8 box-sizing
__SECTION 9 transform(2d 변형)
__SECTION 10 transform(3d 변형)
__SECTION 11 transition
__SECTION 12 animation
__SECTION 13 mediaquery
__SECTION 14 구글 웹 폰트
__SECTION 15 웹 폰트 아이콘
__SECTION 16 jQuery 선택자
__SECTION 17 .css( )
__SECTION 18 .attr( )
__SECTION 19 jQuery 탐색 구문
__SECTION 20 이벤트 연결하기
__SECTION 21 .animate( )
__SECTION 22 변수
_SECTION 23 문자열, 숫자
_SECTION 24 연산자
_SECTION 25 조건문(if문)
_SECTION 26 반복문(for문)
_SECTION 27 $(this)
_SECTION 28 .index( )
_SECTION 29 .width( ), .height( )
_SECTION 30 .hide( ), .show( ), .fadeout( ), .fadeIn( )
_SECTION 31 .addClass( ), .removeClass( )
_SECTION 32 .text( )
_SECTION 33 .html( )
_SECTION 34 e.pageX, e.pageY
_SECTION 35 .scrollTop( )
_SECTION 36 .offset( ).top
_SECTION 37 .load( ), .play( ), .pause( )
_SECTION 38 new Date( )
_SECTION 39 setInterval( )
_SECTION 40 mousewheel.js
CHAPTER 3. 실전 예제 작업하기
__SECTION 1배경 동영상을 활용한 웹 페이지
____1.1 예제 둘러보기
____1.2 Step by Step
____1.3 DESIGNER’s INTERVIEW
__SECTION 2화면의 폭에 따라 변화는 웹 레이아웃(반응형 웹)
____2.1 예제 둘러보기
____2.2 Step by Step
____2.3 DESIGNER’s INTERVIEW
__SECTION 3입체적으로 회전하는 웹 레이아웃
____3.1 예제 둘러보기
____3.2 Step by Step
____3.3 DESIGNER’s INTERVIEW
__SECTION 4마우스 오버 시, 동영상이 재생되는 콘텐츠 박스
____4.1 예제 둘러보기
____4.2 Step by Step
____4.3 DESIGNER’s INTERVIEW
__SECTION 5마우스 움직임에 따라 제어되는 이미지 시퀀스
____5.1 예제 둘러보기
____5.2 Step by Step
____5.3 DESIGNER’s INTERVIEW
__SECTION 6시간에 따라 달라지는 웹 디자인
____6.1 예제 둘러보기
____6.2 Step by Step
____6.3 DESIGNER’s INTERVIEW
__SECTION 7마우스 휠의 움직임에 따라 스크롤되는 웹 페이지
____7.1 예제 둘러보기
____7.2 Step by Step
____7.3 DESIGNER’s INTERVIEW
SECTION 8가로로 스크롤되는 갤러리 페이지
____8.1 예제 둘러보기
____8.2 Step by Step
____8.3 DESIGNER’s INTERVIEW
SECTION 9 z축으로 스크롤되는 웹 페이지
____9.1 예제 둘러보기
____9.2 Step by Step
____9.3 DESIGNER’s INTERVIEW
((2번책))--개발자가 되고 싶으세요? IT 입문 지식을 말하다--고종범, 김미진, 윤성열, 이상민, 이재근
1부_인터넷
1장 웹은 어떻게 동작하는 걸까?
웹이란 도대체 무엇일까?
웹 서비스를 왜 개발하나요? 사람들은 웹을 왜 사용하나요?
웹 서비스 환경 준비, 웹 서버
브라우저에 표시되는 웹 페이지의 정체, 웹의 구성요소들
웹을 위한 기초적이지만 필수적인 기술들 - JavaScript, CSS
기술의 발전, 웹을 위한 더 확장된 기술들 ? ASP, JSP, PHP
갑자기 너무 어려워요…… 이런 것들을 왜 사용하는 거죠?
웹2.0과 HTML5, 웹의 재도약
파편화와 크로스 브라우징(Cross Browsing)
웹 서비스에 멋진 이름을 붙여보자, 도메인
웹 서비스를 만들어 보자
웹 개발 분야의 전문가가 되려면?
정리하며
2장 요즘은 모바일이 대세라던데…
모바일 앱의 다양한 형태
네이티브 앱이 대체 뭔가요
모바일 웹은 뭐죠? 웹은 알겠는데…
그렇다면 도대체 하이브리드(Hybrid) 앱은 뭐지?
이제 앱 개발은 어떻게 해야 하나요?
안드로이드 앱 개발도구
아이폰 앱 개발 도구
앱 개발 과정
앱 개발 시 유의해야 할 사항들
다양한 크기의 모바일 기기, 어떻게 처리하나?
가로/세로 모드의 지원
태블릿 화면의 지원
플랫폼 별 UI의 특징을 구분해 사용하자
모바일 분야의 전문가가 되려면?
정리하며
2부_소프트웨어 개발 프로세스
3장 소프트웨어 개발 과정을 알고 싶어요
아이템 선정: 우선 무엇을 만들지 정해야겠지?
요구사항 분석: 자, 그럼 진지하게 생각해보자구!
설계: 어둠을 욕하기보다 촛불 하나 켜는 게 낫다
구현: 아쉽게도 컴퓨터는 그림을 못 알아먹는다
테스트: 재대로 만들었을까?
배포: 고객님들이 사용하실 수 있도록!
정리하며
4장. 그냥 제가 기획서 드리면 뚝딱 만들어지는 거 아닌가요?
그냥 말 그대로 ‘요구하는 사항’ 아니야?
요구사항 도출, 해보니까 끝이 없던데…
진짜로 이렇게 만들어 줄 수 있는 거 맞죠?
문서! 문서! 문서!
소설책 보다는 만화책이 읽기 쉽지
그림 그려보기
요구사항 분석은 계속되어야 한다. 쭈욱~
정리하며
5장. 이 그림들은 뭔가요? 흰 건 종이고, 까만 건…
설계란 무엇인가?
설계 대상에는 어떤 것이 있는가?
화면 설계, UX 설계하기
동작과 구조의 설계로 어플리케이션 설계하기
데이터 저장소 설계하기
네트워크, 시스템 구성 설계하기
요구사항이 변경되면 설계도 변경된다
설계 분야의 전문가가 되려면
정리하며
6장. 저도 테스트 잘 해요. (정말?)
테스트가 무엇이길래?
테스트는 어떻게 하나요?
테스트 케이스 만드는 방법
테스트에는 어떤 것들이 있나요?
코드를 만들면서 진행하는 단위 테스트
하나로 합쳐서 진행하는 통합 테스트
총체적 검사를 수행하는 시스템 테스트
품질을 확인하는 인수 테스트
테스트 분야의 전문가가 되려면?
정리하며
7장. 작은 프로그램 하나 만들 때에도 절차라는 게 필요하군요
시작은 창대하였으나 그 끝은 미약하리라?!
모든 일을 처리하는 데 필요한 프로세스
프로세스를 좌지우지하는 방법론
소프트웨어 개발 방법론의 종류
가장 대표적인 고전 개발 방법인 폭포수 모델
최근 인기가 많은 스크럼
나한테 맞는 개발 방법 찾기
정리하며
3부_프로그래밍
8장. 자바, 씨, 씨샵. 들어보긴 했는데
Programming Language(프로그래밍 언어)?
프로그래밍 언어의 종류는 많답니다
IT 분야의 분업화
프로그래밍은 어떤 작업을 수행하는 것일까?
Java 언어 구경하기
JavaScript로 프로그램을 직접 만들어 볼까요?
API는 개발자의 친구
정리하며
9장. 프로그래밍은 어떻게 하는 거에요? (기웃 기웃)
컴퓨터에는 숫자의 종류가 많답니다
어느 언어를 배우더라도 반드시 알아야 하는 내용
if … 만약에 …
정보들을 어디엔가 모아 두고 싶다면
for 루프와 while 반복 구문
프로그래밍 언어 종합 정리
정리하며
10장. 프레임워크, 도대체 그게 뭔지…
프레임워크가 무엇인가요?
프레임워크를 반드시 사용해야 하는가?
프레임워크에는 어떤 것들이 있나요?
웹 어플리케이션 프레임워크
모바일 어플리케이션 프레임워크
프레임워크를 직접 만들 수는 없을까?
개발 분야의 전문가가 되려면?
정리하며
4부_데이터 저장소
11장. 저장은 그냥 파일에 하면 되는 거 아닌가요?
데이터베이스란 무엇일까?
DB의 구성요소
검색 시스템
도서 관리 시스템 - 새로운 책의 추가, 삭제 그리고 수정
테이블간의 릴레이션
정규화
데이터베이스 암호화
데이터베이스 분야의 전문가가 되려면?
정리하며
토막 칼럼 | “데이터베이스 개발자는 이것을 주의해야 한다”
12장. 우리회사도 빅데이터 한다는데~
빅데이터의 사용
NoSQL?
NoSQL의 역사
NoSQL의 아키텍처
NoSQL은 단점이 없을까?
빅데이터를 분석하려면 툴이 필요하다
전문가들은 빅데이터를 어떻게 분석할까
빅데이터의 본질
부록 A. 도메인부터 웹 서비스 동작과정까지
부록 B. 플레이 프레임워크
부록 C. 어플리케이션 프레임워크 - 스프링
부록 D. 프론트엔드 프레임워크 - 부트스트랩과 jQuery
((3번책))--HTML5+CSS3 실무테크닉--김은기
Part 1 HTML5의 기초 다지기
Lesson 01 웹 브라우저의 언어, HTML5
HTML의 개념
HTML5의 개념
HTML5의 주요 기능
Lesson 02 웹 스타일을 책임지는 스타일시트, CSS3
스타일시트(CSS)의 개념
업그레이드된 CSS3
CSS3 주요 기능
HTML5와 CSS3를 지원하는 웹 브라우저
Lesson 03 웹 페이지를 새롭게 만드는 자바스크립트(JavaScript)
자바스크립트 소스
자바스크립트의 매력
Lesson04 HTML5, CSS3, JavaScript의 상관관계
HTML5, CSS3, JavaScript
웹 문서 작성 시 지켜야 할 규칙
Lesson 05 학습을 위한 준비
브래킷
웹 브라우저, 크롬
웹 사이트에서 샘플 다운로드하기
Part 2 HTML5 태그 정복하기
Lesson 01 HTML 기본 구조 들여다보기
HTML5의 기본 구조
HTML 태그의 특징
HTML 문서 연습하기
Lesson 02 웹 사이트의 안내자 〈meta〉 태그
〈head〉 태그 속의 〈meta〉 태그
문서의 문자 셋 선언하기
시간 설정하여 자동으로 페이지 이동하기
Lesson 03 HTML5 시멘틱 구조 태그
시멘틱 웹의 개념
제목 크기를 조절하는 〈h1〉~〈h6〉 태그
구획 정의를 위한 태그
Lesson 04 똑똑한 비서, 정리 태그 알아보기
〈br〉 태그 vs. 〈p〉 태그
수평선을 긋는 〈hr〉 태그
입력한 형태 그대로 보여주는 〈pre〉 태그
〈div〉와 〈span〉 태그
Lesson05 보기 좋은 목록을 만드는 태그
목록 만드는 태그
계층 구조를 만드는 〈dl〉 태그
Lesson 06 타이포에 마술을 거는 태그
글자 스타일을 바꾸는 태그
글자 위의 주석, 루비 글자 태그
특수 문자 입력하기
Lesson 07 웹 문서를 재미있게 꾸미는 태그
이미지를 삽입하는 〈img〉 태그
이미지 크기 지정하기
상대 경로와 절대 경로
웹 문서 속의 웹 문서 〈iframe〉
멀티미디어를 삽입하는 〈embed〉 태그
〈audio〉와 〈video〉 태그
동영상을 자동 재생하고 반복하기
이미지맵을 설정하는 〈map〉 태그
Lesson 08 깔끔한 웹 문서의 필수품, Table
〈table〉의 기본 태그
테이블로 문서 편집하기
가로, 세로 내 마음대로 셀 합치기
테이블 안에 아기 테이블 넣기
Lesson 09 웹 공간을 마음대로 헤엄치는 하이퍼링크
URL로 하이퍼링크 연결하기
하나의 문서 안에서 특정 위치로 이동하기
하이퍼링크로 할 수 있는 다양한 것
Lesson 10 폼(form)으로 방문자와 대화하기
server-side를 처리하기 위한 〈form〉
〈form〉 안에 사용되는 입력 양식
HTML5 〈input〉 태그
Lesson 11 HTML5에서 더 이상 지원하지 않는 태그
HTML5에서 지원하는 태그
HTML5에서 새로 지원하는 태그
Part 3 CSS 기초 이해하기
Lesson 01 나만의 스타일을 만드는 CSS3
스타일시트의 개념
스타일시트의 매력
Lesson 02 스타일시트를 적용하는 여러 가지 방법
외부 문서에서 연결하기(linked Style)
문서 내부에 정의하기(Embedded Style)
태그에 직접 정의하기(Inline Style)
Lesson 03 기초부터 알아보는 스타일시트
스타일시트 기본 형식
특정 태그에 스타일 지정하기
그룹으로 만든 태그에 스타일 지정하기
하위 태그에 스타일 지정하기
클래스 이용하기
아이디(ID) 이용하기
Lesson 04 배경을 꾸미는 스타일시트
배경 색상 바꾸기(background-color)
배경 그림 바꾸기(background-image)
반복되는 배경 그림 바꾸기(background-repeat)
배경 그림의 스크롤 지정하기(background-attachment)
배경 그림의 위치 지정하기(background-position)
배경 그림의 속성을 한 번에 지정하기(background)
Lesson 05 테두리를 폼 나게 꾸미는 스타일시트
테두리 형태 지정하기(border-style)
테두리의 색상 지정하기(border-color)
테두리의 두께 지정하기(border-방향-width)
테두리의 두께를 한 번에 지정하기(border-width)
Lesson 06 세련미를 풍기는 박스 여백
바깥 여백 지정하기(margin-방향)
바깥 여백 한 번에 지정하기(margin)
안쪽 여백 지정하기(padding-방향)
문단의 위치와 폭, 높이 지정하기
Lesson 07 다양한 글씨를 표현하는 스타일시트
글자 색상 바꾸기(color)
글꼴 지정하기(font-family)
글자 형태 지정하기(font-style)
글자 굵기 지정하기(font-weight)
글자 크기 지정하기(font-size)
글자 속성 한 번에 지정하기(font)
Lesson 08 문자와 문단을 꾸미는 스타일시트
자간 지정하기(letter-spacing)
단어 간격 지정하기(word-spacing)
줄 간격 지정하기(line-height)
공백과 줄바꿈 지정하기(white-space)
Lesson 09 내 마음대로 문서를 꾸미는 스타일시트
문단 들여쓰기 지정하기(text-indent)
글자에 밑줄 긋기(text-decoration)
영문자의 대/소문자 속성(text-transform)
Lesson 10 목록을 꾸미는 스타일시트
목록의 머리 기호 바꾸기(list-style-type)
그림으로 목록의 머리 기호 만들기(list-style-image)
목록의 들여쓰기 지정하기(list-style-position)
Lesson 11 하이퍼링크를 꾸미는 스타일시트
하이퍼링크 색상과 밑줄 표시하기
한 문서에 여러 가지 하이퍼링크 스타일 적용하기
Lesson 12 여러 개의 스타일을 동시에 적용하기
Part 4 업그레이드된 CSS3 살펴보기
Lesson 01 CSS3 살짝 맛보기
CSS3 접두어
Lesson 02 테두리 속성, border
다양해진 테두리 효과
테두리를 둥글게 만들기(border-radius)
테두리에 그림자 만들기(box-shadow)
테두리에 이미지 사용하기(border-image)
Lesson 03 배경 이미지 속성, background
배경 이미지 크기 지정하기(background-size)
배경 이미지 위치 지정하기(background-origin)
배경 이미지 여러 개 지정하기(background)
Lesson 04 그레이디언트 속성, gradient
선형 그레이디언트 주기(linear-gradient)
선형 그레이디언트에 방향 주기(linear-gradient)
선형 그레이디언트에 여러 개의 색상 주기(linear-gradient)
선형 그레이디언트에 투명도 주기(linear-gradient)
선형 그레이디언트 반복하기(linear-gradient)
방사형 그레이디언트 만들기(radial-gradient)
방사형 그레이디언트에 모양 주기(radial-gradient)
방사형 그레이디언트에 크기와 위치 지정하기(radial-gradient)
방사형 그레이디언트 반복하기(radial-gradient)
Lesson 05 텍스트와 관련된 여러 가지 속성
Text Shadow
Word Wrapping
Lesson 06 CSS3를 이용한 간단한 애니메이션
animation 정의하기
@keyframe을 이용하여 Animation의 중간 상태 기술하기
Lesson 07 위치, 모양, 크기를 내 맘대로, transform
transform 사용하기
Lesson 08 애니메이션 속도를 제어하는 transition
transition 사용하기
Lesson 09 사용자 인터페이스(Basic User Interface) 만들기
Resizing
Box Sizing
Outline Offset
Multi-column
Part 5 반응형 웹 디자인과 부트스트랩
Lesson 01 반응형 웹 디자인 이해하기
반응형 웹 디자인의 개념
반응형 웹 사이트
반응형 웹 디자인이 적용된 경우
반응형 웹 디자인을 위한 브레이크 포인트
Lesson 02 웹 디자인 레이아웃을 위한 그리드 시스템
그리드 시스템의 기능
그리드 시스템 참조 사이트
정적, 동적, 반응형 그리드 시스템
Lesson 03 float과 display로 3단 레이아웃 만들기
float로 만든 3단 레이아웃
display:table-cell로 만든 3단 레이아웃
Lesson 04 미디어 타입과 미디어 쿼리
미디어 타입
미디어 쿼리
미디어 쿼리의 문법
Lesson 05 반응형 웹 디자인 따라하기
브레이크 포인트
가변 그리드 패턴
단 드롭 패턴
레이아웃 시프터 패턴
작은 변화 패턴
오프 캔버스 패턴
Lesson 06 이전 웹 브라우저에서 HTML5 사용하기
사람들은 어떤 웹 브라우저를 많이 사용할까?
웹 브라우저 버전에 따른 HTML5 사용하기
IE7 미만에서 HTML 및 CSS 엘리먼트, 투명 PNG 지원하기
Lesson 07 트위터의 오픈 소스, 부트스트랩
부트스트랩의 특징
부트스트랩 다운로드
부트스트랩 기본 문서 템플릿
그리드 시스템
테이블
폼과 버튼
기타 다양하게 제공되는 CSS
다양한 컴포넌트
반응형 디자인
커스터마이징
Part 6 따라해보는 실무 예제 및 템플릿
Lesson 01 따라하기 전 준비 사항
Lesson 02 가장 많이 사용하는 드롭다운 상단 메뉴
Lesson 03 펼쳐지고 접혀지는 아코디언 메뉴
Lesson 04 그룹화시켜 보여주는 탭 메뉴
Lesson 05 CSS를 이용한 아이콘 버튼
Lesson 06 여러 가지 이미지를 보여주는 이미지 슬라이더
Lesson 07 동영상을 컨트롤하는 동영상 플레이어
Lesson 08 실무에서 바로 써먹는 웹 사이트 템플릿
웹 사이트의 기초 설계
Top Menu & Footer
Main Page
Photo Gallery
Movie Gallery
About
Contact
((4번책))--웹프로그래밍 완성 단계별 완벽실습을 통한--김형수
제1부 HTML, CSS, JAVA Script
제1장 HTML 기초
제2장 색상, 목록 태그
제3장 멀티미디어 처리
제4장 하이퍼링크
제5장 표와 프레임
제6장 폼과 스타일시트
제7장 JAVA Script
제2부 PHP, MySQL, APM
제1장 PHP 기본
제2장 자료형
제3장 제어문
제4장 배열과 객체
제5장 내장함수
제6장 MySQL 명령
제7장 PHP와 MySQL 연동
제8장 APM 활용
참고문헌
찾아보기
