1. 수업 소개

https://opentutorials.org/course/1688/10245


2. 웹 애플리케이션을 만드는 순서

https://opentutorials.org/course/1688/9331


"구상 → 기획(계획) → 디자인 → 개발 → 테스트"   끊임 없이 반복! 

(디자인과 개발은 기획이 끝난 후 동시에 이루어 질 수 있으므로 두 개의 순서는 반드시 지켜야하는 것 X)


- 구상 : 무엇을 만들 것인가?

- 기획(계획) : 무엇을 만들 것인지 보다 분명하게 / 어떤 기능들이 있어야 하는가? / 각 기능들은 어떤 사용성을 가져야 하는가?

- 디자인 : 웹사이트를 아름답게 보이게 하는 것 / 사용자가 편리하게 사용할 수 있도록 하는 것

- 개발 : 실제 서비스가 동작하도록 하는 일

- 테스트(QA) : 버그 찾기 등


Start Small

: 작게 시작해서 끊임 없이 개선하는 반복적인 작업을 통해 정말로 필요한 웹 애플리케이션을 만들자!


복잡도

- 2^n로 계산

- n(지수)의 값이 커짐에 따라 복잡도가 폭발적으로 증가 → 지수폭발

- 기능 하나를 추가하는 것은 지수폭발을 의미한다.

→ 기능을 하나하나를 추가하는 것은 신중하게 해야한다.


3. 구상

https://opentutorials.org/course/1688/9332


구상이란?

 - 무엇을 만들 것인지 고민하는 과정


ㅋㅋㅋ전략

https://www.youtube.com/watch?v=9jb9tPqbT2w

- 컨텐츠, 컨테이너, 커뮤니티


4. 기획

https://opentutorials.org/course/1688/9333


기획이란?

- 기획은 '구상' 다음 단계이지만, 구상과 기획은 밀접한 관계가 있다.

- 어떻게 동작해야 하는가?


UI 모델링

- UI(User Interface) : 사용자가 시스템을 제어하는 데 사용되는 조작장치
    ex) 스마트 폰의 전원 버튼, 노트북의 전원 버튼, 웹 사이트의 버튼 등

- 모델링 : 직접 만들기 전에 가상으로 만들어 보는 것

- UI 모델링 : 사용자의 입장에서 동작하는 기능을 가상으로 만들어 보기


모델링 도구

- 손그림

- Pencil : 오픈 소스 모델링 도구

http://pencil.evolus.vn/

http://opentutorials.org/course/221/1416

- balsamiq : 유료 도구

https://balsamiq.com

- PowerPoint


5. 인터넷과 웹의 역사 

https://opentutorials.org/course/1688/9334


인터넷과 웹은 다를까요?

- 인터넷 안에 웹이 포함되어 있다.

- 웹, FTP, 이메일 등등 ⊂ 인터넷

- FTP : 파일을 전송할 때 사용하는 기술

- 이메일 :  웹을 통해서 이메일을 주고 받는 것 말고, 그 이전에 존재하는 이메일 서비스를 뜻함


인터넷

- 1960년대 등장

- 전 세계에 있는 컴퓨터들이 네트워크를 통해 연결되어 데이터를 주고 받을 수 있는 거대한 네트워크


- 1990년대 등장

- 인터넷 네트워크를 이용하여 html로 만들어진 웹 페이지를 컴퓨터와 컴퓨터가 주고 받을 수 있도록 고안된 서비스

- 팀버너스리

: 웹의 창시자

초창기 웹의 모습



- HTTP : 웹 브라우저와 웹 서버가 정보를 주고 받는 과정에서 사용하는 통신 규약

- HTML : 웹 페이지 정보를 담고 있는 언어


6. 서버와 클라이언트

https://www.opentutorials.org/course/1688/9408



클라이언트

- 웹 서버라고 불리는 소프트웨어가 설치되어 있는 컴퓨터

- 서버에게 알고 싶은 정보를 담고있는 웹 페이지를 요청


서버

- 웹 브라우저가 설치되어 있는 컴퓨터

- 클라이언트로부터 요청 받은 웹 페이지 문서를 읽어서 클라이언트에게 응답


웹서버

- 종류 : Apache, Nginx, IIS 등 


Apache 설치

http://projects.apache.org/projects/http_server.html

- 조금 까다로운 작업


bitnami

- 서버 소프트웨어를 쉽게, 한번에 설치할 수 있도록 하는 도구

- [Windows] https://bitnami.com/stack/wamp
  [MAC] https://bitnami.com/stack/mamp
  [Linux] https://bitnami.com/stack/lamp

 

7-1. 윈도우에 웹서버 설치

https://www.opentutorials.org/course/1688/9337


컴퓨터에 서버를 설치하고 싶지 않은 분들은 웹서버 설치 수업 대신 다른 대안이 있습니다. 아래 영상을 보시면 Codeanywhere라는 서비스를 이용해서 웹상에서 코드를 작성하고, 서버를 운영할 수 있는 방법이 있습니다. 이 방법도 참고해주세요.

- [소개] https://www.youtube.com/watch?v=0le0t62t8NU&feature=youtu.be

- [사용법] https://www.youtube.com/watch?v=6Wck0lv7_4c&feature=youtu.be 


7-2. 맥에서 웹서버 설치

https://www.opentutorials.org/course/1688/9338


7-3. 리눅스에서 웹서버 설치

https://www.opentutorials.org/course/1688/9409



8. 서버 제어

https://www.opentutorials.org/course/1688/9410



+ Recent posts