본문 바로가기

전체 글

(36)
[Web Cashbook Project] 화면 구성잡기 30%완료. 드디어 첫 발을 내딛다. JAVA + JSP + SPRING + Oracle DB 로 프로젝트를 진행 할 때는 1~2시간이면 MVC2 방식으로 모든 페이지의 링크를 안정적으로 연결하고 로그인, 회원가입 기능까지 구축이 가능했는데... 그 때와는 달리 vue.js + spring-boot + mysql을 이용하여 이 화면을 만들기까지.. 정말 많은 시간이 걸린 것 같습니다. 참 단순한 헤더, 푸터, 그리고 컨텐츠 페이지들인데.. 이걸 연결하는데까지 이렇게 오래걸릴것이라고는 처음 시작할 때만해도 상상도 못했습니다 ㅠ 물론!!! 이건 진짜 빙산의 일각의 일각일 뿐! 아직 갈길은 멀지만 ㅠㅠ 그래도 첫 발을 떼었다는 것에 잠시 혼자서 감동의 시간을 보내고 있습니다 ㅎㅎ 현재 지금까지의 페이지는 아래의 개발환경으로 만들어졌으며, 추후 다..
도무지 풀리지 않는 app.vue에서 레이아웃 잡기(해결!) 드디어 프로젝트를 시작한다!! 한 지 하루만에 풀리지않는 수수께끼의 늪에 빠졌다. 왜!!! 왜왜!!!! 이 태그의 범위가 623px에 고정되어 더 늘어나지 않는것인지.....ㅠㅠㅠㅠ 헤더와 푸터, 그리고 메인화면을 배치하는데 까지는 성공! slot도 급하게 공부해서 적용해보고, Layouts를 이용하여 틀도 잡아보았지만 app태그의 크기가 고정되어 footer에 Contents의 내용이 묻혀버리는 현상이 계속 일어나고있다. 조금만 더 해보면 풀릴 것 같은데 같은데~~~ 하면서 이방법 저방법을 써보는데도 도무지 해결되지가 않는다. 오늘은 제발 풀렸으면 좋겠다 ㅠ =========================================================== 글 올린지 5분만에 해결되었습니다.ㅠㅠ..
<router-link>를 이용하여 네비게이션 메뉴 만들기 1. 연결 될 컴포넌트 만들기 ->router에 등록하여 사용 할 Component ->router 등록 없이 항시 보여질 Component 2. router/index.js 에 component 등록하기 3. App.vue에 생성한 컴포넌트 연결하기 App.vue파일은 localhost:3000으로 접속 했을 때 보여지는 페이지 입니다. 페이지에서 기본적으로 보여져야 할 헤더와 컨텐츠영역, 그리고 푸터를 화면에 보여질 순서에 맞도록 태그 안에 배치를 하였습니다. 여기까지 작성을 하면서 제가 가장 궁금했던 것은 과연 MainHeader.vue에서 네비게이션 메뉴에 페이지 이동 링크를 어떻게 걸어야 하는가 였습니다. 서칭 끝에 찾은 방법은 를 사용하는 것 이었습니다. (참고사이트 : https://ms4h..
Vue.js 단위테스트 에러 기록 1 (form 바인딩에러) 문제상황: Register Form의 입력과 데이터 모델의 바인딩을 검증하는 테스트에서 data로 전달된 값이 input태그의 value값으로 바인딩 되지 않는 현상 ->RegisterPage.vue ->RegisterPage.spec.js 실제 코드를 가지고 테스트를 진행 했을 때에는 data의 form 값이 input태그의 v-model에 바인딩되어 정상적으로 반영되는것이 확인되었으나, 단위테스트를 진행 할 경우에는 data에는 값이 정상적으로 전달되기는 했지만 그 값이 input태그의 v-model에 바인딩 되지 않았습니다. 정말 이 오류를 가지고 1주일을 넘게 고민해보고 찾아보았지만 명쾌한 답을 찾이 못했고 그러던 중, 아래의 사이트에서 다음과 같은 내용을 발견할 수 있었습니다. https://v..
Vue.js 독학하기(두 번째 책 리뷰) Vue.js 입문책을 완독 한 후, 스프링부트와 vue.js를 이용하여 웹 애플리케이션을 만들어 보기위해 책을 구입 하였습니다. 바로 [스프링5와 Vue.js2로 시작하는 모던 웹 애플리케이션 개발]이라는 책 입니다. 스프링부트에 대한 지식과 vue.js의 모자란 부분을 모두 채울 수 있을것이라 생각해서 구입해 보았는데... 결론부터 말씀드리자면, TaskAgile에 기반을 둔 설명과 예제, 그리고 TDD를 연습해 볼 수 있다는 점이 유익했지만, 한편으로는 이 책 자체가 번역서라 그런것인지 Doit에서 느꼈던 친절함은 없습니다. 또한 예시코드 자체가 뒤로 갈 수록 결과중심으로 나오기 때문에 왜 중간에 에러가 날 수 밖에 없는지 혹은 왜 코드를 이렇게 작성해야 하는지에 대한 설명이 상당히 부족하다고 느꼈습..