신입개발자_장민기

Foo.vue(라우터 생성) Foo Foo에서 라우팅 연습 FooChild1 FooChild2 export default { props:{ id:String } } router.js //Import import Vue from "vue"; import VueRouter from "vue-router"; //컴포넌트 자식창 import Bar from './components/Bar.vue'; import Foo from './components/Foo.vue'; import Baz from './components/Baz.vue'; import FooChild1 from './components/FooChild1.vue'; /* 수정 */ import FooChild2 from './components/..

Baz.vue Baz props: {{ id }} $route.params.id:{{ $route.params.id }} {{ a() }} : {{ value }} export default { props:{ id:String //수정 }, data: function(){ return { value: ""} }, methods:{ a: function(){ var test=""; test=this.$route.params.id; //수정 console.log(">>>>>>>", test); this.value=test; //수정 } } } App.vue App에서 라우팅 연습 Home login /params:{id=aaa} export default { } router.js //Import import..

이 날은 뭔데 이렇게 백업이 많은지 모르겠다. 마지막 것만 확인해보니 jsp를 폴더에 담고 명칭을 변경한 날이었다. jsp의 경로와 이름을 변경할 경우, 컨트롤러와 jsp 내에서 MVC 작업이 되어 있지 않은 경우, 모든 경로를 다 수정해야 하는 번거로움이 있다.(Spring과 Spring Boot에서는 그런거 없다) 그리고 아이디 검색 기능을 디버그 모드에 추가했다. 팀원 중에 검색 기능이 있으면 좋겠다고 해서 만든 기능이다.

Baz.vue Baz props: {{ username }} $route.query.username:{{ $route.query.username }} {{ a() }} : {{ value }} export default { props:{ username:String //props로 사용 안 됨 }, data: function(){ return { value: ""} }, methods:{ a: function(){ var test=""; test=this.$route.query.username; console.log(">>>>>>>", test); this.value=test; return test; } } } App.vue App에서 라우팅 연습 Home login/abcd /my?username=이순..

Bar.vue {{ pw }} export default { props:{ pw:String } } Baz.vue Baz {{ pw }} export default { props:{ pw:String } } Foo.vue Foo props-od:{{ id }} $route.params.id={{ $route.params.id }} export default { props:{ id:String } } Knu.vue Knu userid= {{ userid }} export default { props:{ userid:String } } NotFound.vue {{ mesg }} not found! export default { props:{ mesg:String } } App.vue App에서 라우팅 연습 ..

라우터란?? 라우터란 한 마디로 '연결 장치'이다. server.js 한 파일에서만 런칭하는 것이 아니라 router를 이용하여 여러 .js 파일에 원하는 코드를 짤 수 있다는 것이다. router를 이용하는 이유는 코드의 간략화 + 가독성 때문이다. server.js 하나에 넣으면 길이도 길어지고 가독성이 떨어진다. 수정하기도 힘들어진다. 이런 문제를 해결하기 위해 router를 쓰면 편리하게 코딩을 할 수 있다. App.vue App에서 라우팅 연습 Home login //컴포넌트 import가 없음 //모든 라우팅 주소는 router 설치 후 //라우터 설치할 곳> npm install vue-router@3 //router.js 생성 후 주소를 router.js파일에 등록함 //router를 ma..

이 날은 성대하게 헛짓을 했던 날이다. 지금 생각해보면 Spring/Spring Boot 때는 전부 해결되는 문제이긴 하다. 당시 서블릿 명칭을 보면 정말 어지럽다. 어떤 것이 어떤 기능을 하는지 알 수가 없었고, 이걸 만든 나도 때로는 기능을 찾는데 헤매곤 했다. 집에 있는 컴퓨터 폴더도 이름 짓는 기준이 있던 나로서는 참을 수 없었고, 나름의 규칙을 새워 서블릿 명칭을 만들었다. 서블릿 명칭의 첫 번째 단어는 Connect / Ajax / Servlet으로 통일되어 있다. Connect: 단순 연결 Ajax: ajax 기능 Servlet: 분기점으로서 서블릿 기능 그 다음 단어는 각 기능의 역할을 의미한다. to OO: OO로 가는 전송되는 기능 check: 중복을 확인하는 기능 match: 사용자가..

오늘은 앞 시간에 Vue 문제를 해결하다가 시간이 다 가서 남은 시간이 얼마 없다... 간단한 것만 후다닥 하자. Mapping 방식 변경 https://frontdev.tistory.com/entry/Spring-ExpirationDate-%EB%A7%8C%EB%A3%8C%EC%9D%BC-%EC%84%A4%EC%A0%95%ED%95%98%EA%B8%B0 [Spring] ExpirationDate 만료일 설정하기 ExpirationDate프로젝트 중에 ExpriationDate를 이용하여 기존 프로덕션의 기한을 주는 인터페이스를 사용하여 포스팅 해보려고 합니다. 우선 Component 를 만듭니다. 커스텀 어노테이션을 만드는데요. 1234 frontdev.tistory.com https://sokdak-..

반드시 DTO로 받아야 함(아니면 400에러) 또는 아예 다른 방식으로 받아야 함(@PathVariable 등) 외부 Vue에서 작성할 경우, Vue나 Spring 자체에서는 에러가 출력되지 않음

DeptList {{ mesg }} 부서번호 부서명 부서부서위치 {{ dept.deptno }} {{ dept.dname }} {{ dept.loc }} import eventBus from "./eventBus.vue" --------- 추가 -------- import axios from 'axios'; export default { //npm install --save axios cmd창에서 실행 //spring에서 AngularDeptWeb 실행 //http://localhost:8016/app/으로 요청 props:{ mesg:String, }, data:function(){ return{ list:[] //부서목록 저장 } }, created:function(){ eventBus.$on("xy..