A Penguin Said That Nobody Drinks Pepsi ㅋㅋㅋ

 
 

7계층 – 응용 계층(Application): 디핑 소스 비유를 확장하면 응용 계층은 가장 위에 있다. 사용자에게 보이는 부분이다. OSI 모형에서는 “최종 사용자에게 가장 가까운” 계층이다. 7층에서 작동하는 응용프로그램은 사용자와 직접적으로 상호작용한다. 구글 크롬(Google Chrome), 파이어폭스(Firefox), 사파리(Safari) 등 웹 브라우저와 스카이프(Skype), 아웃룩(Outlook), 오피스(Office) 등의 응용 프로그램이 대표적이다.

6계층 – 표현 계층(Presentation): 표현 계층은 응용 계층의 데이터 표현에서 독립적인 부분을 나타낸다. 일반적으로 응용프로그램 형식을 준비 또는 네트워크 형식으로 변환하거나 네트워크 형식을 응용프로그램 형식으로 변환하는 것을 나타낸다. 다시 말해 이 계층은 응용프로그램이나 네트워크를 위해 데이터를 “표현”하는 것이다. 대표적인 예로는 데이터를 안전하게 전송하기 위해 암호화, 복호화하는 것인데, 이 작업이 바로 6계층에서 처리된다.

5계층 – 세션 계층(Session): 2대의 기기, 컴퓨터 또는 서버 간에 “대화”가 필요하면 세션(session)을 만들어야 하는데 이 작업이 여기서 처리된다. 이 계층에는 설정, 조율(예: 시스템의 응답 대기 기간), 세션 마지막에 응용프로그램 간의 종료 등의 기능이 필요하다.

4계층 – 전송 계층(Transport): 전송 계층은 최종 시스템 및 호스트 간의 데이터 전송 조율을 담당한다. 보낼 데이터의 용량과 속도, 목적지 등을 처리한다. 전송 계층의 예 중에서 가장 잘 알려진 것이 전송 제어 프로토콜(TCP)이다. TCP는 인터넷 프로토콜(IP) 위에 구축되는데 흔히 TCP/IP로 알려져 있다. 기기의 IP 주소가 여기서 작동한다.

3계층 – 네트워크 계층(Network): 네트워킹 전문가 대부분이 관심을 두고 좋아하는 라우터 기능 대부분이 여기 네트워크 계층에 자리잡는다. 가장 기본적으로 볼 때 이 계층은 다른 여러 라우터를 통한 라우팅을 비롯한 패킷 전달을 담당한다. 보스턴에 있는 컴퓨터가 캘리포니아에 있는 서버에 연결하려고 할 때 그 경로는 수백 만 가지다. 이 계층의 라우터가 이 작업을 효율적으로 처리한다.

2계층 – 데이터 링크 계층(Data Link): 데이터 링크 계층은 (두 개의 직접 연결된 노드 사이의) 노드 간 데이터 전송을 제공하며 물리 계층의 오류 수정도 처리한다. 여기에는 2개의 부계층도 존재한다. 하나는 매체 접근 제어(MAC) 계층이고 다른 하나는 논리적 연결 제어(LLC) 계층이다. 네트워킹 세계에서 대부분 스위치는 2계층에서 작동한다.

1계층 – 물리 계층(Physical): OSI 디핑 소스의 밑바닥에는 물리 계층이 있다. 시스템의 전기적, 물리적 표현을 나타낸다. 케이블 종류, (802.11 무선 시스템에서와 같은) 무선 주파수 링크는 물론 핀 배치, 전압, 물리 요건 등이 포함된다. 네트워킹 문제가 발생하면 많은 네트워크 전문가가 물리 계층으로 바로 가서 모든 케이블이 제대로 연결돼 있는지, 라우터나 스위치 또는 컴퓨터에서 전원 플러그가 빠지지 않았는지 확인한다.

원문보기: 
http://www.ciokorea.com/news/36536#csidx204bf44a38ad390b16cec1200d8e027 

 





이 포스팅은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다.

'공부메모' 카테고리의 다른 글

2018.07.16 - Restful API 란?  (0) 2018.07.16
2018.07.16 - Why Spring Boot?  (0) 2018.07.16
2018.07.16 - WAS, 웹서버 차이  (0) 2018.07.16
2018.07.03 - TCI/IP 프로토콜에 대하여  (0) 2018.07.03
2018.07.02 - 자료구조란?  (0) 2018.07.02



REST ( Representational Status Transfer) - 분산 시스템을 위한 소프트웨어 아키텍쳐



REST의 장점

  1. 언어, 플랫폼에 독립적이다.
  2. SOAP보다 쉽고 간단하다.
  3. 학습이 용이하고, 개발도구가 거의 필요 없다.
  4. (익숙한)웹기반의 설계
  5. 개발 인프라가 탄탄하다. HTTP, URI 기반 서버, 클라이언트툴, 각종 라이브러리들은 완성단계의 기술이다. 개발자들은 하부구조에 신경쓰지 않고 비지니스 로직의 구현만 신경쓰면 된다.
  6. 트랜드다. 예컨데 대세. 구글,야휴,트위터,facebook등의 기업들이 사용하고 있다. 


REST의 단점

  1. REST는 point-to-point 통신모델을 기반으로 한다. 서버와 클라이언트가 연결을 맺고 상호작용해야하는 어플리케이션의 개발에는 적당하지 않다.
  2. REST는 URI, HTTP 를 이용한 아키텍처링 방법에 대한 내용만을 담고 있다. 보안과 통신규약 정책 같은 것은 전혀다루지 않는다. 따라서 개발자는 통신과 정책에 대한 설계와 구현을 도맡아서 진행해야 한다.
  3. HTTP에 (상당히)의존적이다. REST는 설계 원리이기 때문에 HTTP와는 상관없이 다른 프로토콜에서도 구현할 수 있기는 하지만 자연스럽게 녹여내기가 쉽지 않을 수 있다. 대부분의 서비스가 웹으로 통합되는 상황에 비춰볼때 큰 단점은 아닌 것 같다.
  4. CRUD의 4가지 메서드만 제공한다. 대부분의 일들을 처리할 수 있기는 한데, 4가지 메서드 만으로 처리하기엔 모호한 표현들이 있다.




출처 및 REST에 대해 잘 정리된 블로그 포스트 원본

https://www.joinc.co.kr/w/man/12/rest/about





하.. 배고파



'공부메모' 카테고리의 다른 글

2018.07.16 - OSI 7 계층  (0) 2018.07.16
2018.07.16 - Why Spring Boot?  (0) 2018.07.16
2018.07.16 - WAS, 웹서버 차이  (0) 2018.07.16
2018.07.03 - TCI/IP 프로토콜에 대하여  (0) 2018.07.03
2018.07.02 - 자료구조란?  (0) 2018.07.02


왜 스프링 부트를 쓰는가? 일반 Spring(Spring MVC)랑 뭐가 다른가?



Spring Boot 는 내장WAS(Embedded Container)를 가지고 있다.

 - 개발과 운영 환경의 WAS(ex.Tomcat) 설정이 달라 안돌아가는 일이 없어진다. 안정된 실행환경 제공.


Dependency 버전 호환성 문제가 해결된다.

 - spring 프로젝트 설정하면서 dependency 버전때문에 고생한게 지난주.. 또르르

 - 최초 설정시에 난이도가 줄어듬.


일반적으로 쓰이는 설정의 기본제공

 - Spring Boot는 별도 절정을 하지 않으면 기본설정대로! 설정된다. 






기존 Spring Framework는 설정해야 하는것들이 너무많고 버전도 너무많고 기능자체도 방대하고..

Spring Boot는 나같은 스프링 초심자에게 비교적 쉬운 진입장벽을 제공하는듯 하다.


여러 좋은 점 들이 있지만 규모가 큰 프로젝트에는 Spring Framework를 사용해 WAS에 배포하는게 좋다고합니다.



 

'공부메모' 카테고리의 다른 글

2018.07.16 - OSI 7 계층  (0) 2018.07.16
2018.07.16 - Restful API 란?  (0) 2018.07.16
2018.07.16 - WAS, 웹서버 차이  (0) 2018.07.16
2018.07.03 - TCI/IP 프로토콜에 대하여  (0) 2018.07.03
2018.07.02 - 자료구조란?  (0) 2018.07.02



웹서버

 - 아파치(apach) = http웹서버 = http요청을 처리 (GET,POST,PUT,DELETE)

 - HTML,CSS 등 정적 데이터 처리


WAS (Web Application Server)

 - Tomcat, JBOSS ...

 - DB와 연결하여 데이터 주고받는 동적 데이터 처리


 



동작 프로세스



                           요청                                          웹서버+웹컨테이너

클라이언트    -------------------->  웹서버   ------------------->  WAS----------------------------> 서블릿

                               (동적데이터 - WAS로 넘김)            (1.web.xml 참조. 쓰레드생성 및 httpServletRequest, httpServletResponse 객체 생성) 

                (정적데이터 - 웹서버가 응답)                                        (2.서블릿 호출 -> 3.호출된 서블릿 작업 담당 쓰레드는 doGet(), doPost() 호출 

                                                                                                               -> 4.생성된 동적 페이지를 Response객체에 담아 컨테이너에 전달)

                                                                              (5.전달받은 Response객체를 HTTPResponse로 변환해서 웹서버에 전달 -> 쓰레드종료)







                  




'공부메모' 카테고리의 다른 글

2018.07.16 - Restful API 란?  (0) 2018.07.16
2018.07.16 - Why Spring Boot?  (0) 2018.07.16
2018.07.03 - TCI/IP 프로토콜에 대하여  (0) 2018.07.03
2018.07.02 - 자료구조란?  (0) 2018.07.02
2018.06.13 - 순수JS와 Vue.js  (0) 2018.06.16



TCP/IP 프로토콜에 대하여


TCP/IP 프로토콜은 TCP 프로토콜과 IP프로토콜을 함께 부르는 이름이다.



- IP


  IP 프로토콜은 네트워크에 연결된 개개의 컴퓨터에 유일한 주소를 붙이는 규칙을 정의하는 프로토콜이다.


  IP 프로토콜에 의해 컴퓨터에 붙여지는 주소를 IP address 라고 한다.


  IP 주소 확인은 윈도우 운영체제에서 명령 프롬프트창에 ipconfig 입력.


  IP 주소는 마침표로 연결된 4개의 정수로 구성.


  고정 IP는 컴퓨터를 재부팅해도 항상 같은 IP주소.


  유동 IP는 컴퓨터를 재부팅하면 다른 IP주소가 나올 수 있음.


  통신 프로그램이 대상 컴퓨터를 찾을 때에 이 IP주소를 이용한다.


  통신 프로그램이 실질적으로 데이터를 교환하는 대상은 컴퓨터가 아니라 프로그램이다.





- port


  네트워크 통신을 하기 위해서는 상대 컴퓨터에서 작동중인 여러 프로그램들 중 하나를 식별할 수 있어야한다.


  그런 식별은 운영체제에서 관리하는 포트를 통해 가능.


  port란 네트워크를 통해 데이터를 주고받는 가상의 출입구.


  포트번호 0~65535 범위의 정수.


  IP 주소와 함께 포트 번호를 사용하면 통신할 대상이 되는 프로그램을 찾을 수 있다.


  포트번호 확인 명령어 netstat


  0~1023 시스템이 사용하는 포트번호.


  1024~ 응용프로그램에서 사용


  서버프로그램은 포트를 열어놓고 연결 요청이 오기를 기다림.


  클라이언트 프로그램은 그 포트로 연결 요청을 보냄.






'공부메모' 카테고리의 다른 글

2018.07.16 - Why Spring Boot?  (0) 2018.07.16
2018.07.16 - WAS, 웹서버 차이  (0) 2018.07.16
2018.07.02 - 자료구조란?  (0) 2018.07.02
2018.06.13 - 순수JS와 Vue.js  (0) 2018.06.16
2018.06.09 - 순수JS 와 VueJs  (0) 2018.06.09

자료구조 (data structure)


  데이터를 효율적으로 사용할 수 있도록 구조를 만들어서 저장해둔 것.

  데이터의 효율적 사용이란 데이터 추가, 삭제, 검색에 있어서의 효율적 사용을 말한다.




자료구조의 종류


  List : 데이터를 1차원으로 늘어놓은 형태의 자료구조.

         리스트는 배열과 달리 데이터의 검색과 추가, 삭제가 가능하다.

         Array List, Linked List


  Stack : 1차원 구조

            마지막에 넣은 데이터부터 순서대로 꺼낼 수 있다.

            Last In First Out.


  Queue : 1차원 구조

             들어온 순서대로 데이터를 꺼낼 수 있다.

             First In First Out.


  Hash Table : 번호가 붙은 여러 개의 통에 데이터를 분산저장.

                   데이터를 검색할 때는 일정한 공식에 따라 키 값을 가지고 통 번호를 바로 계산. 빠른 데이터 검색 가능.

                   데이터를 key로 검색 가능.


  Set : 같은 데이터가 중복 저장되지 않음.





JDK 라이브러리의 자료구조 클래스


  List : ArrayList, LinkedList, (Vector)


  Stack : LinkedList, (Stack)


  Queue : LinkedList


  Hash Table : HashMap, (Hashtable)


  Set: HashSet





'공부메모' 카테고리의 다른 글

2018.07.16 - WAS, 웹서버 차이  (0) 2018.07.16
2018.07.03 - TCI/IP 프로토콜에 대하여  (0) 2018.07.03
2018.06.13 - 순수JS와 Vue.js  (0) 2018.06.16
2018.06.09 - 순수JS 와 VueJs  (0) 2018.06.09
2018.06.06 - 순수JS 와 VueJs  (0) 2018.06.06

인프런 강좌 - 실습 UI 개발로 배워보는 순수JS 와 VueJs 개발

https://www.inflearn.com/course/%EC%88%9C%EC%88%98js-vuejs-%EA%B0%9C%EB%B0%9C-%EA%B0%95%EC%A2%8C/



끝!!!




강좌 교육과정


준비
강의 소개미리보기00:02:00
개발환경 구성미리보기00:03:00
요구사항 분석미리보기00:04:00
순수JS (MVC)
MVC 패턴 설명미리보기00:02:00
폴더 구조00:11:00
- 검색폼
검색폼 구현 1미리보기00:07:00
검색폼 구현 200:03:00
검색폼 구현 300:04:00
검색폼 구현 4 (실습)00:02:00
검색폼 구현 4 (구현)00:04:00
- 검색결과
검색결과 구현 1미리보기00:10:00
검색결과 구현 200:03:00
검색결과 구현 3 (실습)00:01:00
검색결과 구현 3 (구현)00:02:00
- 탭
탭 구현 1미리보기00:02:00
탭 구현 200:06:00
탭 구현 3 (실습)00:01:00
탭 구현 3 (구현)00:04:00
- 추천 검색어
추천 검색어 구현 1미리보기00:09:00
추천 검색어 구현 200:07:00
추천 검색어 구현 3 (실습)00:01:00
추천 검색어 구현 3 (구현)00:04:00
- 최근 검색어
최근 검색어 구현 1, 2미리보기00:06:00
최근 검색어 구현 300:03:00
최근 검색어 구현 4 (실습)00:01:00
최근 검색어 구현 4 (구현)00:06:00
최근 검색어 구현 checkout00:02:00
최근 검색어 구현 5 (실습)00:01:00
최근 검생어 구현 5 (구현)00:02:00
Vue.js (MVVM)
MVVM 구조설명미리보기00:04:00
vue.js 설치00:06:00
- 검색폼
검색폼미리보기00:08:00
검색폼 (실습)00:01:00
검색폼 (구현)00:03:00
- 검색결과
검색결과미리보기00:08:00
검색결과 (실습)00:01:00
검색결과 (구현)00:01:00
- 탭
미리보기00:05:00
탭 (실습)00:01:00
탭 (구현)00:03:00
- 추천 검색어
추천 검색어 구현00:07:00
- 최근 검색어
최근 검색어미리보기00:06:00
최근 검색어 (실습)00:01:00
최근 검색어 (구현)00:03:00
- 개선된 점
개선된 점미리보기00:02:00
컴포넌트
Vue Component 소개미리보기00:03:00
FormComponent 구현 100:07:00
FormComponent 구현 200:10:00
ResultComponent 구현00:04:00
List Component 구현 100:09:00
List Component 구현 200:05:00
Tab Component 100:02:00
Tab Component 200:04:00
단일 파일 컴포넌트 구현
단일 파일 컴포넌트 100:04:00
단일 파일 컴포넌트 200:03:00
단일 파일 컴포넌트 300:05:00
단일 파일 컴포넌트 (실습)00:01:00
단일 파일 컴포넌트 (구현)00:05:00
정리
정리


'공부메모' 카테고리의 다른 글

2018.07.03 - TCI/IP 프로토콜에 대하여  (0) 2018.07.03
2018.07.02 - 자료구조란?  (0) 2018.07.02
2018.06.09 - 순수JS 와 VueJs  (0) 2018.06.09
2018.06.06 - 순수JS 와 VueJs  (0) 2018.06.06
2018.05.26 - 순수JS 와 VueJs  (0) 2018.05.26

인프런 강좌 - 실습 UI 개발로 배워보는 순수JS 와 VueJs 개발

https://www.inflearn.com/course/%EC%88%9C%EC%88%98js-vuejs-%EA%B0%9C%EB%B0%9C-%EA%B0%95%EC%A2%8C/



props: ['data', 'tabs'] // 부모의 데이터를 받아옴

this.$emit('@change', data) // 부모에게 이벤트를 보냄

watch: name(newVal, oldVal){} // 이벤트 지켜봄. 데이터 변경시 앎.

computed: name(){return aa===1} // v-if="aa===1" --> v-if="name"


부모, 자식 컴포넌트 데이터 넘겨주고 하는거 아직도 익숙하지 않음.

실습 혼자 못깼음. 

공식문서에 computed 계산된 속성(?) 이라고만 나와있어서 도무지 뭔말인지 몰랐는데 이제 어떻게 쓰는건지 좀 알겠다.


강좌가 몇개 남지 않았어!



강좌 교육과정


준비
강의 소개미리보기00:02:00
개발환경 구성미리보기00:03:00
요구사항 분석미리보기00:04:00
순수JS (MVC)
MVC 패턴 설명미리보기00:02:00
폴더 구조00:11:00
- 검색폼
검색폼 구현 1미리보기00:07:00
검색폼 구현 200:03:00
검색폼 구현 300:04:00
검색폼 구현 4 (실습)00:02:00
검색폼 구현 4 (구현)00:04:00
- 검색결과
검색결과 구현 1미리보기00:10:00
검색결과 구현 200:03:00
검색결과 구현 3 (실습)00:01:00
검색결과 구현 3 (구현)00:02:00
- 탭
탭 구현 1미리보기00:02:00
탭 구현 200:06:00
탭 구현 3 (실습)00:01:00
탭 구현 3 (구현)00:04:00
- 추천 검색어
추천 검색어 구현 1미리보기00:09:00
추천 검색어 구현 200:07:00
추천 검색어 구현 3 (실습)00:01:00
추천 검색어 구현 3 (구현)00:04:00
- 최근 검색어
최근 검색어 구현 1, 2미리보기00:06:00
최근 검색어 구현 300:03:00
최근 검색어 구현 4 (실습)00:01:00
최근 검색어 구현 4 (구현)00:06:00
최근 검색어 구현 checkout00:02:00
최근 검색어 구현 5 (실습)00:01:00
최근 검생어 구현 5 (구현)00:02:00
Vue.js (MVVM)
MVVM 구조설명미리보기00:04:00
vue.js 설치00:06:00
- 검색폼
검색폼미리보기00:08:00
검색폼 (실습)00:01:00
검색폼 (구현)00:03:00
- 검색결과
검색결과미리보기00:08:00
검색결과 (실습)00:01:00
검색결과 (구현)00:01:00
- 탭
미리보기00:05:00
탭 (실습)00:01:00
탭 (구현)00:03:00
- 추천 검색어
추천 검색어 구현00:07:00
- 최근 검색어
최근 검색어미리보기00:06:00
최근 검색어 (실습)00:01:00
최근 검색어 (구현)00:03:00
- 개선된 점
개선된 점미리보기00:02:00
컴포넌트
Vue Component 소개미리보기00:03:00
FormComponent 구현 100:07:00
FormComponent 구현 200:10:00
ResultComponent 구현00:04:00
List Component 구현 100:09:00
List Component 구현 200:05:00
Tab Component 100:02:00
Tab Component 200:04:00
단일 파일 컴포넌트 구현
단일 파일 컴포넌트 100:04:00
단일 파일 컴포넌트 200:03:00
단일 파일 컴포넌트 300:05:00
단일 파일 컴포넌트 (실습)00:01:00
단일 파일 컴포넌트 (구현)00:05:00
정리
정리


'공부메모' 카테고리의 다른 글

2018.07.02 - 자료구조란?  (0) 2018.07.02
2018.06.13 - 순수JS와 Vue.js  (0) 2018.06.16
2018.06.06 - 순수JS 와 VueJs  (0) 2018.06.06
2018.05.26 - 순수JS 와 VueJs  (0) 2018.05.26
2018.05.23 - 순수JS 와 VueJs  (0) 2018.05.23

인프런 강좌 - 실습 UI 개발로 배워보는 순수JS 와 VueJs 개발

https://www.inflearn.com/course/%EC%88%9C%EC%88%98js-vuejs-%EA%B0%9C%EB%B0%9C-%EA%B0%95%EC%A2%8C/



확실히 매일매일 하니까 vue js가 좀 익숙해 진것 같다.

오늘은 component 구현 들어갔는데 

컴포넌트는 확실히 좀 어려움

아직 컴포넌트간 데이터, 이벤트 주고받는게 어색함




강좌 교육과정


준비
강의 소개미리보기00:02:00
개발환경 구성미리보기00:03:00
요구사항 분석미리보기00:04:00
순수JS (MVC)
MVC 패턴 설명미리보기00:02:00
폴더 구조00:11:00
- 검색폼
검색폼 구현 1미리보기00:07:00
검색폼 구현 200:03:00
검색폼 구현 300:04:00
검색폼 구현 4 (실습)00:02:00
검색폼 구현 4 (구현)00:04:00
- 검색결과
검색결과 구현 1미리보기00:10:00
검색결과 구현 200:03:00
검색결과 구현 3 (실습)00:01:00
검색결과 구현 3 (구현)00:02:00
- 탭
탭 구현 1미리보기00:02:00
탭 구현 200:06:00
탭 구현 3 (실습)00:01:00
탭 구현 3 (구현)00:04:00
- 추천 검색어
추천 검색어 구현 1미리보기00:09:00
추천 검색어 구현 200:07:00
추천 검색어 구현 3 (실습)00:01:00
추천 검색어 구현 3 (구현)00:04:00
- 최근 검색어
최근 검색어 구현 1, 2미리보기00:06:00
최근 검색어 구현 300:03:00
최근 검색어 구현 4 (실습)00:01:00
최근 검색어 구현 4 (구현)00:06:00
최근 검색어 구현 checkout00:02:00
최근 검색어 구현 5 (실습)00:01:00
최근 검생어 구현 5 (구현)00:02:00
Vue.js (MVVM)
MVVM 구조설명미리보기00:04:00
vue.js 설치00:06:00
- 검색폼
검색폼미리보기00:08:00
검색폼 (실습)00:01:00
검색폼 (구현)00:03:00
- 검색결과
검색결과미리보기00:08:00
검색결과 (실습)00:01:00
검색결과 (구현)00:01:00
- 탭
미리보기00:05:00
탭 (실습)00:01:00
탭 (구현)00:03:00
- 추천 검색어
추천 검색어 구현00:07:00
- 최근 검색어
최근 검색어미리보기00:06:00
최근 검색어 (실습)00:01:00
최근 검색어 (구현)00:03:00
- 개선된 점
개선된 점미리보기00:02:00
컴포넌트
Vue Component 소개미리보기00:03:00
FormComponent 구현 100:07:00
FormComponent 구현 200:10:00
ResultComponent 구현00:04:00
List Component 구현 100:09:00
List Component 구현 200:05:00
Tab Component 100:02:00
Tab Component 200:04:00
단일 파일 컴포넌트 구현
단일 파일 컴포넌트 100:04:00
단일 파일 컴포넌트 200:03:00
단일 파일 컴포넌트 300:05:00
단일 파일 컴포넌트 (실습)00:01:00
단일 파일 컴포넌트 (구현)00:05:00
정리
정리


'공부메모' 카테고리의 다른 글

2018.06.13 - 순수JS와 Vue.js  (0) 2018.06.16
2018.06.09 - 순수JS 와 VueJs  (0) 2018.06.09
2018.05.26 - 순수JS 와 VueJs  (0) 2018.05.26
2018.05.23 - 순수JS 와 VueJs  (0) 2018.05.23
2018.05.22 - 순수JS 와 VueJs  (0) 2018.05.22

인프런 강좌 - 실습 UI 개발로 배워보는 순수JS 와 VueJs 개발

https://www.inflearn.com/course/%EC%88%9C%EC%88%98js-vuejs-%EA%B0%9C%EB%B0%9C-%EA%B0%95%EC%A2%8C/



오늘 드디어 vue 구현에 들어갔다.

조금 해보니 확실히 순수js만 썼을 때 보다 코드 양도 줄고 간단하고 편리한 느낌이다.

실습도 100% 클리어했다.

장하다 나!




강좌 교육과정


준비
강의 소개미리보기00:02:00
개발환경 구성미리보기00:03:00
요구사항 분석미리보기00:04:00
순수JS (MVC)
MVC 패턴 설명미리보기00:02:00
폴더 구조00:11:00
- 검색폼
검색폼 구현 1미리보기00:07:00
검색폼 구현 200:03:00
검색폼 구현 300:04:00
검색폼 구현 4 (실습)00:02:00
검색폼 구현 4 (구현)00:04:00
- 검색결과
검색결과 구현 1미리보기00:10:00
검색결과 구현 200:03:00
검색결과 구현 3 (실습)00:01:00
검색결과 구현 3 (구현)00:02:00
- 탭
탭 구현 1미리보기00:02:00
탭 구현 200:06:00
탭 구현 3 (실습)00:01:00
탭 구현 3 (구현)00:04:00
- 추천 검색어
추천 검색어 구현 1미리보기00:09:00
추천 검색어 구현 200:07:00
추천 검색어 구현 3 (실습)00:01:00
추천 검색어 구현 3 (구현)00:04:00
- 최근 검색어
최근 검색어 구현 1, 2미리보기00:06:00
최근 검색어 구현 300:03:00
최근 검색어 구현 4 (실습)00:01:00
최근 검색어 구현 4 (구현)00:06:00
최근 검색어 구현 checkout00:02:00
최근 검색어 구현 5 (실습)00:01:00
최근 검생어 구현 5 (구현)00:02:00
Vue.js (MVVM)
MVVM 구조설명미리보기00:04:00
vue.js 설치00:06:00
- 검색폼
검색폼미리보기00:08:00
검색폼 (실습)00:01:00
검색폼 (구현)00:03:00
- 검색결과
검색결과미리보기00:08:00
검색결과 (실습)00:01:00
검색결과 (구현)00:01:00
- 탭
미리보기00:05:00
탭 (실습)00:01:00
탭 (구현)00:03:00
- 추천 검색어
추천 검색어 구현00:07:00
- 최근 검색어
최근 검색어미리보기00:06:00
최근 검색어 (실습)00:01:00
최근 검색어 (구현)00:03:00
- 개선된 점
개선된 점미리보기00:02:00
컴포넌트
Vue Component 소개미리보기00:03:00
FormComponent 구현 100:07:00
FormComponent 구현 200:10:00
ResultComponent 구현00:04:00
List Component 구현 100:09:00
List Component 구현 200:05:00
Tab Component 100:02:00
Tab Component 200:04:00
단일 파일 컴포넌트 구현
단일 파일 컴포넌트 100:04:00
단일 파일 컴포넌트 200:03:00
단일 파일 컴포넌트 300:05:00
단일 파일 컴포넌트 (실습)00:01:00
단일 파일 컴포넌트 (구현)00:05:00
정리
정리


'공부메모' 카테고리의 다른 글

2018.06.09 - 순수JS 와 VueJs  (0) 2018.06.09
2018.06.06 - 순수JS 와 VueJs  (0) 2018.06.06
2018.05.23 - 순수JS 와 VueJs  (0) 2018.05.23
2018.05.22 - 순수JS 와 VueJs  (0) 2018.05.22
2018.05.19 - 순수JS 와 VueJS  (0) 2018.05.19

+ Recent posts