Enviar búsqueda
Cargar
웹프로그래밍 트랙소개
•
58 recomendaciones
•
7,949 vistas
지수 윤
Seguir
NEXT에서 배우는 웹프로그래밍을 이론과 실습을 통해서 이해합니다.
Leer menos
Leer más
Software
Denunciar
Compartir
Denunciar
Compartir
1 de 68
Descargar ahora
Descargar para leer sin conexión
Recomendados
비 개발자를 위한 웹 개발 기초
비 개발자를 위한 웹 개발 기초
Gihyo Joshua Jang
Building Backlinks
Building Backlinks
Bruce Jones
Web development
Web development
RaziyaChoudhary
The difference between ux and ui design
The difference between ux and ui design
Shweta Joshi
Core Web Vitals and SEO: Don't Panic. Improve.
Core Web Vitals and SEO: Don't Panic. Improve.
Ian Lurie
UX Design Myths
UX Design Myths
Evan Samek
Why Progressive Web App is what you need for your Business
Why Progressive Web App is what you need for your Business
Lets Grow Business
Web designing
Web designing
Divya Uppal
Recomendados
비 개발자를 위한 웹 개발 기초
비 개발자를 위한 웹 개발 기초
Gihyo Joshua Jang
Building Backlinks
Building Backlinks
Bruce Jones
Web development
Web development
RaziyaChoudhary
The difference between ux and ui design
The difference between ux and ui design
Shweta Joshi
Core Web Vitals and SEO: Don't Panic. Improve.
Core Web Vitals and SEO: Don't Panic. Improve.
Ian Lurie
UX Design Myths
UX Design Myths
Evan Samek
Why Progressive Web App is what you need for your Business
Why Progressive Web App is what you need for your Business
Lets Grow Business
Web designing
Web designing
Divya Uppal
Backend Programming
Backend Programming
Ruwandi Madhunamali
Ecommerce Mini Project / Group Project Design
Ecommerce Mini Project / Group Project Design
Hemant Sarthak
Bài 3: Servlet&Cookie&Session - Lập Trình Mạng Nâng Cao
Bài 3: Servlet&Cookie&Session - Lập Trình Mạng Nâng Cao
Tuan Nguyen
ppt of web development for diploma student
ppt of web development for diploma student
Abhishekchauhan863165
Taller UX: Tests de usabilidad
Taller UX: Tests de usabilidad
IxDA Mendoza
Php
Php
WAHEEDA ROOHILLAH
PHP Project PPT
PHP Project PPT
Pankil Agrawal
Introduction to web development
Introduction to web development
Mohammed Safwat
User Experience UX Design (Thai mixed with English)
User Experience UX Design (Thai mixed with English)
Mayuree Srikulwong
Soap and Rest
Soap and Rest
Edison Lascano
Website Introduction
Website Introduction
tmm13
1-01: Introduction To Web Development
1-01: Introduction To Web Development
apnwebdev
Make your own Pokédex with the Pokéapi & Node/Express!
Make your own Pokédex with the Pokéapi & Node/Express!
Autodesk
Web application presentation
Web application presentation
Ehsan Ullah Kakar
Express js
Express js
Manav Prasad
Web Development and Web Development technologies - Temitayo Fadojutimi
Web Development and Web Development technologies - Temitayo Fadojutimi
Temitayo Fadojutimi
Why User Experience Matters | By UX Professionals from Centerline Digital
Why User Experience Matters | By UX Professionals from Centerline Digital
Centerline Digital
online music store
online music store
swatikandoi
Core Web Vitals - Why You Need to Pay Attention
Core Web Vitals - Why You Need to Pay Attention
TAC Marketing Group
Automated SEO proposal
Automated SEO proposal
ReportGarden
[PreSchool-1] 프로그래밍 '개념' 맛보기
[PreSchool-1] 프로그래밍 '개념' 맛보기
Young-Ho Cho
HTTP/2 Comes to Java
HTTP/2 Comes to Java
David Delabassee
Más contenido relacionado
La actualidad más candente
Backend Programming
Backend Programming
Ruwandi Madhunamali
Ecommerce Mini Project / Group Project Design
Ecommerce Mini Project / Group Project Design
Hemant Sarthak
Bài 3: Servlet&Cookie&Session - Lập Trình Mạng Nâng Cao
Bài 3: Servlet&Cookie&Session - Lập Trình Mạng Nâng Cao
Tuan Nguyen
ppt of web development for diploma student
ppt of web development for diploma student
Abhishekchauhan863165
Taller UX: Tests de usabilidad
Taller UX: Tests de usabilidad
IxDA Mendoza
Php
Php
WAHEEDA ROOHILLAH
PHP Project PPT
PHP Project PPT
Pankil Agrawal
Introduction to web development
Introduction to web development
Mohammed Safwat
User Experience UX Design (Thai mixed with English)
User Experience UX Design (Thai mixed with English)
Mayuree Srikulwong
Soap and Rest
Soap and Rest
Edison Lascano
Website Introduction
Website Introduction
tmm13
1-01: Introduction To Web Development
1-01: Introduction To Web Development
apnwebdev
Make your own Pokédex with the Pokéapi & Node/Express!
Make your own Pokédex with the Pokéapi & Node/Express!
Autodesk
Web application presentation
Web application presentation
Ehsan Ullah Kakar
Express js
Express js
Manav Prasad
Web Development and Web Development technologies - Temitayo Fadojutimi
Web Development and Web Development technologies - Temitayo Fadojutimi
Temitayo Fadojutimi
Why User Experience Matters | By UX Professionals from Centerline Digital
Why User Experience Matters | By UX Professionals from Centerline Digital
Centerline Digital
online music store
online music store
swatikandoi
Core Web Vitals - Why You Need to Pay Attention
Core Web Vitals - Why You Need to Pay Attention
TAC Marketing Group
Automated SEO proposal
Automated SEO proposal
ReportGarden
La actualidad más candente
(20)
Backend Programming
Backend Programming
Ecommerce Mini Project / Group Project Design
Ecommerce Mini Project / Group Project Design
Bài 3: Servlet&Cookie&Session - Lập Trình Mạng Nâng Cao
Bài 3: Servlet&Cookie&Session - Lập Trình Mạng Nâng Cao
ppt of web development for diploma student
ppt of web development for diploma student
Taller UX: Tests de usabilidad
Taller UX: Tests de usabilidad
Php
Php
PHP Project PPT
PHP Project PPT
Introduction to web development
Introduction to web development
User Experience UX Design (Thai mixed with English)
User Experience UX Design (Thai mixed with English)
Soap and Rest
Soap and Rest
Website Introduction
Website Introduction
1-01: Introduction To Web Development
1-01: Introduction To Web Development
Make your own Pokédex with the Pokéapi & Node/Express!
Make your own Pokédex with the Pokéapi & Node/Express!
Web application presentation
Web application presentation
Express js
Express js
Web Development and Web Development technologies - Temitayo Fadojutimi
Web Development and Web Development technologies - Temitayo Fadojutimi
Why User Experience Matters | By UX Professionals from Centerline Digital
Why User Experience Matters | By UX Professionals from Centerline Digital
online music store
online music store
Core Web Vitals - Why You Need to Pay Attention
Core Web Vitals - Why You Need to Pay Attention
Automated SEO proposal
Automated SEO proposal
Destacado
[PreSchool-1] 프로그래밍 '개념' 맛보기
[PreSchool-1] 프로그래밍 '개념' 맛보기
Young-Ho Cho
HTTP/2 Comes to Java
HTTP/2 Comes to Java
David Delabassee
[Ignite]실용주의 프로그래머
[Ignite]실용주의 프로그래머
qoeldeld
Spring 웹 프로젝트 시작하기
Spring 웹 프로젝트 시작하기
jiseob kim
스프링 프레임워크로 블로그 개발하기
스프링 프레임워크로 블로그 개발하기
라한사 아
간단한 블로그를 만들며 Django 이해하기
간단한 블로그를 만들며 Django 이해하기
Kyoung Up Jung
자바 웹 개발 시작하기 (1주차 : 웹 어플리케이션 체험 실습)
자바 웹 개발 시작하기 (1주차 : 웹 어플리케이션 체험 실습)
DK Lee
더 빠른 웹을 위해: HTTP/2
더 빠른 웹을 위해: HTTP/2
EungJun Yi
Deview-2014-자신있는개발자에서 훌륭한개발자로
Deview-2014-자신있는개발자에서 훌륭한개발자로
Minsuk Lee
Sync async-blocking-nonblocking-io
Sync async-blocking-nonblocking-io
Cheoloh Bae
Java/Spring과 Node.js의공존
Java/Spring과 Node.js의공존
동수 장
SpringMVC 전체 흐름 알아보기
SpringMVC 전체 흐름 알아보기
Myung Woon Oh
Destacado
(12)
[PreSchool-1] 프로그래밍 '개념' 맛보기
[PreSchool-1] 프로그래밍 '개념' 맛보기
HTTP/2 Comes to Java
HTTP/2 Comes to Java
[Ignite]실용주의 프로그래머
[Ignite]실용주의 프로그래머
Spring 웹 프로젝트 시작하기
Spring 웹 프로젝트 시작하기
스프링 프레임워크로 블로그 개발하기
스프링 프레임워크로 블로그 개발하기
간단한 블로그를 만들며 Django 이해하기
간단한 블로그를 만들며 Django 이해하기
자바 웹 개발 시작하기 (1주차 : 웹 어플리케이션 체험 실습)
자바 웹 개발 시작하기 (1주차 : 웹 어플리케이션 체험 실습)
더 빠른 웹을 위해: HTTP/2
더 빠른 웹을 위해: HTTP/2
Deview-2014-자신있는개발자에서 훌륭한개발자로
Deview-2014-자신있는개발자에서 훌륭한개발자로
Sync async-blocking-nonblocking-io
Sync async-blocking-nonblocking-io
Java/Spring과 Node.js의공존
Java/Spring과 Node.js의공존
SpringMVC 전체 흐름 알아보기
SpringMVC 전체 흐름 알아보기
Similar a 웹프로그래밍 트랙소개
1주 WEB UI Overview
1주 WEB UI Overview
지수 윤
[PyConKR 2014] 30분만에 따라하는 동시성 스크래퍼
[PyConKR 2014] 30분만에 따라하는 동시성 스크래퍼
Cheol Kang
웹을 지탱하는 기술
웹을 지탱하는 기술
JungHyuk Kwon
웹을 지탱하는 기술
웹을 지탱하는 기술
정혁 권
웹 크롤링 (Web scraping) 의 이해
웹 크롤링 (Web scraping) 의 이해
2minchul
Web hacking introduction
Web hacking introduction
Jinkyoung Kim
Semantic web
Semantic web
우일 권
Spring 4.x Web Application 살펴보기
Spring 4.x Web Application 살펴보기
Ji Heon Kim
MongoDB 도입을 위한 제언
MongoDB 도입을 위한 제언
DongHan Kim
MongoDB 도입을 위한 제언 @krmug
MongoDB 도입을 위한 제언 @krmug
Ha-Yang(White) Moon
HeadFisrt Servlet&JSP Chapter 1
HeadFisrt Servlet&JSP Chapter 1
J B
Servlet&jsp 1장
Servlet&jsp 1장
JeongBong Kim
안드로이드 OAuth 1.0a, 2.0 구현 - Naver, Google API
안드로이드 OAuth 1.0a, 2.0 구현 - Naver, Google API
Gosu Ok
H3 2011 반응형 웹디자인,진짜 할 만 한가?_Fi팀_신현석
H3 2011 반응형 웹디자인,진짜 할 만 한가?_Fi팀_신현석
KTH, 케이티하이텔
H3 2011 반응형 웹디자인, 진짜 할 만 한가?
H3 2011 반응형 웹디자인, 진짜 할 만 한가?
KTH
[D2 CAMPUS]웹 개발자의 스펙 : HTTP
[D2 CAMPUS]웹 개발자의 스펙 : HTTP
NAVER D2
my activities before getting a job
my activities before getting a job
Deo Kim
Web App Security 2015.10
Web App Security 2015.10
Chanjin Park
REST API 설계
REST API 설계
Terry Cho
Future Web and WoT(Web of Things)
Future Web and WoT(Web of Things)
Jonathan Jeon
Similar a 웹프로그래밍 트랙소개
(20)
1주 WEB UI Overview
1주 WEB UI Overview
[PyConKR 2014] 30분만에 따라하는 동시성 스크래퍼
[PyConKR 2014] 30분만에 따라하는 동시성 스크래퍼
웹을 지탱하는 기술
웹을 지탱하는 기술
웹을 지탱하는 기술
웹을 지탱하는 기술
웹 크롤링 (Web scraping) 의 이해
웹 크롤링 (Web scraping) 의 이해
Web hacking introduction
Web hacking introduction
Semantic web
Semantic web
Spring 4.x Web Application 살펴보기
Spring 4.x Web Application 살펴보기
MongoDB 도입을 위한 제언
MongoDB 도입을 위한 제언
MongoDB 도입을 위한 제언 @krmug
MongoDB 도입을 위한 제언 @krmug
HeadFisrt Servlet&JSP Chapter 1
HeadFisrt Servlet&JSP Chapter 1
Servlet&jsp 1장
Servlet&jsp 1장
안드로이드 OAuth 1.0a, 2.0 구현 - Naver, Google API
안드로이드 OAuth 1.0a, 2.0 구현 - Naver, Google API
H3 2011 반응형 웹디자인,진짜 할 만 한가?_Fi팀_신현석
H3 2011 반응형 웹디자인,진짜 할 만 한가?_Fi팀_신현석
H3 2011 반응형 웹디자인, 진짜 할 만 한가?
H3 2011 반응형 웹디자인, 진짜 할 만 한가?
[D2 CAMPUS]웹 개발자의 스펙 : HTTP
[D2 CAMPUS]웹 개발자의 스펙 : HTTP
my activities before getting a job
my activities before getting a job
Web App Security 2015.10
Web App Security 2015.10
REST API 설계
REST API 설계
Future Web and WoT(Web of Things)
Future Web and WoT(Web of Things)
Más de 지수 윤
HTML,CSS Next
HTML,CSS Next
지수 윤
코드스쿼드 마스터즈세미나 - UI개발자가돼보자
코드스쿼드 마스터즈세미나 - UI개발자가돼보자
지수 윤
Clean Front-End Development
Clean Front-End Development
지수 윤
개발자를 알아보자.
개발자를 알아보자.
지수 윤
재사용UI 컴포넌트설계
재사용UI 컴포넌트설계
지수 윤
Front-End 개발의 괜찮은 선택 ES6 & React
Front-End 개발의 괜찮은 선택 ES6 & React
지수 윤
WEB Front-End 개발과정 살펴보기
WEB Front-End 개발과정 살펴보기
지수 윤
크로스브라우징
크로스브라우징
지수 윤
재사용가능한 서비스코드제작
재사용가능한 서비스코드제작
지수 윤
WEBUI Advanced중간시험
WEBUI Advanced중간시험
지수 윤
비동기와 이벤트큐 수업자료
비동기와 이벤트큐 수업자료
지수 윤
JavaScript OOP Pattern
JavaScript OOP Pattern
지수 윤
JS특징(scope,this,closure)
JS특징(scope,this,closure)
지수 윤
JavaScript Debugging (수업자료)
JavaScript Debugging (수업자료)
지수 윤
JavaScript Debugging (동영상강의자료)
JavaScript Debugging (동영상강의자료)
지수 윤
CSS Layout
CSS Layout
지수 윤
더 나은 SW프로젝트를 위해
더 나은 SW프로젝트를 위해
지수 윤
9주 DOM & Event Advanced
9주 DOM & Event Advanced
지수 윤
7주 JavaScript Part2
7주 JavaScript Part2
지수 윤
7주 JavaScript Part1
7주 JavaScript Part1
지수 윤
Más de 지수 윤
(20)
HTML,CSS Next
HTML,CSS Next
코드스쿼드 마스터즈세미나 - UI개발자가돼보자
코드스쿼드 마스터즈세미나 - UI개발자가돼보자
Clean Front-End Development
Clean Front-End Development
개발자를 알아보자.
개발자를 알아보자.
재사용UI 컴포넌트설계
재사용UI 컴포넌트설계
Front-End 개발의 괜찮은 선택 ES6 & React
Front-End 개발의 괜찮은 선택 ES6 & React
WEB Front-End 개발과정 살펴보기
WEB Front-End 개발과정 살펴보기
크로스브라우징
크로스브라우징
재사용가능한 서비스코드제작
재사용가능한 서비스코드제작
WEBUI Advanced중간시험
WEBUI Advanced중간시험
비동기와 이벤트큐 수업자료
비동기와 이벤트큐 수업자료
JavaScript OOP Pattern
JavaScript OOP Pattern
JS특징(scope,this,closure)
JS특징(scope,this,closure)
JavaScript Debugging (수업자료)
JavaScript Debugging (수업자료)
JavaScript Debugging (동영상강의자료)
JavaScript Debugging (동영상강의자료)
CSS Layout
CSS Layout
더 나은 SW프로젝트를 위해
더 나은 SW프로젝트를 위해
9주 DOM & Event Advanced
9주 DOM & Event Advanced
7주 JavaScript Part2
7주 JavaScript Part2
7주 JavaScript Part1
7주 JavaScript Part1
웹프로그래밍 트랙소개
1.
! 웹
2.
프로그래밍
3.
트랙
4.
소개 윤 지 수
, N E X T
5.
! 본
6.
자료는
7.
NEXT
8.
Institute의
9.
‘소프트웨어개론’
10.
시간에
11.
12.
‘웹프로그래밍’트랙에
13.
대한
14.
소개
15.
강의
16.
자료
17.
입니다.
18.
! 웹프로그래밍이
19.
무엇인지
20.
알기
21.
위해
22.
간단한
23.
설명과
24.
뚝딱뚝딱
25.
실습이
26.
포함되어
27.
있습니다.
28.
목표 Web의
29.
기본개념을
30.
알아보고,
31.
32.
간단한
33.
Web개발경험을
34.
통해
35.
웹을
36.
이해한다.
37.
인터넷에
38.
연결된
39.
컴퓨터들을
40.
통해
41.
사람들이
42.
정보를
43.
공유
44.
할
45.
수
46.
있는
47.
전
48.
세계적인
49.
정보
50.
공간 인터넷에서
51.
HTTP
52.
프로토콜,
53.
하이퍼텍스트,
54.
HTML형식
55.
등을
56.
사용하여
57.
그림과
58.
문자,
59.
60.
멀티미디어를
61.
교환하는
62.
전송방식 출처
63.
http://en.wikipedia.org/wiki/World_Wide_Web Web
64.
?
65.
다양한
66.
자원(resource)이
67.
존재하는
68.
곳
69.
인터넷에
70.
연결된
71.
컴퓨터들을
72.
통해
73.
사람들이
74.
정보를
75.
공유
76.
할
77.
수
78.
있는
79.
전
80.
세계적인
81.
정보
82.
공간 인터넷에서
83.
HTTP
84.
프로토콜,
85.
하이퍼텍스트,
86.
HTML형식
87.
등을
88.
사용 하여
89.
그림과
90.
문자,
91.
92.
멀티미디어를
93.
교환하는
94.
전송방식 출처
95.
http://en.wikipedia.org/wiki/World_Wide_Web Web
96.
?
97.
다양한
98.
기술이
99.
사용되는
100.
곳
101.
우리가
102.
경험하고
103.
있는
104.
Web Desktop Mobile Tablet
SmartTV Browser “우리는
105.
다양한
106.
기기에
107.
포함되어
108.
있는
109.
Browser를
110.
통해
111.
112.
쉽게
113.
웹을
114.
경험하고
115.
있다”
116.
Web의
117.
동작 은행에서
118.
돈
119.
찾기 은행을
120.
찾아가서,
121.
나의
122.
계좌에서
123.
돈을
124.
빼
125.
달라고,
126.
출금
127.
요청서를
128.
작성한다.
129.
가야
130.
할
131.
주소가
132.
있어야하고,
133.
구체적인
134.
요청사항이
135.
있을
136.
수
137.
있고,
138.
약속된
139.
방식으로
140.
요청해야
141.
한다. 고객 은행 요청 응답
142.
Web의
143.
동작 은행에서
144.
돈
145.
찾기 은행을
146.
찾아가서,
147.
나의
148.
계좌에서
149.
돈을
150.
빼
151.
달라고,
152.
출금
153.
요청서를
154.
작성한다.
155.
http://www.bank.com/getMoney/?customNum=310313
156.
157.
http://www.bank.com/getMoney/?customNum=310313
158.
http://www.bank.com/getMoney/?customNum=310313
159.
client Server request response
160.
URI
161.
의
162.
구성
163.
Uniform
164.
Resource
165.
Indentifier http://www.bank.com/getMoney/?customNum=310313
166.
167.
http://www.bank.com/getMoney/?customNum=310313
168.
169.
http://www.bank.com/getMoney/?customNum=310313
170.
scheme(스키마)
171.
host
172.
name path와
173.
query
174.
string
175.
client
176.
Browser web
177.
server request response 1)
178.
특정
179.
URI로
180.
서버에
181.
접근하여
182.
resource를
183.
요청한다.
184.
2)
185.
Server에서는
186.
필요한
187.
정보가
188.
있는지
189.
서버의
190.
저장소를
191.
통해
192.
확인한다
193.
3)
194.
저장소에서
195.
추출한
196.
정보를
197.
Server가
198.
받아서
199.
client에게
200.
보내준다.
201.
4)
202.
Client는
203.
Server가
204.
보내준
205.
정보를
206.
받는다
207.
5)
208.
사용자가
209.
쉽게
210.
알아볼
211.
수
212.
있도록
213.
정해진
214.
UI의
215.
형태에
216.
맞게
217.
정보를
218.
보여준다.
219.
저장소 Server
220.
Side Web의
221.
흐름과
222.
필요기술들
223.
내가
224.
보낸
225.
요청이
226.
어떻게
227.
처리되나요?
228.
Web의
229.
흐름과
230.
필요기술들
231.
내가
232.
보낸
233.
요청이
234.
어떻게
235.
처리되나요? 1)
236.
특정
237.
URI로
238.
서버에
239.
접근하여
240.
resource를
241.
요청한다.
242.
현대의
243.
웹은
244.
HTTP라는
245.
protocol(통신규약)을
246.
사용해서
247.
웹의
248.
자원을
249.
요청
250.
Server는
251.
항상
252.
대기중인
253.
상태로
254.
실행
255.
중이어야
256.
함
257.
! 2)
258.
Server에서는
259.
필요한
260.
정보가
261.
있는지
262.
서버의
263.
저장소를
264.
통해
265.
확인한다
266.
정보는
267.
Database(DB)에
268.
보관되고
269.
있으며,
270.
271.
Server에서는
272.
DB에
273.
접근할
274.
수
275.
있는
276.
웹서버
277.
프로그래밍
278.
기술이
279.
필요
280.
! 3)
281.
저장소에서
282.
추출한
283.
정보를
284.
Server가
285.
받아서
286.
client에게
287.
보내준다.
288.
모든
289.
서버는
290.
Web표준에
291.
맞는
292.
response
293.
를
294.
보내줌.
295.
! 4)
296.
Client는
297.
Server가
298.
보내준
299.
정보를
300.
받는다
301.
HTTP통신을
302.
하는
303.
과정에서
304.
Browser는
305.
이를
306.
받아서
307.
처리
308.
할
309.
준비를
310.
하고
311.
있다.
312.
! 5)
313.
사용자가
314.
쉽게
315.
알아볼
316.
수
317.
있도록
318.
정해진
319.
UI의
320.
형태에
321.
맞게
322.
정보를
323.
보여준다.
324.
server에서
325.
보내준
326.
정보를
327.
분석하고
328.
이를
329.
화면에
330.
적절히
331.
보여주기
332.
위한
333.
Client
334.
프로그래밍이
335.
필요.
336.
WEB을
337.
이루는
338.
요소
339.
hardware software
340.
Desktop web
341.
Application
342.
server
343.
344.
Database Server
345.
Side web
346.
server web
347.
server web
348.
server SmartTV Mobile L4 web
349.
Application
350.
server
351.
352.
Database Client
353.
Side hardware
354.
355.
Server
356.
Side Software
357.
Client
358.
Side client요청과
359.
화면을
360.
구성하고
361.
만드는
362.
일
363.
Browser와
364.
렌더링
365.
엔진들
366.
Webkit,
367.
Andorid,
368.
Chrome,
369.
! 사용자에게
370.
보여줄
371.
화면을
372.
구성
373.
HTML,HTML5
374.
! 사용자에게
375.
보여줄
376.
화면에
377.
디자인
378.
요소를
379.
추가
380.
CSS,CSS3
381.
! 사용자가
382.
클릭하고,
383.
입력하는
384.
정보에
385.
반응하고,
386.
서버가
387.
보낸
388.
정 보를
389.
HTML에
390.
넣어주기
391.
Javascript Browser가
392.
요청한
393.
정보를
394.
받기.
395.
Client에필요한
396.
파일을
397.
내려주기
398.
Web
399.
Server
400.
401.
Apache,
402.
IIS
403.
! DB와
404.
연동하고,
405.
요청데이터를
406.
분석하고
407.
처리하는
408.
일
409.
Web
410.
Application
411.
Server
412.
(WAS)
413.
414.
415.
TOMCAT,
416.
Weblogic,
417.
JEUS
418.
! 서버에서
419.
동작하는
420.
프로그래밍
421.
언어
422.
JSP,
423.
CGI,
424.
Servlet,
425.
ASP,
426.
.NET,
427.
PHP,
428.
Python,Ruby
429.
! DB
430.
Oracle,
431.
MySQL,
432.
infomix
433.
WEB
434.
in
435.
NEXT HTML_JavaScript
436.
고급 Java
437.
Web
438.
프로그래밍
439.
고급 DB
440.
고급컴퓨터
441.
그래픽스 컴퓨터
442.
네트워크 SW
443.
아키텍팅 HTML5
444.
프로그래밍 Data
445.
Visualization HCI DB
446.
기본 HTML_JavaScript
447.
기본 Java
448.
Web
449.
프로그래밍
450.
기본 프로젝트 UI Server
451.
Python을
452.
활용해서
453.
웹
454.
프로그래밍을
455.
해봅시다.
456.
Python
457.
Based
458.
Web
459.
Programming
460.
Python은
461.
웹을
462.
위한
463.
용도보다
464.
웹서버의
465.
보조적인
466.
역활을
467.
하는
468.
경우가
469.
더
470.
많음.
471.
하지만
472.
Python은
473.
훌륭한
474.
웹
475.
프로그래밍을
476.
위한
477.
강력한
478.
것들을
479.
지원
480.
하고
481.
있음.
482.
! 실제로
483.
Python에는
484.
웹프로그래밍을
485.
위한
486.
다양한
487.
Web
488.
framework들이
489.
존재
490.
함.
491.
http://wiki.python.org/moin/WebFrameworks
492.
! ! 우리는
493.
그
494.
중
495.
가볍고
496.
강력한
497.
평가를
498.
받고
499.
있는
500.
Flask를
501.
선택.
502.
! Flask는,
503.
최신의
504.
웹
505.
기술을
506.
포함하고
507.
있으며,(Restful,
508.
noSQL
509.
연동
510.
등)
511.
자체적으로
512.
Web
513.
Server를
514.
포함하고
515.
있으며,
516.
디버깅을
517.
위한
518.
지원을
519.
하고
520.
있으며,
521.
Documentation(문서화)이
522.
잘
523.
되어
524.
있어
525.
구글링도
526.
잘
527.
됨.
528.
! python으로
529.
웹을?
530.
http://flask.pocoo.org/docs/
531.
할
532.
것. 웹을
533.
경험해보자
534.
!
535.
웹을
536.
경험해보자
537.
내
538.
컴에
539.
웹서버를
540.
설치
541.
할
542.
것.
543.
웹을
544.
경험해보자
545.
내
546.
컴에
547.
웹서버를
548.
설치
549.
Flask 할
550.
것.
551.
1)
552.
MAC
553.
에
554.
기본
555.
환경
556.
설정.
557.
2)
558.
Flask
559.
설치
560.
561.
3)
562.
구동
563.
!
564.
start
565.
!
566.
함
567.
해보기 [pip
568.
설치] $ sudo easy_install
pip $ sudo pip install Flask [Flask
569.
설치] http://flask.pocoo.org/docs/installation/#installation # 윈도우 환경은
아래 URL하단 부분 참조
570.
from flask import
Flask! app = Flask(__name__)! ! @app.route('/')! def index():! return 'Hello World!'! ! if __name__ == '__main__':! app.run(debug=True) hello.py
571.
$ python hello.py
572.
573.
http://127.0.0.1:5000/
574.
잠깐
575.
고찰.
576.
어떻게
577.
동작하는
578.
걸까..?
579.
방금
580.
우리가
581.
한
582.
것. CLIENT SERVER 주거니
583.
받거니
584.
방금
585.
우리가
586.
한
587.
것. CLIENT Request Response SERVER
588.
방금
589.
우리가
590.
한
591.
것. CLIENT Request Response SERVER Request
592.
웹은,
593.
요청을
594.
받아
595.
복잡한
596.
무언가
597.
처리를
598.
하고
599.
보기
600.
좋게
601.
보여주는
602.
것
603.
요청이라하면
604.
?
605.
http://127.0.0.1:5000/method?name=jisupassword=1234 이런
606.
요청이라던가
607.
main/main.nhn?mode=LSDmid=shmsid1=104http://news.naver.com/ 인터넷
608.
주소를
609.
통한
610.
다양한
611.
요청
612.
함
613.
해볼까요?
614.
http://127.0.0.1:5000/name/jisu
615.
from flask import
Flask! app = Flask(__name__)! ! @app.route('/')! def index():! return 'Hello World!'! ! @app.route('/name/username/')! def student(username):! return 'Hello %s' % username! ! if __name__ == '__main__':! app.run(debug=True) 추가
616.
잠깐
617.
고찰.
618.
이번엔
619.
어떻게
620.
동작하는
621.
걸까..?
622.
크롬
623.
개발자도구-Network
624.
탭을
625.
통해
626.
request확인
627.
비스무리한
628.
놈
629.
630.
하나
631.
더
632.
해봅시다
633.
http://127.0.0.1:5000/login 로그인하기
634.
635.
POST
636.
요청
637.
실습
638.
http://127.0.0.1:5000/login ID/PW
639.
입력
640.
후
641.
요청? 응 login.html ‘logged
642.
in’
643.
644.
출력 아니 ID/PW
645.
입력
646.
후
647.
다시요청
648.
from flask import
Flask, request, render_template! ! @app.route(‘/login’, methods=['POST','GET'])! def login():! return render_template('login.html')
649.
from flask import
Flask, request, render_template! ! @app.route(‘/login’, methods=['POST','GET'])! def login():! ! if request.method = 'GET':! ! return render_template('login.html')
650.
from flask import
Flask, request, render_template! ! @app.route(‘/login’, methods=['POST','GET'])! def login():! ! if request.method == ‘GET’:! ! return render_template(‘login.html')! ! else:! ! ! name = request.form[‘name’]! ! passwd = request.form[‘password’]! return ‘%s logged=in ‘ % name!
651.
form method=post action=/login! h1Login
Form Page/h1! input type=text name=name! input type=password name=password! input type=submit value=login! /form 1.
652.
hello.py파일
653.
있는
654.
위치에
655.
templates라는
656.
디렉토리
657.
새로
658.
생성 2.
659.
아래
660.
코드가
661.
포함된
662.
login.html
663.
소스파일
664.
새로
665.
생성해서
666.
templates에
667.
저장
668.
http://127.0.0.1:5000/login
669.
잠깐
670.
고찰.
671.
로그인
672.
어떻게
673.
하는걸까..?
674.
http://127.0.0.1:5000/ session
675.
정보? yes /login ‘welcome’
676.
677.
메시지 no /template/login.html /login login
678.
페이지
679.
처리
680.
로직
681.
redirect login
682.
정보확인(DB)
683.
session
684.
생성
685.
다양한
686.
클라이언트..
687.
다양한
688.
서버..
689.
! 약속은
690.
있을까?
691.
692.
서버와
693.
클라이언트의
694.
역할
695.
DBDesign 사용자 인터랙션 비즈니스로직 Client Server
696.
import java.io.*;! import java.util.*;! import
javax.servlet.*;! import javax.servlet.http.*;! import java.sql.*;! ! public class DatabaseAccess extends HttpServlet{! ! public void doGet(HttpServletRequest request,! HttpServletResponse response)! throws ServletException, IOException! {! // JDBC driver name and database URL! static final String JDBC_DRIVER=com.mysql.jdbc.Driver; ! static final String DB_URL=jdbc:mysql://localhost/TEST;! ! // Database credentials! static final String USER = root;! static final String PASS = password;! ! // Set response content type! response.setContentType(text/html);! PrintWriter out = response.getWriter();! String title = Database Result;! String docType =! !doctype html public -//w3c//dtd html 4.0 +! transitional//enn;! out.println(docType +! htmln +! headtitle + title + /title/headn +! body bgcolor=#f0f0f0n +! h1 align=center + title + /h1n);! try{! // Register JDBC driver! Class.forName(com.mysql.jdbc.Driver);! ! // Open a connection! conn = DriverManager.getConnection(DB_URL,USER,PASS);! ! // Execute SQL query! stmt = conn.createStatement();! String sql;! sql = SELECT id, first, last, age FROM Employees;! ResultSet rs = stmt.executeQuery(sql);! ! // Extract data from result set! while(rs.next()){! //Retrieve by column name! int id = rs.getInt(id);! int age = rs.getInt(age);! String first = rs.getString(first);! String last = rs.getString(last);! ! //Display values! 서버는
697.
698.
클라이언트와
699.
DB간의
700.
처리
701.
702.
! // Open a
connection! conn = DriverManager.getConnection(DB_URL,USER,PASS);! ! // Execute SQL query! stmt = conn.createStatement();! String sql;! sql = SELECT id, first, last, age FROM Employees;! ResultSet rs = stmt.executeQuery(sql);! ! // Extract data from result set! while(rs.next()){! //Retrieve by column name! int id = rs.getInt(id);! int age = rs.getInt(age);! String first = rs.getString(first);! String last = rs.getString(last);! ! //Display values! out.println(ID: + id + br);! out.println(, Age: + age + br);! out.println(, First: + first + br);! out.println(, Last: + last + br);! }! out.println(/body/html);! ! // Clean-up environment! rs.close();! stmt.close();! conn.close();! }catch(SQLException se){! //Handle errors for JDBC! se.printStackTrace();! }catch(Exception e){! //Handle errors for Class.forName! e.printStackTrace();! }finally{! //finally block used to close resources! try{! if(stmt!=null)! stmt.close();! }catch(SQLException se2){! }// nothing we can do! try{! if(conn!=null)! conn.close();! }catch(SQLException se){! se.printStackTrace();! }//end finally try! } //end try! }! } 서버는
703.
704.
클라이언트와
705.
DB간의
706.
처리
707.
708.
클라이언트는
709.
710.
사용자,
711.
서버간의
712.
처리 $(function() {! var visible
= false;! var menu = $('#leftcol');! var menuWidth = menu.width();! var menuHeight = menu.height();! ! $('#pull').unbind('click').on('click', function(e) {! e.preventDefault();! e.stopPropagation();! //menu.slideToggle( fast, function() {! if( !(visible) ){! visible = true;! menu.css( display, block );! $(#middlecol).css( width, window.innerWidth- menuWidth + px );! }else{! visible = false;! menu.css( display, none );! $(#middlecol).css( width, window.innerWidth + px );! }! //});! });! ! var resizeTimer;! var window_size = $(window).width();! $(window).resize(function(){! clearTimeout( resizeTimer );! resizeTimer = setTimeout(function(){! var window_changed = $(window).width() != window_size;! window_size = $(window).width();! if(window_changed){! if( window.innerWidth = 768){! visible = false;! menu.css( display, none );! }else{! visible = true;! menu.css( display, block );! $(#middlecol).css( width, 575px );! }! }! }, 500);! });! function setMaxWidth() {! if( window.innerWidth = 768 ){! if( /iPhone|iPod|iPad/i.test(navigator.userAgent) ){! $(#middlecol).css( fontSize, 9px );! }! $(#middlecol).css( font-size, 14px );! $(#header .wrapper h1).css( maxWidth, window.innerWidth + px );! $(#middlecol).css( width, window.innerWidth + px );! $(#topmenu .wrapper #mobileright).css(left,
713.
클라이언트는
714.
715.
사용자,
716.
서버간의
717.
처리 }! //});! });! ! var resizeTimer;! var window_size
= $(window).width();! $(window).resize(function(){! clearTimeout( resizeTimer );! resizeTimer = setTimeout(function(){! var window_changed = $(window).width() != window_size;! window_size = $(window).width();! if(window_changed){! if( window.innerWidth = 768){! visible = false;! menu.css( display, none );! }else{! visible = true;! menu.css( display, block );! $(#middlecol).css( width, 575px );! }! }! }, 500);! });! function setMaxWidth() {! if( window.innerWidth = 768 ){! if( /iPhone|iPod|iPad/i.test(navigator.userAgent) ){! $(#middlecol).css( fontSize, 9px );! }! $(#middlecol).css( font-size, 14px );! $(#header .wrapper h1).css( maxWidth, window.innerWidth + px );! $(#middlecol).css( width, window.innerWidth + px );! $(#topmenu .wrapper #mobileright).css(left, window.innerWidth - 40 );! if( window.innerWidth 468 ){! $(.topgooglead).css( display, none);! }else{! $(.topgooglead).css( display, block);! }! }! }! setMaxWidth();! $( window ).bind( orientationchange, setMaxWidth );! $( window ).bind( resize, setMaxWidth );! });
718.
전
719.
망
720.
WEB
721.
UI WEB
722.
UI
723.
App
724.
vs.
725.
Web
726.
App
727.
vs.
728.
Web Money
729.
App
730.
vs.
731.
Web Money Game
732.
App
733.
vs.
734.
Web Money Game
735.
App
736.
vs.
737.
Web
738.
App
739.
vs.
740.
Web 파편화문제
741.
해결
742.
App
743.
vs.
744.
Web 파편화문제
745.
해결
746.
App
747.
vs.
748.
Web 파편화문제
749.
해결 Money Game
750.
End ;-D
Descargar ahora