SPA?

Single page application

웹 애플리케이션
정적인 파일을 웹 서버로 제공하는 방식뿐만 아니라 PHP, Java, Node.js등을 이용해 동적으로 HTML을 생성해서 제공하는 방식.

HTML을서버에서 만들어서 내려주고, 이후 동작을 JS를 통해 하다보니 렌더링 시점이 뒤죽박죽이 되는 문제가 있다.

그러다보니 서버 렌더링 시점에서 구현했던 것을 클라이언트에서 동적으로 렌더링 해야한다면 중복해서 구현이 필요하기도 하다.

이러한 흐름속에서 서버는 API만 처리하고 아예 모든 렌더링을 클라이언트에서 하는 방식이 대두되게 됨.

클라이언트에선html파일은 index.html하나만 존재. 클라이언트로 오는 모든 url요청을 index.html 으로 돌린다. 이후 동작은 url을 보고 어떤 페이지를 그릴지 동적으로 처리한다.

처음 로딩 이후에는 네트워크 부담이 줄어드는 효과가 있음. 페이지의 모든 내용을 새로 불러오는 이전 방식과는 다른 점.

Hashbag

url뒤에 #해쉬값을 이용해 처리하는 방식.
"#"은 같은 페이지 내의 요소를 가리킬 때 많이 사용되었음. ex)http://localhost:5000/#list

javascript에서의 import 와 export

웹서버가 꼭 열려 있어야 한다! 로컬에서 시도했다가 안돼서 많이 당황을 했었다.