LazyWon Story

목차 프론트엔드 트렌드 변천사 SSR, CSR, SSG 프론트엔드 프레임워크 비교 🎠 프론트엔드 트렌드 변천사 웹 프론트엔드 트렌드 변천사 전통적인 웹 동작 방식은 웹 서버가 HTML 전체 페이지를 브라우저에게 전송하는 구조로 동작했다. 과거 웹 사이트는 지금에 비해 문서 하나에 전달되는 파일 용량이 매우 적었다. User Interaction이 거의 없는 단순한 HTML, CSS 자체의 정적인 페이지를 개발하는데 그쳤다. 그래서 어떤 요소를 한 번 클릭하면 완전히 새로운 페이지를 서버에서 전송해주곤 했다. 이후 동적인 웹 서비스가 등장하면서 웹 서버가 HTML 페이지와 더불어 Javascript를 통해 필요한 데이터만을 주고받으며, User Interaction을 구현하게 되었다. Javascript를..

목차 서버와의 데이터 통신을 위한 API 호출 메소드 만들기 서버 데이터 렌더링 Mock 서버에 API를 생성하고 테스트 데이터를 등록하는 방법과 Vue 컴포넌트에서 Mock 서버에 등록한 API를 호출하여 서버 데이터를 바인딩 하는 방법에 대해 알아보겠다. 서버와의 데이터 통신을 위한 API 호출 메소드 만들기 모든 데이터를 서버로부터 가져오고 사용자 인터렉션을 통해 발생한 데이터는 서버로 보내서 데이터베이스에 저장해야 한다. 서버 통신을 위해 가장 많이 사용하는 패키지 중 하나인 Axios를 이용해 API 호출 메서드를 개발해서 앞으로 구현하는 모든 Vue 컴포넌트에서 사용할 수 있도록 전역 메소드로 등록 하겠다. ♣ Axios란 ? Axios는 서버와 데이터를 송수신할 수 있는 HTTP 비동기 통신..

목차 Postman 설치 Mock 서버 생성 API 반환 데이터 설정 Postman의 Mock 서버를 생성하여 서버 환경이 준비되어 있지 않더라도 효율적으로 프론트엔드 개발을 진행하기 위한 방법 중 하나인 Mock(가짜) 서버를 사용하는 방법에 대해 알아보자. 일반적으로 Postman은 개발된 API가 제대로 동작하는지 테스트 용도로 많이 사용되는데, 그런 용도 외에도 매우 많은 기능을 제공한다. 그런 유용한 기능 하나가 바로 Mock 서버이다. Postman 설치 https://www.postman.com/download https://www.postman.com/download www.postman.com Mock 서버 생성 Create New 메뉴를 클릭하여 팝업이 나타나면 Mock Server를 ..