인스턴스(Instance) Vue에서 제공하는 API와 속성으로, 뷰로 개발하기 위하여 필수적으로 생성해야 한다. {{ message }} new Vue()로 뷰 인스턴스를 생성할 때의 Vue를 생성자라고 한다. (생성자 인자에는 객체가 들어간다.) 위 예제에서는 뷰 인스턴스 옵션 속성에 el 속성과 data 속성을 사용하였다. 이 외에 template, methods, created, watch 속성 등 여러 속성들이 뷰 인스턴스 옵션 속성으로 미리 정의되어 있다. el 속성 값을 지정해주어야 태그 안 Vue의 기능과 속성들이 유효해진다. el 속성으로 뷰 인스턴스가 그려질 지점을 설정하는 것이다. 참고로 el 속성 값에 html이나 body를 넣는 경우 콘솔 창에 아래와 같은 경고가 발생하고, 제대로..
참고 : https://vuejs.org/v2/guide/ Introduction | Vue.js vuejs.org Vue.js 기초 예제 Vue.js 는 따로 설치할 필요 없이 간단하게만 실행해보려면 html에 스크립트 코드만 한 줄 추가하면 된다. 위 스크립트는 개발 버전이기 때문에 콘솔 창에 경고, 로그 등을 출력해준다. 출력 {{ message }} Vue.js를 사용하여 화면에 message를 출력하였다. Vue.js를 사용하면 데이터와 DOM이 연결되며, 반응형으로 동작하기 때문에 콘솔 창에서 message 값을 변경하면 바로 화면에 변경된 내용이 적용된다. 콘솔 창에서 app.message를 출력하면 기존 new Vue({})에서 설정한 message 값이 들어가 있다. app.message..
Vue.js Devtools https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd Vue.js devtools Chrome and Firefox DevTools extension for debugging Vue.js applications. chrome.google.com 확장 프로그램 설치 구글에 vue.js devtools라고 검색하면 아래와 같이 맨 첫 줄에 Vue.js devtools - Chrome Web Store라고 뜬다. 크롬 브라우저에 설치가 되면 개발자 도구에 Vue가 추가된다. 이렇게 뜨면 뷰 확장 프로그램 설치가 완료된 것이다. 도움말을 보니 편의성도 더 좋아진 거 같아서 점점..
Kotlin을 사용하여 JSON 데이터 가져오기 JSON 데이터 같은 경우는 assets 폴더 내에 있는 JSON 파일들만 인식할 수 있기 때문에 JSON 데이터를 다루려면 assets 폴더가 필요하다. 처음 생성한 프로젝트에는 assets 폴더가 없으니 생성해주어야 한다. 단순히 json 데이터를 가져와 사용하는 것은 쉽지만, json 내에서 단순히 object만 사용하는 게 아니라 array도 사용하고, object와 array를 함께 사용하는 경우도 있다. 개인적으로 object와 array를 혼합하여 사용하는 것 때문에 애를 먹었다. 폴더 생성 assets 폴더 내에 json 파일을 위치시키면 사용할 수 있다. test.json이라는 파일을 아래와 같이 만들어 assets 폴더 안에 추가한다고 가..
MVVM 패턴 마크업 언어나 GUI 코드를 비즈니스 로직 또는 백엔드 로직과 분리하여 개발하는 소프트웨어 디자인 패턴으로, 화면을 모델(Model) - 뷰(View) - 뷰 모델(ViewModel)로 구조화하여 개발하는 방식이다. MVVM 패턴을 사용해 개발하면 화면의 요소들을 제어하는 코드(프런트엔드 영역)와 데이터 제어 로직(백엔드 영역)을 분리하여 코드를 직관적으로 이해하기 쉬워진다. 유지 보수 또한 비교적 편해지는 편이다. Vue.js를 예시로 들어 보자면 MVVM 구조가 아래와 같이 이루어져 있다. 만약 HTML 문서가 변경이 된다면 DOM의 구성 요소도 변경될 것이다. View에서 DOM의 구성 요소가 변경되면(예를 들어 사용자가 다른 페이지로 이동하는 버튼을 클릭하여 화면에 보이는 내용이 달..
[Android][Kotlin] Binding 사용하여 RecyclerView GridLayout 만들기 앞서 RecyclerView를 사용하여 LinearLayout을 만들어보았다. 해당 코드에 추가로 GridLayout을 만들어볼 것이다. [Android][Kotlin] Binding 사용하여 RecyclerView 만들기 Binding 사용하여 RecyclerView 만들기 Binding을 사용하여 생각보다 뚝딱뚝딱 RecyclerView를 만들어볼 수 있다. 안드로이드는 (아마도) 앞으로 할 예정이 없고, 할 마음도 없기 때문에 어떻게 구현되는 mimah.tistory.com 데이터 설정은 위 글에서 모두 하였기 때문에 GridLayout만 만들고 싶다면 관련 코드(CustomAdapter.kt,..
System UI isn't responding 참고 : https://mmol.tistory.com/entry/%EC%95%88%EB%93%9C%EB%A1%9C%EC%9D%B4%EB%93%9C-System-UI-isnt-responding-100-%ED%95%B4%EA%B2%B0%EB%B2%95 안드로이드 System UI isn't responding 100% 해결법 진짜 간단한 방법을 찾았습니다... 단, 이 방법을 사용하면 100% 낫긴하는데 에뮬레이터에 저장한 설정, 데이터가 전부 날아가버리니 주의하시길 바랍니다;;; 1. 원인 제가 원인을 조금 찾아봤는데 mmol.tistory.com 노트북이 자꾸 비명을 지르고 앱도 안 켜지길래 뭔가 했는데 애뮬레이터가 11GB나 차지하고 있었다는 후문
ImageView src 속성에 주소 값 넣기 기본적으로 ImageView의 src 속성에는 drawable 폴더 내에 있는 이미지만 들어갈 수 있다. 인터넷에 있는 이미지 값을 바로 불러오기 위해서는 Glide 라이브러리를 사용해야 한다. build.gradle:app implementation 'com.github.bumptech.glide:glide:4.11.0' annotationProcessor 'com.github.bumptech.glide:compiler:4.11.0' glide 라이브러리 사용을 위해 build.gradle:app 파일을 수정한다. dependencies 내에 위 내용을 추가한다. 사용 import com.bumptech.glide.Glide val tvStoreImg: I..
java.lang.NumberFormatException: For input string: "Y" There was an unexpected error (type=Internal Server Error, status=500). nested exception is org.apache.ibatis.exceptions.PersistenceException: ### Error querying database. Cause: java.lang.NumberFormatException: For input string: "Y" ### Cause: java.lang.NumberFormatException: For input string: "Y" MyBatis에서 if문 사용 중 위와 유사한 에러가 발생하는 경우가 있다. ..
이클립스에서 properties 파일 한글 깨질 때 workspace 인코딩을 UTF-8로 하여도 properties 파일은 한글이 깨지는 경우가 있습니다. 확장자명이 properties 인 파일도 따로 인코딩 설정을 해주어야 깨지지 않습니다. 상단 메뉴의 Window > Perferences를 클릭합니다. 검색 창에 enc를 검색하면 위와 같은 화면이 나옵니다. Content types: 에서 마지막에서 두 번째인 Text 왼쪽 > 표시를 눌러 모든 확장자명이 보이게 합니다. Java Properties File을 클릭하면 Default encoding 값이 ISO-8859-1로 되어있습니다. Default encoding 값을 UTF-8로 변경하면 오른쪽 Update 버튼이 활성화됩니다. Update..
Cause: java.sql.SQLSyntaxErrorException: ORA-00933: SQL 명령어가 올바르게 종료되지 않았습니다 ; bad SQL grammar []; nested exception is java.sql.SQLSyntaxErrorException: ORA-00933: SQL 명령어가 올바르게 종료되지 않았습니다 ] with root cause oracle.jdbc.OracleDatabaseException: ORA-00933: SQL 명령어가 올바르게 종료되지 않았습니다 MyBatis에서 쿼리문 작성 시, 쿼리문 마지막에 세미콜론(;)을 붙이면 위와 같은 오류가 발생한다. 에러 파일 경로는 쿼리문에 담겨있는 .xml 파일 경로로 뜰 것이다. 쿼리문을 아래와 같이 작성하였기 때문에..
reduce reduce 함수 사용을 위해서는 functools를 import 해야 한다. functools.reduce(function, iterable[, initializer]) reduce 함수를 사용하면 첫 번째 인자로 들어가는 function을 사용해서 iterable 한 값을 하나의 값으로 줄일 수 있다. initializer는 주어지면 첫 번째 인자로서 추가된다. 즉, 두 개의 입력을 하나의 결과로 만들 수 있다. 주어진 데이터들의 합을 구하는 함수를 작성해본다. dataset = [1, 2, 3, 4] def total(numbers): result = 0 for number in numbers: result += number return result total(dataset) Out :..
