[NUXT] loading component
·
Language/NUXT
페이지를 불러오거나 서버 요청을 보낼 때 대기 시간이 발생한다. 이 때 화면이 정지해있으면 사용자는 페이지가 정지한 것인지 동작중인지 알 수 없다. 로딩 페이지를 표시해 작업이 진행중이라는 것을 표시해줘야한다. NUXT에서는 간단하게 로딩창을 만들 수 있다. 먼저 로딩을 표시하기 위한 컴포넌트를 작성한다. // @/components/loading.vue Loading... // @/components/loading.vue nuxt.config.js을 열고 loading 속성에 작성했던 loading.vue 컴포넌트를 추가한다. // nuxt.config.js export default { // ... loading: '@/components/loading.vue' } 필요한 부분에서 $n..
[Vue] Vue 인스턴스
·
Language/JavaScript
Vue 인스턴스는 Vue.js를 시작할 때 사용하는 객체를 의미하며 어플리케이션의 시작점이라고 할 수 있다. Vue 어플리케이션은 Vue함수로 인스턴스를 생성하는 것부터 시작한다.var vm = new Vue({ // options});​//또는new Vue({ // options});옵션에는 아래와 같은 속성들이 전달된다.el, template, data, props, computed, methods, watch위 속성들은 컴포넌트와 다르지 않다.여기서는 el 프로퍼티를 볼 수 있는데 이는 HTML 문서에 마운트될 HTML 엘리먼트를 지정하는 역할을 한다.//html // scriptnew Vue({ el: "app"});vue/cli로 Vue 프로젝트를 생성 후 index.html을 보면 body태그..
[Tensorflow] Tensorflow.js
·
딥러닝
자바스크립트는 웹 브라우저에서 주로 사용하는 스크립트 언어이다. 웹 페이지를 동적으로 구성하기 위해 사용된다. 웹 브라우저에서 딥러닝 모델을 사용할 수 있도록 텐서플로우의 자바스크립트 버전이 제공된다. CDNCDN을 사용하면 서버 입장에서는 제공하려는 컨텐츠를 직접 가지고 있을 필요 없이 사용자가 제공자에게 직접 다운로드 할 수 있다. tfjs의 cdn은 아래와 같이 사용할 수 있다.xxxxxxxxxx tfjs뿐만 아니라 tfjs-vis를 포함해 학습 과정 및 결과를 웹페이지에 표시하려한다. Dataset간단히 학습할 수 있는 MNIST 데이터셋을 사용해본다. 0~9까지의 손글씨로 쓴 숫자들로 5500개의 학습 데이터와 1000개의 테스트 데이터를 가진다. 텐서플로 github에서 js 파일로 제공되는 ..