# 뷰
풀스택을 향하여 - Vue.js Component & Flask Backend 연동(2) - frontend
Backend에서 보내준 데이터를 frontend에서 보여주자이전 글에서 네이버 야구경기의 데이터를 긁어오는 과정을 Backend에 적용했다.이제 Vue에서 Backend와 연동하여 데이터를 보여주는 Component를 작성하겠다.완성된 소스는 깃허브에 있다 →
Vue2 쓰세요? Composition API 한번 드셔보세요🙇♀️
Vue-next에 등장하는 Vue Composition API! 미리 적용해보시는 건 어떠세요?
axios 인터셉터로 API 관리하기
axios interceptors로 API를 공통 관리해 봅시다. axios 인터셉터는 1.요청하기 직전, 2. 응답을 받고 then, catch로 처리 직전에 가로챌 수 있습니다.
vue 실행 모드와 환경 변수 설정
뷰의 실행모드와 환경 변수를 설정하는 방법에 대해 알아봅시다.참고 링크: Modes and Environment Variables(https://cli.vuejs.org/guide/mode-and-env.html로컬에서는 http://localhost
Vue.js 도입기
도입 배경 어플 서비스에 대해서 백엔드 개발을 하고 있던 도중, 관리자 웹 페이지를 만들어야 하는 상황에 놓였다. 현재 프론트에 대한 기술 스택이라고는 HTML, CSS, JS가 전부였다. HTML, CSS, JS만을 이용해서 관리자 웹 페이지를 만드니 유지 보수가 불편하기도 했고, 코드를 작성하는 데 불편함도 많이 느꼈었다. 그래서 새로운 프론트엔드의 ...
SPA 프레임워크/라이브러리 React, Vue, Angular - FE study6
1. SPA 개념 SPA : 단일 페이지 애플리케이션 서버로부터 완전한 새로운 페이지를 불러오지 않고 현재의 페이지를 동적으로 다시 작성함으로써 사용자와 소통하는 웹 애플리케이션이나 웹사이트이다. (위키백과) 기존방식 : link를 통해 refresh (매 동작마다 페이지 새로고침과 리렌더링) SPA : 한 페이지에서 리렌더링 없이 필요한 동작 수행...
vue 채팅 애플리케이션 만들기 1 - 프론트엔드 개발환경 설정하기
다음과 같은 채팅 웹 애플리케이션을 vue.js 를 사용해서 만들것입니다. 웹소켓을 사용할 것이고요, 배포까지 진행해봅시다. vue 채팅앱 서비스 링크 urman.gif 이번에는 프론트엔드 개발 환경 설정을 다룹니다. 1. vue cli 설치 vue cli는 뷰 프로젝트 생성, 라이브러리 관리, 배포 파일 생성 등의 기능을 지원하는 프로그램입니다. vu...
Vue.js에 slide 적용하기 (Vueper Slides)
시작 및 사용법 모듈 설치 Import > 모듈을 설치하고 임포트를 하면 사용할 준비가 끝납니다. > 사용법은 해당 모듈 사이트에 너무 자세히 나와있어 부가 설명이 불필요할 것으로 판단하여 사이트 주소를 남깁니다. > 공식 사이트: Vueper Slides > >
[뷰치트] 뷰 - 텍스트 필드 에러 처리하기
ezgif.com-video-to-gif (1).gif 목표: 텍스트 필드에서 에러를 발생시켰는데, 사용자 입력이 있으면 에러를 지운다! 1. 상황 뷰로 작업을 할때 위 처럼 텍스트 필드의 에러를 처리할 때가 있다. 간단하게 정리하면, 1) 공백이면 에러를 발생시킨다. 2) 사용자 입력이 주어지면 에러를 없앤다. 그럼 어떻게 만들것인가? 1) 공...
Vue.js용 네이버 지도 라이브러리
소개 vue-naver-maps는 Naver Maps JavaScript API v3을 Vue.js에서 간편하게 이용하게 할 수 있는 라이브러리입니다. 2019년 10월 14일 기준으로 최신 버전은 v0.11.9입니다. 비록 0.x 버전의 라이브러리지만 충분히 사용이 가능한 수준입니다. 사용시에 오류가 발생하거나 궁금하신 점이 있으시다면 깃허브에 이슈를 남...
XML 기초
목차 XML basic 1.activity_main.xml 2.XML 속성 3.패키지 4.xmlns 5.id(구분자) 6.뷰와 뷰의 연결 속성 1. activity_main.xml 2. XML 속성 XML 파일에 일반적으로 추가하는 정보, 이 파일이 XML 형식으로 된것을...
vue.js 에서 data를 함수로 사용해야하는 이유
https://velog.io/@kyusung/190113-2 스터디 진행 중 컴포넌트로 사용시 data를 오브젝트로 선언하면 오류를 뱉는 문제를 알게 되었습니다. 이때는 data를 함수로 사용을 해야되던데요. 이와 관련하여 알아본 결과 - 동일한 컴포넌트가 여러