본문 바로가기

전체 글16

Vue #3 - 뷰 컴포넌트 컴포넌트란? 컴포넌트란 조합하여 화면을 구성할 수 있는 블록을 의미한다. 컴포넌트를 활용하면 화면을 빠르게 구조화하여 일괄적인 패턴으로 개발할 수 있다. 화면의 영역을 컴포넌트로 쪼개서 재활용할 수 있느 형태로 관리하면 나중에 코드를 다시 사용하기가 훨씬 편리하다. 또한 모든 사람들이 정해진 방식대로 컴포넌트를 등록하거나 사용하게 되므로 남이 작성한 코드를 직관적으로 이해할 수 있다. 뷰에서는 웹 화면을 구성할 때 흔히 사용하는 내비게이션 바, 테이블, 리스트, 인풋 박스 등과 같은 화면 구성 요소들을 잘게 쪼개어 컴포넌트로 관리한다. 컴포넌트 등록하기 컴포넌트를 등록하는 방법은 전역과 지역의 두 가지가 있다. 지역 컴포넌트는 특정 인스턴스에서만 유효한 범위를 갖고, 전역 컴포넌트는 여러 인스턴스에서 공.. 2021. 12. 11.
Vue #2 - 뷰 인스턴스 뷰 인스턴스의 정의와 속성 뷰 인스턴스는 뷰로 화면을 개발하기 위해 필수적으로 생성해야 하는 기본 단위다. 'Hello Vue.js!' 텍스트가 화면에 표시된 것은 인스턴스가 있었기 때문에 가능한 것이다. 인스턴스튼 뷰로 화면을 개발하기 위해 빠트릴 수 없는 필수 조건이다. 'Hello Vue.js!' 텍스트를 화면에 표시하기 위해 new Vue()로 뷰 인스턴스를 생성하였다. 그리고 인스턴스 안에 el 속성으로 뷰 인스턴스가 그려질 지점을 지저하고, data 속성에 message 값을 정의하여 화면의 {{ message }} 에 연결하였다. 뷰 인스턴스 생성자 new Vue()로 인스턴스를 생성할 때 Vue를 생성자라고 한다. Vue 생성잔느 뷰 라이브러리를 로딩하고 나면 접근할 수 있다. 생성자를 사.. 2021. 12. 11.
Vue #1 - Vue를 시작해보자! Vue를 시작해보자! 빠르게 변하는 프런트엔드 시장에서 요즘 가장 주목을 받고 있는 Vue.js에 대해 실습을 해보면서 차근차근 알아본다. Vues.js는 웹 페이지 화면을 개발하기 위한 프런트엔드 프레임워크다. 기존 웹 개발자뿐만 아니라 HTML, CSS, 자바스크립트 기초만 아는 웹 개발 입문자 및 컴퓨터 비전공자들도 배우기 쉽게 만들어졌다. 개발도구의 준비 Vue를 시작하기 전에 다음과 같은 개발도구를 설치한다. 구글 사이트에서 'chrome' 이라고 입력하여 다운로드를 받는다. 구글에 'visual studio code'를 입력하고 다운로드를 받는다. 구글에 'node js'라고 입력하고 다운로드를 받는다. 구글에 'vue.js dev tools'를 입력하고 다운로드를 받는다. Vue.js란? .. 2021. 12. 11.
Spring Boot #2 - Maria 데이터베이스와 Spring Data JPA MariaDB의 설치와 데이터베이스 생성 MariaDB 최대의 장점은 MySQL과 거의 동일한 기능을 제공하면서도 완전한 오픈소스라는 점이다. MariaDB를 통해서 사용화된 서비스를 개발하고 운영하여도 라이센스 비용에 대한 걱정 없이 시스템을 운영할 수 있고, AWS와 연동 시에도 최소한의 비용으로 운영이 가능하다는 장점이 있다. MariaDB의 대한 설치와 생성은 아래 블로그 사이트를 참조한다. https://offbyone.tistory.com/199 Windows 10에 MariaDB 설치하기 개발용으로 Windows 10 PC에 MariaDB 를 설치해 봅니다. 1. http://mariadb.org/ 에 접속하여 다운로드 페이지로 들어갑니다. 2. 실제 다운로드 URL은 https://down.. 2021. 12. 4.