본문 바로가기

반응형

분류 전체보기

(144)
에러 처리하기 에러처리는 왜 하는가? : 매번 비동기 작업에서 catch 써가면서 하기가 불편하므로 이것만 쓰면 catch가 되게끔 하는 것인데, vue에서는 글로벌로 그것들을 소화할 수 있다. main.js 에서 선언만 해주면 되는데 이것또한 파일(error.js)을 새로 만들어서 따로 관리할 것이다. toast 설치 : snackbar 를 편히 사용할 수 있도록 만들어 놓은 모듈이다. $yarn add vuetify-toast-snackbar vuetify.js VSnackbar, VBtn, VIcon 는 a-la-carte가 인지하지 못하므로 추가해야 한다. import Vue from 'vue' //추가로 import 해준다. import Vuetify, { VSnackbar, VBtn, VIcon } from..
제목 수정하기 타이틀이나 세팅 등을 통째로 저장해서 읽어오고 하는 걸 만들것이다. app.vue app.vue 는 처음에 화면이 시작되는 곳이다. mdi-check mdi-numeric mdi-account-badge-alert title.vue {{ title }} mdi-grease-pencil 제목 수정 mdi-content-save mdi-close
firebase realtime database 읽고 쓰기 firebase.google.com/docs/database/web/start 자바스크립트에서 설치 및 설정 | Firebase 실시간 데이터베이스 Firebase 실시간 데이터베이스는 클라우드 호스팅 데이터베이스입니다. 데이터는 JSON으로 저장되며 연결된 모든 클라이언트에 실시간으로 동기화됩니다. Android, iOS 및 자바스크립트 SDK로 교차 플� firebase.google.com 프론트에 파이어베이스 설치하기 -자바스크립트 sdk를 사용하기위해서 설치한다. cmd 창에 아래의 명령어를 입력해 설치한다. C:\ionic\TestPp\test> yarn add firebase 플러그인 만들기 main.js에서 firebase를 쓴다고 선언해야하는데 다 쓰게되면 복잡해지므로 plugins 폴더에..
하위메뉴 만들기 https://vuetifyjs.com/ko/components/lists/ List component — Vuetify.js The list component is a continous group of text, images and icons that may contain primary or supplemental actions. vuetifyjs.com v-model Vue에서 양방향 바인딩을 가능하게 한다. 단방향 바인딩은 데이터를 화면에 출력 양방향 바인딩은 화면에서 입력을 받아 데이터로 다시 전달하는 과정이 추가되어 양쪽 방향 모두 바인딩 되는 것을 의미 prepend-icon : 아이콘을 표시함. v-slot:activator : activator라는 슬롯에 v-content 부터 넣어준다는 ..
vuetify 활용하기2 (component 활용하기) -title, footer, menu 페이지를 따로 생성해 component 로 관리한다. 1. site 폴더 생성후 그 아래에 title, footer, menu.vue 페이지를 따로 생성한다. -title.vue {{ title }} -footer.vue © {{ new Date().getFullYear() + ' ' + footer }} -menu.vue {{ item.title }} 2. App.vue 의 내용을 수정한다. ... Application ... ...
vuetify 활용하기1(appbar, footer, navigation drwer 만들기) -app bar 앱바 만들기 vuetifyjs.com/ko/components/app-bars App-bar component — Vuetify.js The app bar component is a supercharged toolbar with advanced scrolling techniques and application layout support. vuetifyjs.com -footer 만들기 https://vuetifyjs.com/ko/components/footer/ Footer component — Vuetify.js The footer component provides a container for displaying additional navigation information about a ..
router 배워보기 -처음 시작하는 페이지는 main.js 이다. 처음 import 할 자원들을 여기에서 입력해줘야한다. 라우팅 하기 -app.vue 에 xxx로 가는 링크를 만든다. -xxx.vue 페이지를 만든다. (주소창에 http://localhost:8080/xxx 를 입력해도 페이지가 나타나지 않는다. 라우팅을 하지 않았기 때문에) -/router/index.js 페이지 수정하기 -정상적으로 페이지가 뜬다.
git 사용하기 -.gitignore : 여기에 쓰여진 파일은 git에 변경사항 올리거나 하지않고 무시한다. vscode 로 깃커밋 git commit 하기 git repository 생성하기 -위에서 git commit 을 했으니 커밋은 생략하고 C:\ionic\TestPp\test> git remote add origin https://github.com/developerkjm/test.git C:\ionic\TestPp\test> git push -u origin master Enumerating objects: 59, done. Counting objects: 100% (59/59), done. Delta compression using up to 8 threads Compressing objects: 100% ..

반응형