Vue.js/Spring & Vue APP 프로젝트(프론트엔드)(20)
-
21.03.21 lamplight서비스 프로젝트(요청수정페이지,회원정보페이지,회원수정페이지까지 DB연계 완료)
#NOTE -요청 수정 페이지[ㅇ] -회원정보 수정 페이지[ㅇ] -평점/후기페이지[...] #주요소스코드 요청서 수정 페이지 1 2 3 4 5 1 2 3 4 5 1 2 3 4 5 1 2 3 4 5 1 2 3 4 5 로그인 후 이용해주세요. My Page 회원유형 {{state.member.authLevel}} 아이디 {{state.member.loginId}} 이름 {{state.member.name}} 닉네임 {{state.member.nickname}} 전화번호 {{state.member.cellphoneNo}} 이메일 {{state.member.email}} 주소 {{state.member.address}} 회원정보수정 탈퇴 로그인 후 이용가능합니다.홈 으로 이동 회원정보수정 일반회원 도우미 지도사..
2021.03.21 -
21.03.20 lamplight서비스 프로젝트(지도사 리스팅,요청페이지, 요청페이지 상세보기,요청페이지 리스팅까지 DB연계 완료)
#NOTE -members값 가져오기[ㅇ] -요청페이지[ㅇ] -상세페이지[ㅇ] -리스트페이지[ㅇ] OrderDetailPage.vue--53
2021.03.20 -
21.03.16 lamplight서비스 프로젝트(리스트 필터링, 검색기능 구현)
# NOTE props -props 속성은 컴포넌트 간에 데이터를 전달할 수 있는 컴포넌트 통신 방법입니다. -props 속성을 기억할 때는 상위 컴포넌트에서 하위 컴포넌트로 내려보내는 데이터 속성으로 기억하면 쉽습니다 # 주요 소스코드 이름 시/도 시/군/구 읍/면/동 검색 {{ director.name }} 소개멘트 작성란입니다. 지역 - {{ director.address_state }} {{ director.address_city }} {{ director.address_street }} 활동이력 - {{ director.cellphoneNo }} - {{ director.email }} - {{ director.regDate }} 선택 '{{ director.name }}'님의 전체 평점 4.5..
2021.03.16 -
21.03.15 lamplight서비스 프로젝트(리스트 검색기능 구현 진행중..)
# NOTE https://learnvue.co/2020/12/setting-up-your-first-vue3-project-vue-3-0-release/ https://codepen.io/rbqja5597/pen/XWjqOGN?editors=1000 # 주요 소스코드 이름 닉네임 아이디 1 2 검색 {{ searchKeyword }} {{ member.name }} 소개멘트 작성란입니다. {{ member.cellphoneNo }} {{ member.email }} {{ member.regDate }} 선택 '{{ member.name }}'님의 전체 평점 4.5/5 매칭 후기 더보기 후기를 작성합니다. Lorem ipsum dolor sit amet consectetur adipisicing elit..
2021.03.15 -
21.03.11 lamplight서비스 프로젝트(초기셋팅, 리스트페이지 디자인, 백엔드 게시물불러오기,입력값보내기 테스트까지 완료)
# 주요 소스코드 {{ article.title }} {{ article.regDate }} 검색 홍길동 간단하게 자신을 소개할 멘트를 작성해주세요. 지역: 대전광역시 자격증: 장례지도사 2급 경력: 5년 '홍길동'님의 전체 평점 4.5/5 매칭 후기 더보기 후기를 작성합니다. Lorem ipsum dolor sit amet consectetur adipisicing elit. 2021-03-11 15:15:15 후기를 작성합니다. ipsum, sapiente earum voluptates reiciendis fuga sit! Minima quaerat sit sed iusto consectetur. 2021-03-11 15:15:15
2021.03.11 -
21.03.03 lamplight서비스 프로젝트(글쓰기,상세페이지,로그인 ~ 회원가입까지)
#NOTE 1.form 방식 일반 form 형식 2.axios json 방식 json 형식 :to와 to의 차이?? :이 있으면 자바스크립트 사용 가능 ex) to="article/list" :to="'article/list?boardId' + article.boardId" protected _handleResponse(axiosResponse:AxiosResponse) : AxiosResponse { // 로그인 정보 체크 // axiosResponse?.data?.resultCode == "F-A" || axiosResponse?.data?.resultCode == "F-B" (초보 버전) // axiosResponse?.data?.resultCode == "F-A" => 로그인 정보가 아예 없는 경..
2021.03.03 -
21.02.24 lamplight서비스 프로젝트(게시물 추가 테스트, 백엔드 연결, 게시물 번호별 리스팅 등)
#NOTE typescript에서는 title:string, body:string 이런식으로 type을 적어주어야 한다 setup() - setup() 함수는 프로그램 실행시 단 한번 호출된다. - setup() 함수는 프로그램당 한 개씩만 존재할 수 있으며, 최초 한 번 실행된 이후에는 재호출되지 않아야 한다. - 참고: setup() 함수 안에 선언된 변수는, draw() 함수를 비롯한 여타 함수들이 접근할 수 없다. submint.prevent - 말그대로 submit을 막는 것 reactive - reactive는 기존 뷰 문법의 data 속성 느낌이고, - ref는 좀 더 리액티브 속성을 개별적으로 선언하는 느낌....??? state?? 기존 코드에서는 props, data, methods가 ..
2021.02.24 -
21.02.22 lamplight서비스 프로젝트(FormRow 전역 컴포넌트 적용, 상황별 버튼 셋팅, 폰트 적용 등)
# NOTE @apply? - tailwind 방식을 style에 적용할 수 있도록 해주는 것? - 즉, class에 css를 입력하는 tailwind를 style에 바로 입력하는 것 https://tailwindcss.com/docs/functions-and-directives # 소스코드 {{title}} HOME ARTICLE LIST @tailwind base; @tailwind components; @tailwind utilities; /* 여기에 css를 저장할 수 있음 */ @font-face { font-family: 'LotteMartDream'; font-style: normal; font-weight: 400; src: url('https://cdn.jsdelivr.net/korean..
2021.02.22 -
21.02.21 clean서비스 프로젝트(TitleBar 전역 컴포넌트 개념 도입, slot 도입)
전역 컴포넌트 - 자주쓰는 컴포넌트를 app 수준에 적용을 시켜 각 페이지 vue에서 더이상 일일이 컴포넌트를 임포트하고, 정의하지 않아도 되도록 하는 것 Home Main
2021.02.21 -
21.02.20 clean서비스 프로젝트(vue 개발환경 셋팅 및 기초 연습)
# NOTE - java 14 등을 설치하듯이 자바스크립트를 사용하기 위해선 node를 설치해야 함 - node는 자바스크립트엔진 - 웹브라우저(구글)에는 웹엔진이 들어있어 자바스크립트를 구현할 수 있음 java 의존성 = 메이븐 node 의존성 = npm - 메이븐 사용시 필요한 라이브러리를 poam.xml에 입력하면 자동으로 다운로드하듯이 - 필요한 라이브러리를 npm install --save jquery 라고 치면 자동으로 다운로드가 됨 - package.json = poam.xml이라고 생각하면 됨 - package.json 파일이 있으면 npm install만 쳐도 기존 라이브러리 복구가 가능함 - vue 3.0 typescript로 작업을 하려면 package.json에 필요한 것들을 다 적..
2021.02.20