본문 바로가기

Vue.js8

2024_09_04_수~09_04_목 오늘의 코딩순서(폴더: vue3Member01)(0904 일지) 목록 생성: MemberListView + index.js + MemberDetailView.vue + member.js(0905 일지)목록 수정: MemberDetailView.vue + index.js + MemberEditView.vue + member.js목록 삭제(Spring) WebConfig + JpaRestApiController (현장HW) memberRepository에서 deleteById(id);만들기+ EntityManager를 이용하여 삭제로직 짜기+ postman에서 화면나오게 하기 + postman에 나오면 docker 새로 만들기: MemberService + MemberRepository + JpaMember.. 2024. 9. 4.
2024_09_03_화 오늘의 코딩순서Docker과 DB연결scottjpa에 권한주고 새 접속 만들기application.yml (Spring) TEAM5 테이블과 MEMBER5 테이블에 데이터 삽입Docker와 TBL연결해서 새 build폴더 만들고 새 컨테이너와 새이미지 만들기∵ 새 접속과 TBL 데이터를 만들었으니까=> ubuntu와 oracle 컨테이너 빼고 삭제, API폴더의 build폴더 삭제 후, 0829일지 참고해서 다시 만들기\DB에서 값 수정후 실시간 Vue 웹 값도 바뀌는지 확인(폴더: vue3Member01) TheHeader.vue + index.js + MemberCreateView.vue + MemberForm.vue + member.js오늘의 코딩 포인트Docker과 DB연결scottjpa에 권한주.. 2024. 9. 3.
2024_08_30_금~09_02_월 오늘의 코딩순서http://localhost:8388/restApi/v1/membersVue (폴더: vue3Member01) + Spring (폴더: oBootJpaApi01)index.js + NestedView.vueindex.js + NestedHomeView.vue + NestedOneView.vue + NestedHomeView.vue +  NestedView.vue+ application.yml(Spring) index.js + AppCard.vue + (components에 members 폴더 만듬) MemberItem.vue + (views에 members 폴더 만듬) MemberListView.vue+ (api 폴더 만들고, members 폴더 만듬) members.js+ WebConf.. 2024. 8. 30.
2024_08_29_목 오늘의 코딩순서CMD창 입력cmd에서 Vue의 새 프로젝트 생성하기Boostrap5 설치 - npm install bootstrap bootstrap-icons라우트 설치 - npm install vue-router통신모듈( axios: ajax와 비슷한 기능) 설치- npm install axiosVue => (폴더: vue3Member01) => Spring의 API를 MSA 방식을 사용하여 서버로 만들기 main.js => 메인 설정 import 추가하기App.vue+ (router 폴더 만듬) index.js + (views 폴더 만듬)HomeView.vue + AboutView.vue+ (layouts 폴더 만듬) TheHeader.vue+ TheView.vue Spring => (폴더: oBo.. 2024. 8. 28.
2024_08_28_수 오늘의 코딩순서(폴더: vue3Basic)(04 폴더)App_keyEvent.vueApp_vFor.vue(05 폴더)App_vmodel.vueApp_watch01.vueApp_watch02.vueApp_watchEffect.vue오늘의 코딩 포인트(04 폴더)App_keyEvent.vueTip) npm install -D sass를 콘솔창에 입력하여 기능 추가하기.prevent점(.)으로 표시되는 특수 접미사로, 디렉티브가 특별한 방식으로 바인딩됨  JavaScript의 Event.preventDefault 메소드를 호출하며, Event 인터페이스의 preventDefault() 메소드는 이벤트가 명시적으로 처리되지 않은 경우에 user agent에 그 기본 액션을 정상적으로 수행해서는 안 된다고 전달 .. 2024. 8. 28.
2024_08_27_화 오늘의 코딩순서(폴더: vue3Basic)(02 폴더)App_toRef.vue(03 폴더)App_computed.vueApp_style_binding1.vueApp_style_binding2.vueApp_vif.vue(04 폴더)App_directive.vueApp_event.vue오늘의 코딩 포인트(02 폴더)App_toRef.vueTip)toRef: book.author: {{ book.author }} book.title: {{ book.title }} book.description: {{ book.description }} author: {{ author }} title: {{ title }}  종류Vue는 상태의 변경을 proxy로 감시하며, 참조가 없는 원시타입.. 2024. 8. 27.