Vue 인스턴스 Vue 인스턴스에서 제공되는 옵션을 붙여 개발 할 수 있다. el : id를 찾는 함수 data : 값을 넣을 데이터 {{ myText }} 2. 데이터 표시 {{데이터}} v-text : 프로퍼티 html에 표현할 때는 {{ 프로퍼티 이름}} 형식으로 표현 v-html : HTML로 표현 {{ myText }} v-text와 {{myText}는 프로퍼티 텍스트를 그대로 출력하지만, v-html은 HTML로 표현된다. 3. 데이터 종류 Vue에서 데이터 타입은 숫자형, 문자형, Boolean이 있다. 데이터 종류 {{ myPrice * 1.08 }} {{ "안녕하세요~" + myName + "님"}} {{ myName.substr(0,1) }} 배열 오브젝트 배열,오브젝트 {{ myArr..
★ 프로젝트 생성 터미널에서 다음 명령어 실행 vue create oing-vue-project 3 버전 선택 설치 완료 ★ Vue 프로젝트 실행 cd oing-vue-project npm run server 프로젝트 실행 -> npm run serve --port 8081 기본적인 Project 구성
★ 아마존 웹서비스 https://aws.amazon.com/ko/free/?trk=fa2d6ba3-df80-4d24-a453-bf30ad163af9&sc_channel=ps&ef_id=CjwKCAjw44mlBhAQEiwAqP3eVvsNy9f6VIJhnX8u8BU1ermcwbL_M6NgjmHexLYBq_nq3Wcw2AVSLxoCVi0QAvD_BwE:G:s&s_kwcid=AL!4422!3!563761819834!e!!g!!aws!15286221779!129400439466&all-free-tier.sort-by=item.additionalFields.SortRank&all-free-tier.sort-order=asc&awsf.Free%20Tier%20Types=*all&awsf.Free%20Tier%20C..
★ 검색 확인 연산자 null 값 확인 //[Is}Null, [Is]NotNull //- 컬럼 값이 null인 레코드 검색 //[Is]Empty, [Is]NotEmpty //- 컬럼값이 null이거나 빈문자열인 레코드 검색 null 값 확인 ex) List list = itemRepo.findByOwnerNull(); List list = itemRepo.findByOwnerEmpty(); List list = itemRepo.findByOwnerNotNull(); 정렬 //정렬 //List list = itemRepo.findAll(Sort.by(Sort.Direction.ASC, "price")); //List list = itemRepo.findAll(Sort.by("name")); //오름차순 /..
★ 이클립스 실행 WorkSpace > code/server ★ 설정 폰트 인코딩 UTF 8 worspace css HTMl JSP 톰캣 Runtime Server -> Runtime Environment ★ 프로젝트 생성 Dynamic Web Project Project name : "ServletTest" Target runtime : Apache Tomcat 8.5 Dynamic Web Module Version : 3.1 Context Root : "ServletTest" -> "servlet" : 외부 시각 -> src/main/webapps : 내부 시각 ★ Servlet 웹서버측에서 자바를 사용한 프로그램을 동작시키는 기술 목적 : 클라이언트 요청에 따른 동작으로 웹페이지를 만들기 위해서!!..
★ JSON, Java Script Object Notation 자바스크립트 객체 표기법 자바스크립트의 객체를 문자열로 표현할 때 사용하는 포맷 자바스크립트에서 사용 중인 데이터(객체)를 이부 환경에 전달 > (파일입출력, 네트워크에 전달) > 하나의 문자열로 표현하는 방법 > JSON XML과 함께 데이터 전달용으로 많이 사용 언어 독립적 > 대부분의 언어/환경에서 JSON 지원 ■ 규칙 1. 반드시 프로퍼티를 쌍따옴표로 묶는다.(홀따옴표, 역따옴표 불가능) { "name" : "홍길동", "age" : 20 } 2. 반드시 값도 쌍따옴표로 묶는다.(홀따옴표, 역따옴표 불가능) -> 값 : boolean, 숫자 > 그냥 표현 가능 "name" : "홍길동", "age" : 20 3. 메소드 표현 불가능..
★ 지도 API 네이버 맵 API 카카오 맵 API 구글 맵 API ■ 카카오맵 API https://apis.map.kakao.com/ 웹 전용 https://apis.map.kakao.com/web/ ■ 순서 1. 카카오 개발자사이트 (https://developers.kakao.com) 접속 2. 개발자 등록 및 앱 생성 3. 웹 플랫폼 추가: 앱 선택 – [플랫폼] – [Web 플랫폼 등록] – 사이트 도메인 등록 4. 사이트 도메인 등록: [웹] 플랫폼을 선택하고, [사이트 도메인] 을 등록합니다. (예: http://localhost:8080) 5. 페이지 상단의 [JavaScript 키]를 지도 API의 appkey로 사용합니다. 6. 앱을 실행합니다. ■ 1. 애플리케이션 추가 ■ 생성된 ..
★ HighChart 다운로드 https://www.highcharts.com/demo?gclid=Cj0KCQjw6cKiBhD5ARIsAKXUdyZdwsW4qdz_dO66GZ_2Ab5fbvZBdmlGF2sVM_gNxhEv96dipJ2ohMUaAt2kEALw_wcB ■ 사용 코드 ■ 다양한 차트 중 선택 후, 코드 가져오기 https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/demo/line-basic Basic line - JSFiddle - Code Playground jsfiddle.net ■ 사용 결과
