본 글은 Vue 를 공부하면서 쓰는 글이다. 여기 저기 찾아보면서 책도 보면서 남겨두고 있다. 아직 모든 개념이 완벽하게 이해되진않는데, 일단 외워두고 천천히 이해해봐야 겠다. Reactive Data Binding: Vue의 핵심적인 특징 중 하나는 반응형 데이터 바인딩이다. data, props, computed, methods 등을 통해 DOM과 데이터를 쉽게 연결할 수 있다. Components: 컴포넌트는 Vue.js의 거의 모든 애플리케이션을 구성하는 기본 블록이며, 재사용 가능한 UI를 만들고 로직을 캡슐화하는 데 사용. Vue Router: SPA(Single Page Application)을 만들기 위해서는 라우팅이 필수이며, Vue Router는 이를 매우 쉽게 구현할 수 있게 해준다...

하이브리드 앱을 개발하다 보면 디버깅을 어떤 방식으로 할까? 고민을 많이 하게 된다. 가장 보편적인 방법인 크롬 인스펙터로 연동해서 디버깅 하는 방법을 살펴보자. 순서는 다음과 같이 디버깅할 수 있다. 1. IDE에서 에뮬레이터 또는 디바이스로 하이브리드 앱 실행 2. 크롬 실행 후 주소창에 chrome://inspect 입력 3. 인스펙트할 디바이스 선택 4. 크롬 개발자 도구 켠 후 디버깅 아래 그림처럼 디바이스가 목록에 나오며, inpect 를 누르면 디버깅 창이 뜨게 된다. 아래와 같이 디버깅 창을 통해서 각 컴포넌트와 연관되는 소스도 보고, CSS도 수정해보고, 오류도 찾아보며 즐거운 개발자 생활을 해보도록 하자.

주말에 아이와 함께 여의도 공원으로 놀러가기로 하여, 집에서부터 씽씽이도 챙기고 출발하였다. 여의도에 도착해보니 점심 시간이 되어서 근처 IFC 몰에서 점심을 먹고 여의도 공원에 가기로 결정! 어차피 점심 식사하면 주차비 지원이 되서 걍 IFC 몰에서 점심을 먹었다. L3층에 있던 마마리 다이닝 이라는 곳에 갔었는데, 먼가 다이닝이라는 이름에서 부터 좀 비싸다 싶은 느낌을 받았다. 그러나 아이가 있던 우리에게는 별 다른 선택지가 없어 제일 맘에 들었던 마마리 다이닝으로 향했다. 결론은 만족스러웠다. 경제적 여유만 된다면 자주 방문해 볼 법 하다. 미쉐린 3스타를 받은 쉐프가 차린 식당이라고 하더니 찐이었다. 우리는 마마리 생선구이 잡곡밥 반상과 제철 회덮밥 반상, 그리고 문어 바질 샐러드를 주문했다. 생..

안드로이드에서와 마찬가지로 Vue(이하 뷰)에서도 라이프 사이클은 매우 중요한 부분이다. 컴포넌트가 생성 ▶ 파괴되는 과정에서 발생하는 각각의 라이프 사이클 훅 메서드를 적절히 활용해야 상황에 맞는 다양한 메서드를 응용하여 웹 또는 하이브리드 앱을 만들 수 있으며, 원하는 메서드를 적절한 타이밍에 실행할 수 있다. 아래는 뷰의 대표적인 라이프 사이클 훅이다. beforeCreate: 컴포넌트 인스턴스가 초기화되자마자 가장 먼저 실행되는 훅. 이 시점에는 데이터나 이벤트, 라이프 사이클 메서드 등이 아직 설정되지 않는다. created: 컴포넌트 인스턴스가 생성된 직후 실행되는 훅. 데이터와 메서드가 초기화되어 있어서 이 안에서 데이터를 변경할 수 있지만, 아직 DOM에 마운트되지 않아 DOM을 조작할 수..

VSCode를 사용하여 코딩을 하다보면, 문법적 오류 방지나 코드 문서화 등을 하기 위한 정적 분석 툴을 필요로 할 때가 있다. 이 때 필요한 것이 바로 ESLint 입니다. JSLint, JSHint 등의 툴도 있는데, 오픈소스이면서 확장성이 뛰어난 ESLint 가 대세가 되는 것 같습니다. VSCode 의 Extention에서 ESLint와 Prettier를 설치하도록 합시다. Settings 에 들어갑니다. ESLint로 가서 Edit in settings.json 클릭 아래 내용 붙여넣기(적당히 커스텀 해도 됨) "editor.formatOnSave": true, "editor.codeActionsOnSave": { "source.fixAll.eslint": true }, "[vue]": { "e..

준비물 : 슈퍼루브 스프레이, 키보드, 키캡 빼는 도구 아래 링크의 제품이다. 생각보다 여러모로 쓸모가 있는데, 주로 키보드 간이윤활에 많이 쓰시더라.... https://link.coupang.com/a/7z9jD 집에다드림 슈퍼루브 테프론 구리스 내열 고온 키보드 윤활 방청 소음 기계 저음 그리스 (스프레 COUPANG www.coupang.com 사용된 키보드 모델 : NKey TA Rainbow LED 적축(오테뮤) Ps. 오래됨... 자 스프레이 뿌릴 준비 하시고.. 오랜 생활 함께 했던 카랑카랑한 소리를 내주던 키보드야... 이제 간이윤활을 시작해 보도록 하자 간이윤활은 쉽다. 그냥 키캡 다 빼고, 스프레이 팁으 키축 사이로 쑤셔 넣어서 칙 한방만 뿌려주면 된다. 여기서 팁은 생각보다 칙 뿌릴..