STUDY39 Vue 📌 Component 기반 Layout 구성 레이아웃 나누기 >> (terminal) vue create page-layout >>default vue 파일들은 자신만의 html, style, script를 가지고 있기 때문에, component 별로 독립된 환경을 가지고 개발할 수 있음. 📌 state, props 란 state : 나의 data props : 누구로부터 받는 data 📌data binding (v-model) Data Binding : vue는 양방향/단방향 데이터 바인딩 다 가능 ( vue 인스턴스와 component가 서로 데이터 접근을 하냐에 따라 나뉨 ==> 양방향 - o / 단방향 - x) 단방향 데이터 바인딩 : v-for 이용하여 리스트 렌더링 >> name,img,lin.. 2023. 4. 2. Vue 📌 Vue 는 무엇인가 ? : 사용자 인터페이스를 구축하기 위한 JavaScript 프레임워크 + 표준 HTML, CSS 및 JavaScript를 기반으로 구축 + component 기반의 SPA(single page application)사이트 구축가능 ※ component >> view를 구성하는 작은 조각들 : 페이지 규모가 커질수록 html 구조 복잡해짐 >> 관리 힘듦 >> component 개념 도입>> 한 페이지를 다 쪼갈라서(?) 관리 ※ SPA (Single Page Application): index.html하나, 단일 js파일을 가지고 vue application 을 구동함 >> 최초 로딩시에 html, js 미리 로딩하여 페이지 전환이 될 경우 페이지 이동하지 않고, 전환될 부분만 .. 2023. 3. 30. 28~31 더 나아가기 📌DB 연동하기 이전 H2는 매 서버 실행시, 범위 데이터를 초기화 >> 유지될 수 있도록 DB설치 data.sql 없애기 ※ PostgreSQL 설치 https://www.postgresql.org/download/ PostgreSQL: Downloads www.postgresql.org 설치 디렉토리 :기본값/ components : stack builder제외 다운/ 데이터 디렉토리 : 기본값 superuser PW 설정>> 해당 PW 알아야 DB접속 가능 포트번호 그대로 db cluster Locale : KR, UTF-8 pgAdmin(>>postgreDB를 쉽게 사용할 수 있는 도구) 실행(검색창 검색) >> sql 작성 및 동작해볼 수 있음, ※ DB 드라이버 설치 build.gradle /.. 2023. 3. 29. mapper / repository 차이 문득 회사 컴퓨터에서 mapper가 보이는데, 이게 repository 의 역할인 것 같은데...........!......?..... 검색을 해도 비슷한 역할이라 함. 그래도 왜 repository를 안쓰고 mapper를 쓰는지? 검색해봄. ( + PM님께 여쭤본 결과, mybatis(ORM(Object-relational mapping)역할)를 사용하면서 >> @mapper 어노테이션 사용했을 때, db검색해서 해당 객체와 sql문 작성하고, 연결 아? 그럼 mybatis 사용안하면 @mapper도 사용안하겠네여? ㅇㅇ/ @repository는 db조회 중점)이라고 답주심! ) 그래도 검색검색!!🔍 마이바티스란? 마이바티스는 개발자가 지정한 SQL, 저장프로시저 그리고 몇가지 고급 매핑을 지원하는 퍼.. 2023. 3. 28. 18~21 #REST API와 테스트 📌REST API와 JSON REST API : 웹서버의 자원을 클라이언트에 구애받지 않고 사용할 수 있게 하는 설계 방식, 모든 클라이언트 기기가 대응을 할 수 있게 하기 위한 설계방식으로, http를 통해 서버의 자원을 다루게 하는 기술 이때 서버의 응답은 특정기기에 종속되지 않도록, 모든 기기에서 사용할 수 있게 화면이 아닌 데이터만을 반환함. 데이터 응답은 예전엔 xml 형식으로 사용했으나, 최근에는 JSON형식 { "userId": 1, "id": 1, "title": "delectus aut autem", "completed": false } 이런형태가 JSON형식 {key:value, ...} ※ xml : 일종의 사용자 정의형 html / json : 자바스크립트 방식을 차용한 객체 표현식.. 2023. 3. 27. 7~17 #게시글CRUD 각 해당코드들은 url 첨부한 것으로 확인 다 넣기엔 너무 많고, 복잡해지기에,,🥹 CRUD C : create R : read U : update D : delete 📌폼(form)데이터 주고 받기 view templates html 요소인 폼태그에 담긴 데이터 where? ==> action="" how? ==> method="" 보낼지 적어줘야함. 이 데이터를 controller의 DTO라는 객체로 받음. 해당 mustache 내에 dto 필드와 동일한 이름(name="" 속성) 을 넣어주면 연결해서, 데이터를 전달함. ※자바코드가 바뀐다면 재실행 시켜줘야함. 📌데이터 생성 with JPA server는 java언어 // database는 sql언어 서로 알아듣지 못함. 👉JPA가 그걸 해결해줌 j.. 2023. 3. 26. 이전 1 2 3 4 5 6 7 다음