Client vs. Server vs. Framework
client vs. server vs. framework
* 프론트 엔드 vs 백엔드 vs 클라이언트 측 vs 서버 측
|
프론트 엔드 == 클라이언트 사이드 |
프론트 엔드 프레임 워크 |
백엔드 == 서버 사이드 |
백엔드 프레임 워크 |
|
화면에 보여주는 뷰 정적 페이지 클라이언트 측에서 발생하는 모든 것 사용자 인터페이스 구축 코드 작성 |
프론트 엔드 + Dom selector + 동적 화면 처리 + 서버 비동기 요청 기본 : jQuery |
로직, 시스템 동적 페이지 DB 연동(MySQL, Oracle,...) 사용자 인터페이스와 관련없는 서버 측에서 일어나는 모든 일 html, css, js로 만든 파일을 생성 가능 |
범용 웹 프레임 워크 HTML및 CSS의 서버 측 렌더링 모두 수행 1) Zend, Symfony, CakePHP - PHP 프레임워크 2) SVN, CVS, Git - 버전제어 3) Linux - 개발,배포 시스템 |
|
HTML, CSS, JavaScript(JSON) |
Bootstrap, Foundation, Backbone, EmberJS Ajax, Vue, Angular, React ... |
Ruby, PHP, JSP, ASP, ASP.Net, Python, NodeJS ... |
php-Laravel, python-Django, Flask, node.js-Express, java/jsp - Spring, ruby-Rails, ... |
* 웹 발전
- 초창기
웹은 참 단순했음
서버 사이드 언어 존재하지 않음.
*** 인터넷의 3요소 (팀버너스리)
① HTML (Hyper Text Markup Language) : 웹 브라우저가 사용자에게 정보를 보여줄 때 정보가 담겨있는 것
ex> 편지. 메시지
② HTTP (Hyper Text Transfer Protocol) : HTML을 서버와 클라이언트가 주고 받기 위한 통신 규약
ex> 운송 담당. 편지를 주고받기 위한 절차, 단계, 커뮤니티 (집주소, 거쳐 가야 하는 통로...)
③ URL, URL : 사용자가(클라이언트) 웹 브라우저에 URL을 입력하고 엔터치면 서버가 URL에 해당하는 HTML문서를 찾아
서 사용자에게 보내줌.
- 중기
웹 서버만으로는 클라이언트 요청을 다 처리하기 어려움
④ CGI (Common Gateway Interface) :
- Web Server와 Server side script가 서로 데이터를 주고 받기 위한 통신 규약
- Web Server와 프로그래밍 언어들 사이에 communication 하기위한 표준화된 규약
ex> php, java, python, perl, C ...
② HTTP : Web Browser와 Web Server가 서로 데이터를 주고 받기 위한 통신 규약
* 참고 사이트s
- [번역]프론트vs백엔드vs클라이언트사이드vs서버사이드
https://brunch.co.kr/@jowlee/52
- JSP vs ASP vs PHP vs Python
https://hyoje420.tistory.com/25
- 서버측 언어를 사용하는 이유 (생활코딩)
https://opentutorials.org/course/3018/5117
- Web Server, Server Side, Client Side 이해
- php vs Node.js
https://flearning-blog.tistory.com/24
- 프론트(Front), 백(Back), 풀스택(Full-Stack)
https://medium.com/code-states/%EA%B0%9C%EB%B0%9C%EC%9E%90-%EC%A7%81%EA%B5%B0-%ED%8C%8C%ED%97%A4%EC%B9%98%EA%B8%B0-1-%ED%94%84%EB%A1%A0%ED%8A%B8-front-%EB%B0%B1-back-%ED%92%80%EC%8A%A4%ED%83%9D-full-stack-%EA%B0%9C%EB%B0%9C%EC%9E%90-f6c2f53e5b3b
- jQuery 보다 먼저 알았으면 좋았을 것들
http://jeonghwan-kim.github.io/2018/01/25/before-jquery.html
- XML과 JSON의 차이
- [이메일 문답] Angular + Node.js vs. Spring
https://han41858.tistory.com/41
- 당신이 2017년에 배워야 할 언어, 프레임워크, 툴에 대하여
https://han41858.tistory.com/27
개빠르네..,