1만 시간의 노력

v-show와 v-if는 특정한 영역을 보여줄것인가 보여주지 않을 것인가에 대한 기능으로 사용된다. 다만 초반에는 v-show와 v-if가 비슷한 것으로 알려져 있는데, 이는 조금 다르다. v-if의 경우에는 조건이 맞을 경우에만 렌더링을 한다. v-show의 경우에는 조건이 맞지 않아도 우선 렌더링을 하고 display 옵션을 none으로 처리한다. 따라서 v-if의 경우 렌더링이 무거운 화면일때 주로 사용하고 v-show의 경우 dialog 처럼 on/off가 잦은 화면이나 뷰에서 사용한다.

인터렉션 둘 이상의 물체나 대상이 서로 영향을 주고 교감하는 하는 행동 크게 사용자 사용자 제스처와 디바이스 효과로 나눌 수 있음. 디바이스 효과(Device effect) 개념 모바일 앱 화면 전환 효과를 말함. 페이드 인 & 아웃 A 에서 B로 화면이 전환될 때 A가 흐려지면서 B가 진해지는 효과 슬라이드 전환 방향에 따라 레프트, 라이트, 업, 다운으로 구분 슬라이드 오버레이 새로나오는 B 화면이 기존에 A화면 위로 올라오는 효과 모바일 앱에서는 메뉴, 설정, 마이페이지 등에 많이 사용됨 슬라이드 리비얼 기존의 A 화면이 나가고 그 자리에 B 화면이 나오는 효과 서브 화면에서 다시 메인화면으로 넘어갈 때 사용 슬라이드 푸시 B 화면이 A 화면을 밀어내면서 나오는 효과 주제가 다른 화면이나 메뉴로 이..

DataClass 와 DataBinding을 이용한 MVVM 패턴 구현하기 첫번째 스텝이다. 먼저 DataBinding을 진행하려면 아래와 같은 설정을 해준다. 설정 project 단위의 gradle에 아래와 같은 설정을 해준다. plugins { id 'kotlin-kapt' } android { .... dataBinding{ enabled = true } } DataClass 만들기 User라는 DataClass를 만들어서 Model 형태로 사용한다. data class User( val firstName : String, val lastName : String } layout.xml 에 DataBinding 진행하기 xml 파일로 되어있는 layout 파일에 dataBinding을 해준다. 여기서..

Junit을 사용하여 unit test를 진행할 때 Command line is too long. Shorten command line for ... 이런 에러가 뜨는 경우가 있다. 이경우에는 configurations 에 들어가서 아래와 같은 설정을 해야한다. 1. Android Studio -> Run -> Edit Configurations 2. Shorten command line 을 classpath file로 변경 3. 실행 하면 정상적으로 실행된다.

어플리케이션을 릴리즈하면 버전별로 Tag를 달아둔다. 이때 local에 tag를 만드는것 까지는 ok! 하지만 결과적으로 다른 사람들도 이 Tag를 봐야 향후에 히스토리 관리 및 유지보수가 용이해 진다. 따라서 remote에도 tag를 push해야 한다는 것! 이때 아래와 같이 커맨드를 입력하면 생성된 태그가 remote로 올라간다. git push origin --tags

기본적으로 Vuex를 사용하면 mutation을 이용한 action.js 파일에서 commit을 한다. 즉, API를 이용해 받은 response값을 commit으로 저장하여 getter를 호출해 가져오는 형태로 사용한다. 하지만 가끔 *.vue 파일에서 특정한 값을 저장해서 getter로 손쉽게 불러와야 하는 경우가 발생한다. 이때. 우리는 아래와 같이 쓴다 this.$store.commit("setData", this.data); 이미 main.js에 store가 선언되어 있고 setData라는 mutations을 사용하는 방법이다. 위 코드를 사용하면 setData 를 통해서 this.data 값이 미리 선언된 글로벌한(?) 변수에 저장이 되고 이를 getter를 이용해 가져다 쓸수 있게 되는 것...

Vue를 이용해서 Scroll Event를 쉽게 처리할 수 있다. 기존 자바스크립트를 이용하면 window.addEventListener ... 등의 코드를 이용해서 사용한다. Vue를 최대한 활용해서 적용하였다. ....... 간단하게 설명하면. 1. v-container 에 id 값을 준다. - 이렇게 되면 v-container 태그 안에 있는 내용이 스크롤링 된다. 2. v-scorll:#main="handleScroll" 코드로 main id값을 가진 태그에서 scroll 이벤트가 발생하면 handleScroll method가 실행되도록 한다. 3. data 영역에 scrollPostion을 선언한다. 4. handleScroll(e) method를 통해 e.target.scrollTop 값을 s..

이번에 프로젝트를 하면서 팔자에도 없는 암호화 한다고 아주 머리아팠다... 사실 지금까지의 암호화? 라고 하기에는.. 그냥 라이브러리를 갖다 쓰거나, 해당 라이브러리에서 자체적으로 암호화를 해주는 것들로 했기 때문에 디테일 하게 보지도 않았을 뿐더러... 암호화라는 이론적인 지식에 큰 관심이 없었는데 이번에 앱에서 인증서를 관리해야하는 상황이 와서 인증서 데이터를 암호화 해야하는 상황이 발생했다. 인증서는 다른 업체를 통해 받는데, 인증서를 통해서 추출한 민감데이터를 서버에 송수신할때 사용할 암호화였다. 암호화를 어떤 기법(?)을 사용해야 하는지 몰라서 이것저것 찾아보다가 결국 인증서 업체에 문의.. RSA 암호화를 사용해야 한다고 했고 바로 적용하려고 하였으나... 너무 어렵고.. 이론 공부를 좀 했다..

나처럼 데이터바인딩을 처음 하면 자동으로 생성되는 클래스 등에 대한 이해가 낮다 따라서 나도 약 20분 정도 제목과 같은 이슈로 고생했는데 사실 나는 내 실수로 그렇게 되었고... 어찌 되었든 정보를 공유하고자 글을 쓴다. 내가 다른 블로그의 글을 따라서 하다가 최종적으로 실행을 할때 겪은 에러 error: cannot find symbol import com.cleancode.android_espresso_test.databinding.ActivityMainBindingImpl 나는 ActivityMainBindingImpl 이라는 것을 생성한 적이 없는데 느닷없이 이런 에러가 발생하여 꽤나 당황하였다. 해당 원인을 해결하는 방법은 대표적으로 3가지가 있다. 1. clean Project 2. rebu..

Kotlin 을 이용한 Data Binding을 위한 셋팅 데이터 바인딩은 넓은 호환성을 위해 Android 2.1 이상(API level 7)에서 사용할 수 있도록 되어 있음. ( 엄청난 호환성.. ) 1. 세팅 plugins { id 'com.android.application' id 'kotlin-android' id 'kotlin-kapt' } .... dataBinding{ enabled = true } Module level의 Gradle에 위와 같은 설정을 해준다. MainActivity에 버튼을 하나 만들어서 로그를 출력하는 형태로 개발 activity_main.xml 의 경우 기본 설정되는 layout을 감싸는 형태로 layout을 써줘야 한다. 말이 이상한데 아래 코드를 보고 확인 위 ..