본문 바로가기

부스트코스22

Spring MVC 정의 및 구성요소 1. MVC 정의 2. MVC Model 1 아키텍쳐 3. MVC Model 2 아키텍쳐 4. MVC Model2 발전 형태 (Spring MVC) 5. Spring MVC 구성요소 - DispatcherServlet 이 동작 순서 - DispatcherServlet에서 사용되는 컴포넌트(객체) 1. MVC 정의 Model-View-Controller의 약자입니다. Model : View 가 렌더링 하는데 필요한 데이터(사용자가 요청한 상품목록리스트와 같은 객체) 입니다. View : Model에서 받아온 데이터를 랜더링하여 를 출력하며 Jsp, HTML 페이지로 결과 표현합니다. Controller : 사용자의 요청을 받아 모델 업데이트 및 뷰에 모델에서 받아온 데이터 넘기는 역할을 합니다. MVC M.. 2019. 8. 7.
Web UI DOMContentLoaded 이벤트 로딩 이후에 자바스크립트 동작이 이뤄지는것이 일반적입니다. 자바스크립트가 실행되어야 할 가장 적절한 타이밍은 언제인지 아래의 표를 보겠습니다. load 와 DOMContentLoaded의 차이 확인 화면 로딩 시점 이벤트 발생 시점 DOM Tree 분석 종료시 DOMContentLoaded 이벤트 발생 그외 모든 자원(image, script, css)이 다 받아져서 브라우저에 렌더링(화면 출력) 완료시 load 이벤트 발생 보통 DOM tree가 다 만들어지면 DOM APIs를 통해서 DOM에 접근할 수 있기때문에 실무에서는 대부분의 자바스크립트코드는 DOMContentLoaded 이후에 동작하도록 구현합니다. 이 방법이 로딩속도 성능에 유리하다고 생각하기 때문입니.. 2019. 8. 5.
Web Animation Animation 구현 웹사이트의 애니메이션 구현은 Javascript와 CSS를 통해 이루어집니다. 웹 UI 애니메이션은 자바스크립트로 다양하게 제어할 수 있지만, 규칙적이고 비교적 단순한 방식은 CSS의 transition과 transform 속성을 사용해 구현가능합니다. 또한, 이 두 속성은 자바스크립트보다 더 빠른 성능을 보장하며 특히 모바일 웹에서는 CSS를 사용한 방법이 훨씬 더 빠릅니다. FPS( Frame per second) FPS는 1초당 화면에 표현할 수 있는 정지화면(Frame)수입니다. 매끄러운 애니메이션은 보통 60fps 입니다. 16.666 ms 간격으로 frame생성이 필요합니다. (1000ms/60fps = 16.666ms) JavaScript 애니메이션 자바스크립트로 애니.. 2019. 8. 5.
Ajax Ajax ( Asynchronous JavaScript and XML) Ajax를 이용해 서버로부터 데이터를 얻어오면 브라우저의 새로고침없이 화면을 다른데이터로 로드할수 있습니다. 즉, Ajax는 자바스크립트를 이용해 비동기 통신으로 서버와 브라우저가 데이터를 교환할 수 있는 방식을 의미합니다. Ajax 기술은 왜 나왔을까? 기존의 웹 애플리케이션은 서버에 요청을 하면 이에 대한 응답으로 HTML,CSS,Javascript 와 같은 파일들도 동시에 반환을 하여 이미 존재하는 동적인 코드들도 다시 랜더링하여 화면에 출력해야하므로 비효율적입니다. 반면, Ajax는 서버에 요청시 응답으로 필요한 데이터만 JSON 형태로 반환하여 페이지 전체로드가 아닌 일부분만 로드하면 되므로 빠른 화면 전환을 기대할수 있습니.. 2019. 8. 5.

티스토리툴바