angular
-
FrontEnd의 관점으로 바라본 MVVMWeb Programming 2024. 1. 10. 14:56
MVVM의 등장배경 기존 디자인 패턴(MVC, MVP)등에서 단점으로 이야기되는 View의 의존성을 최소화하기 위해 등장 MVVM 기본 MVVM은 Model, View, ViewModel의 머리만 따와서 명명되었습니다. 기존의 MVC 패턴에서 화면이 복잡해질수록 Controller가 비대해진다는 문제와 View가 Controller와 강하게 결합되어 있는 문제를 해결하기 위해 MVVM 패턴이 제안되었습니다. MVVM에서 가장 중요한 개념이라면 Observer 패턴을 통한 Data Binding이라고 할 수 있습니다. 기존의 Controller에서 Model의 변경에 따라 View를 직접 변경해주었다면 MVVM은 바인딩을 통해 이를 자동으로 업데이트 해줍니다. FrontEnd에서의 MVVM 프론트에서 MV..
-
AngularJS에서 CRUD 구현하기 #2Web Programming/Angular JS 2020. 9. 11. 12:27
지난 글에 이어 오늘은 Create를 구현해보자. 우선 데이터를 받아와 저장할 수 있는 board의 포맷이 필요하다. $scope.boardForm = {}; 태그 내부에 boardForm이라는 변수를 만들어준다. 이 변수는 $scope 객체에서 JSON 변수로 저장된다. Title : Name : Add 게시판 태그 위에 이렇게 태그를 배치하고 내부에 table을 만들어준다. Title과 Name을 입력 받을 수 있는 input을 만들어 boardForm이라는 형식으로 저장한다. submit 버튼을 통해 insert 함수가 실행되게 한다. $scope.insert = function() { var newId; if(! $scope.boardlist.length) { newId = 1; }else { n..
-
AngularJS에서 CRUD 구현하기 #1Web Programming/Angular JS 2020. 9. 10. 19:12
이번 글에서는 AngularJS의 기본 구조를 이용하여 가벼운 게시판을 만들어 CRUD를 구현해보려한다. 게시물은 DB 연동 대신 JSON 배열(JavaScript Object Notation)을 활용한다. JSON의 활용법에 대해서는 다음 문서를 참고하자. 참고 : tcpschool.com/json/json_basic_structure 태그 내부에 다음과 같은 코드를 작성한다. 이를 통해 boardlist에 게시판의 정보가 저장된다.