FrontEnd

1.어플리케이션 <->프로그램<->서비스
=>우리가 하고자하는일(복잡하거나 반복되는 일)을 컴퓨터가 할 수 있도록 만드는 것

1)컴퓨터
하드웨어(장비)& 소프트웨어(실제장비를 코드로사용할수있도록 추상화)

서로다른걸 통역해주는것=인터페이스 =>운영체제:하드웨어와 소프트웨어 사이의 인터페이스

하드웨어는 기계어만인식가능. 운영체제는 대부분 어셈블러(어셈블리어를 기계어로 번역)랑 C언어로 만들어짐

네트워크를하기위헤서 새로 만들어진  UNIX(C언어로 만들어짐 but OS 끼리만 소통)

Linux(다른 사람들 가져갈 수 있도록 GIT도 만듬)
C언어의 단점- 플랫폼 독립적이질 못함( mac용 window용 으로 만들어야함)
그래서 나온게 파이썬,자바
파이썬은 읽어나갈때 mac이나 윈도우에 맞게 바꿔서 읽음


내가 하고자 하는 목적: 


웹 브라우저에서 동작되는 원리) html,css,js
html:구조를 만드는 언어
앞에서부터 순서대로 읽어서 트리를 만들어서 공간을 확보한 후 콘텐츠를 나중에 주입하는 구조로 동작
외부 자원을 가져올떄는 캐싱(저장해두는것-목적은 빨리)을 이용-경로를 기반으로 합니다.
★현재디렉토리쓸때 왠만하면(./)로 쓰는게 나음 -> 인터넷이 불러오다 끊겨도 가져올수 있게해줌

CSS:디자인
html 구조를 전부 읽고 난 후 출력할 때 적용

HS:동작
태그와 함께 위에서부터 순서대로 읽으면서 동작(저장을 합니다)
앞에 안나온걸 조작하는걸 쓰면 안됨

script는 순서를 잘 따라가야함



3) framework,library,solution
=>SDK(Software Development Kit,API:application programming interface): 프로그램을 만들 수 있도록 도와주는 도구 IAAS

=>library(package):프로그램을 만드는데 도와주는 별도의 코드 모임 PAAS

=>framework: 프로그램을 만드는데 도와주는 별도의 코드 모임 - 프로그램 제작도 해주는 경우

=> solution:특정 목적이 있음 SAAS


4)JS framework
=> Node.js:자바스크립트가 브라우저 이외 환경에서 동작하도록 해주는 플랫폼

=> 크로스 브라우징: 서로 다른 브라우저에서 동일한 콘텐츠를 제공하는 기술(chrome 따로 익스플로러 따로)
이를 해결하기 위한 라이브러리:jquery 최근에는 사용을 금기시 함
최근에는 거의 해결이 됨

=> 반응형 웹: 하나의 코드로 브라우저의 크기에 상관없이 동일한 콘텐츠를 사용할수 있도록 하는 기술(크기 작게해도 기능은 다쓸수있게) 반응형 웹을 쉽게 만들어주는 라이브러리:bootstrap

=>그래프를 쉽게 만들어주는 라이브러리:d3.js

=> express.js, nest.js : 서버를 만들기 위한 프레임워크

=>SPA(single page application):하나의 페이지를 가지고 모든 컨텐츠를 제공
angular.js,vue.js,react.js ->next.js

=>ajax,fetch API:외부에서 비동기적으로 데이터를 가져오는 기술
axios 라이브러리

=>progressive web:웹과 앱의 경계가 무너지면서 웹이나 웹의 디자인을 유사하게 하도록 하는 기술
구글의 머터리얼 디자인