본문 바로가기

분류 전체보기154

Vue.js [강좌 3-1강정리] 웹펙의 사용이유 인프런 무료강좌중 Vue에대한 기본 강좌가 있어서 공부하면서 정리해봤습니다. 참고용으로 보시면 좋을것 같습니다. 설명도 매우좋고, 초반에 Vue에 대한 개념을 잡을 때 좋은 강좌인것 같아서 추천드립니다. ~ 사이트 주소 : https://www.inflearn.com/course/web-game-vue/# 웹펙의 사용이유 웹펙 관리의 어려움보다 스크립트 관리의 어려움이 커질때 웹펙이 필요하다. 웹펙을 사용하려면 노드를 사용해야하는데, node 홈페이지에서 LTS node버전을 받는 것을 추천한다. 노드를 설치하면 npm을 사용할 수 있는데, 이는 남이 작성한 자바스크립트 라이브러리를 사용할 수 있도록 도와준다. npm init을 하면 package.json파일이 생기는데 이는 내가 사용한 남의 자바스크립.. 2020. 2. 4.
Vue.js - 전역 component / template / vue data / props / [강좌 2강정리] 인프런 무료강좌중 Vue에대한 기본 강좌가 있어서 공부하면서 정리해봤습니다. 참고용으로 보시면 좋을것 같습니다. 설명도 매우좋고, 초반에 Vue에 대한 개념을 잡을 때 좋은 강좌인것 같아서 추천드립니다. ~ 사이트 주소 : https://www.inflearn.com/course/web-game-vue/# (2-1강) Vue 컴포넌트의 사용 이유 컴포넌트 사용은 데이터가 중복되는 것을 피하고 동일한 내용을 반복하고자 할때 사용한다. 컴포넌트를 사용하지 않게 되면, 코드가 지저분하고 중복이 되게 된다. 반복되는 부분을 Component로 만든다. Vue 컴포넌트는 다음과 같이 작성한다. (파스칼 케이스나 케밥케이스를 사용) Vue.component(‘word-replay’); Vue 에서 알아두면 좋은 변.. 2019. 12. 17.
Vue.js - v-if v-else 디렉티브 / 보간법 / v-model / ref [강좌 1강정리] 인프런 무료강좌중 Vue에대한 기본 강좌가 있어서 공부하면서 정리해봤습니다. 참고용으로 보시면 좋을것 같습니다. 설명도 매우좋고, 초반에 Vue에 대한 개념을 잡을 때 좋은 강좌인것 같아서 추천드립니다. ~ 사이트 주소 : https://www.inflearn.com/course/web-game-vue/# 1-1강 ( cdn으로 Vue 사용해보기) Data를 바꾸면 알아서 뷰 화면이 바뀐다. 화면과 데이터를 일치시키는 것이 중요하다. 데이터만 관리한다. => 생각하는 방식을 데이터중심으로 바꾸는 것이 중요하다. 즉 데이터를 바꾸면 View가 바뀐다. 해당 cdn으로 vue.js를 이용할 수 있다. 1-2강 (data와 v-if, v-else) onclick => v.on:click 뷰에서 통제하는 메서드.. 2019. 12. 3.
백준 풀이 2750번 - 수 정렬하기 (+ 삽입정렬 개념) 2070번 문제 여러 정렬알고리즘 중에 삽입정렬 알고리즘을 이용하여 문제를 풀어보았습니다. 삽입정렬이란 ? 삽입 정렬은 말그대로 삽입 (꽂아 넣는 정렬)하는 정렬입니다. 자신보다 앞의 원소가 큰지 작은지 비교해야 하기 때문에 arr[1] ~ arr[n] 까지 진행됩니다. (두번째 원소인 arr[1]부터 시작.) 삽입을 하면 데이터가 하나씩 밀려야 하기 때문에 배열이 길어질수록 효율이 떨어집니다. 추가 특징 ? 버블 소트와 비슷하게 리스트 크기가 크면 불리합니다. (계속 처음부터 끝까지 비교를 하여야 함.) 정렬의 거의 된 데이터일 경우 유리합니다. (교환이 적게 일어남) (이것도 버블과 비슷) 데이터가 역순인 경우 최악의 경우(Worst Case)에는 시간이 엄청 느립니다. (버블) 버블정렬과 다른점 버.. 2019. 10. 1.
안드로이드 - 햇갈리는 Toolbar와 ActionBar 정리 안드로이드의 ToolBar ActionBar 안드로이드를 개발할때 항상 햇깔렸던 것중에 하나인 Toolbar와 Actionbar에 대해서 한번 정리를 해보겠습니다. ActionBar와 ToolBar의 개념 및 차이점 과거 안드로이드는 ActionBar가 기본으로 존재하였고 그것을 커스터마이징 해서 각 앱에 맞게 변경해서 사용하였습니다. 툴바는 안드로이드 5.0 (API Level 21)부터 추가된 위젯(Widget)으로 앱에서 가장 중요한 액션 또는 자주 사용되는 액션들을 제공하는 앱바(AppBar)를 만들때 사용됩니다. 예전에는 AppBar를 만들때 ActionBar클래스를 사용하여 만들어졌는데 그래서 AppBar를 ActionBar라고 부르기도 하며 아직까지 많은 곳에서 이 두 용어를 혼용해서 사용합.. 2019. 9. 20.
안드로이드 - framelayout의 곂친 레이아웃에서 이벤트 클릭 중복 막기 안드로이드상에서 framelayout에 여러 컨텐츠를 넣고 배치할때 가끔 button 또는 layout 클릭이벤트가 중복되어 (즉 상위 컨테이너 이벤트가 하위 컨테이너로 전달되는 경우) 엄청 곤란할 때가 많습니다. 저는 실제로 다이어리 예제 앱을 만들다가 이런 경우가 발생했었는데요.. ㅠ 파란부분에서 캐러셀뷰 이미지 뷰 클릭이벤트를 구현하였고 이 이벤트가 왼쪽 상단 노란부분의 뒤로가기 버튼과 곂치는 일이 발생하였습니다. 그결과 왼쪽 상단 뒤로가기 버튼을 클릭했을 때에도 사진 업로드 팝업이 뜨게 되는 일이 발생하게 되었습니다. 이에 대한 해결법은 매우 간단합니다. // 상단의 TopMenu가 클릭될때 뒤쪽의 캐러셀도 같이 터치되는 동작을 막기위한 코드 RelativeLayout rlTopMenu; rlTo.. 2019. 8. 20.
Lombok 설치시 transformClassesWithDexBuilderForDebug 에러 Android studio 3.1.2 버전에서 gradle 4.10.1 버전으로 앱을 만들고 있던중 Lombok을 적용할 일이 생겼다. compileOnly "org.projectlombok:lombok:1.18.4" annotationProcessor "org.projectlombok:lombok:1.18.4" 위와 같은 형식으로 Lombok을 적용하였는데 다음과 같은 에러가 발생하였다. lombok 1.x.x throws transformClassesWithDexBuilderForDebug 원인은 Java8이 잠재적으로 .class file의 사이즈를 줄이는데 mothod count까지 줄이면서 문제가 발생하는것 같다는 의견이 있었다. 정확한 원인은 파악하지 못했다. gradle.properties에.. 2019. 8. 7.
안드로이드 - 거주지 입력 - 동주소까지 입력받기 (노가다) 안드로이드 동주소 입력받기 안드로이드에서 거주지를 입력하는 화면을 만들고 싶을 때가 있습니다. 주소 검색 API를 쓰는것도 한가지 방법이지만, 만약 동주소까지만 입력받고 싶다면 주소검색 API를 쓰는것이 무겁기도 하고, 목적에 맞지 않는 API 사용일 것입니다. 저는 한가지 방법으로 안드로이드의 res/values/arrays.xml에 - 행정자치구역 - 시 / 군 / 구 - 동주소 (서울시일경우에만) 데이터를 입력한 뒤에 해당 값을 Spinner를 통해 사용자들이 선택하도록 구현해 보았습니다. 눈물의 노가다. 여기서는 해당 arrays.xml 파일을 블로그에 공유하고 간단히 사용법을 메모하려고 합니다. 구현방법 구현하기전에 필요한 값들로는 스피너 3개 ArrayAdapter 3개 res/values/a.. 2019. 6. 24.
express에서 cookie-parser 사용하기 cookie-parser란? 요청된 쿠키를 쉽게 추출할 수 있도록 도와주는 미들웨어 입니다. express의 request(req) 객체에 cookies 속성이 부여됩니다. node의 npm 패키지에 포함되어 npm install cookie-parser --save를 통해 install하여 사용할 수 있습니다. 예제 코드) var express = require('express'); var cookieParser = require('cookie-parser'); var app = express(); app.use(cookieParser()); app.get('/', function(req, res) { console.log('Cookies: ', req.cookies) }) app.listen(8080.. 2019. 5. 7.
안드로이드 - versionCode 와 versionName 안드로이드의 앱 정보 중에서 버전코드와 버전이름이 있습니다. 버전 코드 (versionCode) google Play에 공개 할때 사용하는 것으로 이전보다 높으면 앱을 갱신하게 됩니다. 이전보다 높으면 앱을 갱신하게 됩니다. 앱을 사용하는 유저는 업데이트 정보가 뜨게 됩니다. 버전 이름 (versionName) 버전 이름은 버전 코드와 달리 유저가 확인할 수 있는 정보로 앱 갱신에 영향을 주지 않습니다. 버전 이름은 보통 3자리로 구성되며 다음과 같은 의미가 있습니다. 이것은 정답이 없으므로 상황에 맞게 의미를 부여해 주면 됩니다. android:versionName = "1.0.0" 첫번째 번호 : 컨셉이나 앱이 지향하는 기본 디자인이 변경된 경우 두번째 번호 : 기능 추가나 사양이 변경된 경우 세번째.. 2019. 4. 10.