네발로 코딩하는 포메라니안

1. Vue Instance Vue는 javascript기반이므로 혹은 .js파일에 작성한다. Vue Instance는 아래의 코드를 말한다. new Vue({ /*속성: 값*/ }) 속성 설명 el Vue가 적용될 element를 지정 (값 = CSS Selector | HTML 태그명) data Vue가 사용하는 정보 등록하는 곳으로, (1) 객체 형태와 (2) 함수 형태(권장)가 있다. template 화면에 표현할 HTML, CSS등을 정의하는 속성 methods 화면 로직 제어(이벤트 처리 등)와 관련된 method 정의 lifecycle 속성 (beforeCreate, created, ..., destroyed) Vue Instance의 생성 전, 생성 후, ... , 소멸 후에 실행할 로직 ..

1. Vue.js란? 쉽게 생각하면 Frontend의 프레임워크라고 할 수 있으며, 가볍다는 것이 장점이다. 2. MVVM Pattern (Model + View + ViewModel) Model : 순수 JS 객체, Logic처리 View : 웹페이지 DOM (= html) ViewModel : Vue Vue가 view와 model을 자동으로 바인딩해서, 양방향 통신을 가능하게 한다. 풀어서 설명하자면, Vue가 DOMListener를 통해 DOM을 보고 있다가 변경사항이 생기면 JS에 반영한다. 반대로 DataBinding을 통해 JS에서 Data가 변경되면 DOM에 반영한다. 3. Vue 시작하기 1. Chrome 웹스토어에서 개발자 도구 추가 웹스토어에서 vue검색(아래 사이트) > Vue.js ..

1. Spring MVC 프로젝트 구조 파일 구조는 위와 같으며, src/main/webapp/META-INF/context.xml은 직접 생성해야 한다. 없으면 Servers 폴더에 있는 파일이 실행된다. 2. XML 설정 파일 1. pom.xml - 프로젝트의 개발 환경 설정 ex) java버전, 필요한 library 등록 등 2. server.xml - Servers폴더 내에 위치 - server의 설정파일 - 실행 시킬 프로젝트가 등록되어 있다. 3. context.xml - "web project"의 환경 관련 설정 파일 ex) DB Connection Pool 4. web.xml - "web project"의 실행 관련 설정 파일 - Tomcat이 뜨자마자 web.xml을 실행해서 contex..

1. Spring MVC 프로젝트 생성하기 New > Spring Legacy Project Project name을 작성하고, Spring MVC Project를 선택한 후 [Next] package는 최소 3-depth로 작성하며, 여기서 mvcproject가 앱 이름이 된다. 2. 프로젝트 환경 설정하기 pom.xml에 자신의 프로젝트에 맞는 버전으로 수정, 필요한 library추가하기 프로젝트 우클릭 > Maven > Update Project... 생성한 프로젝트 선택 > [Force Update of Snapshots/Releases] > [OK] 까지하면, 아래에 업데이트 상태를 보여준다. 되도록이면, 업데이트가 끝날 때까지 프로그램을 만지지 않는 걸 권장한다.

1. Spring MVC란? Spring이 제공하는 기능 중, Servlet 기반의 MVC Framework가 있다. Spring MVC = 기존의 MVC + Front Controller이다. 기존의 MVC패턴에 대한 설명은 아래 글에 있다. 2022.03.27 - [웹프로그래밍/Servlet & JSP] - Servlet & JSP (3) - MVC 패턴 Servlet & JSP (3) - MVC 패턴 1. MVC 패턴이란? Model-View-Controller로 구조를 만들어 개발하는 개발 패턴이다. 이 패턴에 따라 개발하면 분업이 되어 유지보수가 쉽다고 알려진 형식들 중 하나이다. Controller가 Model과 View의 다리 역 yerinpy73.tistory.com 2. Spring MV..

0. DB 관련 library 불러오기 아래 사이트에서 코드를 복사해서 설정파일(application.xml 또는 pom.xml)에 붙여넣고 저장한다. 1) MySQL이 제공하는 connector https://mvnrepository.com/artifact/mysql/mysql-connector-java/8.0.28 2) jdbc https://mvnrepository.com/artifact/org.springframework/spring-jdbc/5.3.19 1. DB 테이블과 DTO(데이터 객체) 만들기 Workbench를 열어, 이름과 나이 정보를 담을 테이블을 만든다. DB에서 값을 읽어와서 출력하는 기능 구현이 목표라서 값을 미리 넣어준다. create database testdb; use t..

xml파일 없이, 완전한 Annotation은 Java를 통해 구현할 수 있다. 1. 등록할 객체에 Annotation 작성하기 아래 글에서 2. Annotation 작성하기 를 따라 작성하면 된다. 2022.04.23 - [웹프로그래밍/Spring] - Spring (3) - Container에 객체(Bean) 설정하기3 : Annotation Spring (3) - Container에 객체(Bean) 설정하기3 : Annotation 0. Annotation 1. Stereotype Annotation Stereotype Annotation은 Bean을 등록할 때 사용할 수 있는 annotation이다. Stereotype 적용 대상 @Controller MVC Controller에 사용 @Servi..

0. Annotation 1. Stereotype Annotation Stereotype Annotation은 Bean을 등록할 때 사용할 수 있는 annotation이다. Stereotype 적용 대상 @Controller MVC Controller에 사용 @Service Service 계층 @Repository DB에 접근하는 계층 ex) DAO @Component 위의 계층에 속하지 않은 경우 ex) DTO 등 2. 의존 관계 설정 Annotation Annotation 설명 @Autowired Spring에서만 사용 가능 멤버 변수, setter, constructor, 일반 method에 사용 가능하며 타입에 맞춰서 연결함 예시 => 2022.04.20 - [웹프로그래밍/Spring] - Spr..

1. 객체(Bean) 등록할 XML파일 생성하기 src 우클릭 > [New] > [Spring Bean Configuration File] 파일 이름은 보통 application.xml을 사용한다. [Next] > beans 선택 > [Finish] 2. Container에 등록할 객체 설정하기 XML에 사용하는 태그에 대한 설명은 아래 [더보기]를 클릭해서 볼 수 있다. 더보기 *XML에 사용하는 태그 설명 태그명 설명 Root tag로, 이 태그의 body안에 모든 내용을 작성한다. *xmlns = ".../beans" = 원래 로 작성해야 하는데, beans는 앞에 아무것도 안쓰는 것으로 설정하는 것이다. 따라서 으로 작성하면 된다. Spring Container가 관리할 객체 설정 name 주입 ..

Container에 객체를 설정하는 방법을 살펴보기 앞서 테스트를 위한 프로젝트를 먼저 생성해야 한다. Spring Boot가 아닌 일반 Spring Project는 [Spring Legacy Project]로 만든다. 하지만, '여기서는 Web을 만들지 않아도 되기 때문에, MVC패턴이 없는 Spring Project를 썼다. 굳이 쓰지 않는 파일까지 만들지 않고 보기 편하게 하기 위함이다. 1. Java Project 생성 2. Maven Project로 전환 Spring에서 필요한 library들을 Maven으로 쉽게 받아오기 위해, 전환한다. 생성한 Java Project에 마우스 우클릭 > Configure > Conver to Maven Project > Finish (수정 필요 X) 3. p..