개발자 울이 노트

이전 글 첨부 [Master_branch/develop_branch] - Vue.js & Flask - 개발환경구축하기 [Master_branch/develop_branch] - Vue.js & Flask - 컴포넌트와 api 연동(1) - backend [Master_branch/develop_branch] - Vue.js & Flask - 컴포넌트와 api 연동(2) - frontend [Master_branch/develop_branch] - Vue.js & Flask - 데이터 주고받기 (axios) [Master_branch/develop_branch] - Vue.js & Flask - 데이터 주고받기 axios(2) button binding [Master_branch/develop_branc..

이전 글 첨부 [Master_branch/develop_branch] - Vue.js & Flask - 개발환경구축하기 [Master_branch/develop_branch] - Vue.js & Flask - 컴포넌트와 api 연동(1) - backend [Master_branch/develop_branch] - Vue.js & Flask - 컴포넌트와 api 연동(2) - frontend [Master_branch/develop_branch] - Vue.js & Flask - 데이터 주고받기 (axios) [Master_branch/develop_branch] - Vue.js & Flask - 데이터 주고받기 axios(2) button binding [Master_branch/develop_branc..

이전 글 첨부 [Master_branch/develop_branch] - Vue.js & Flask - 개발환경구축하기 [Master_branch/develop_branch] - Vue.js & Flask - 컴포넌트와 api 연동(1) - backend [Master_branch/develop_branch] - Vue.js & Flask - 컴포넌트와 api 연동(2) - frontend [Master_branch/develop_branch] - Vue.js & Flask - 데이터 주고받기 (axios) [Master_branch/develop_branch] - Vue.js & Flask - 데이터 주고받기 axios(2) button binding Vue.js & Flask를 docker-compo..

이전 글 첨부 [Master_branch/develop_branch] - Vue.js & Flask - 개발환경구축하기 [Master_branch/develop_branch] - Vue.js & Flask - 컴포넌트와 api 연동(1) - backend [Master_branch/develop_branch] - Vue.js & Flask - 컴포넌트와 api 연동(2) - frontend [Master_branch/develop_branch] - Vue.js & Flask - 데이터 주고받기 (axios) Vue에서 생성한 button과 function을 바인딩 해 보도록 하려고 한다 깃허브 소스는 링크로 첨부한다 → 링크 Vue-Flask Data Binding 이전의 글에서 axios로 front와..

이전글 첨부 [Master_branch/develop_branch] - Vue.js & Flask - 개발환경구축하기 [Master_branch/develop_branch] - Vue.js & Flask - 컴포넌트와 api 연동(1) - backend [Master_branch/develop_branch] - Vue.js & Flask - 컴포넌트와 api 연동(2) - frontend Dockerfile과 docker-compose를 사용해서 작성 된 frontend / backend 를 올렸다. 이제 frontend ←→ backend가 서로 통신이 되는지, 데이터를 주고 받을 수 있는지 확인 해 보려고 한다. 소스 파일은 여기에 있다 -->Github Soruce docker-compose 개발환..

이전글 첨부 [Master_branch/develop_branch] - Vue.js & Flask - 개발환경구축하기 [Master_branch/develop_branch] - Vue.js & Flask - 데이터 주고받기 (axios) [Master_branch/develop_branch] - Vue.js & Flask - 컴포넌트와 api 연동(1) - backend Backend에서 보내준 데이터를 frontend에서 보여주자 이전 글에서 네이버 야구경기의 데이터를 긁어오는 과정을 Backend에 적용했다. 이제 Vue에서 Backend와 연동하여 데이터를 보여주는 Component를 작성하겠다. 완성된 소스는 깃허브에 있다 → 링크 Vue.js & Flask - Frontend Vue 컴포넌트 작..

이전 글 첨부 [Master_branch/develop_branch] - Vue.js & Flask - 개발환경구축하기 [Master_branch/develop_branch] - Vue.js & Flask - 데이터 주고받기 (axios) Frontend에 전달할 데이터를 생성하자 vue의 Component는 페이지가 될 수도 있고, 페이지를 구성 할 수 있는 요소가 될 수 있다. 이번에는 Component를 생성해서 Dashboard에 나만의 정보를 띄우려고한다. 그 과정 중 이번에는 Backend의 데이터를 전달 할 API를 작성 하도록 하겠다. 완성된 소스는 깃허브에 있다 → 링크 Vue.js & Flask - backend API 생성하기 flask url route 플라스크를 백엔드 서버로 사용..

vue-flask-docker free admin template인 vue-flask-docker이다. 유료로 구매한 템플릿이 있지만 소스코드를 공개 할 수 없을 것 같아 free 라이센스를 가진 템플릿을 사용해서 vue와 관련된 것들을 공유 해 보려고 한다. 개발 환경 구축이기 때문에, front/back 모두 개발환경으로 구축을 시작했고 Docker를 사용해서 작업을 했지만 소스를 수정했을 때 바로 적용 될 수 있도록 volume 옵션을 주었다. volume : Docker에 올린 파일과 연동 할 수 있는 위치를 설정 해 주는 옵션 Vue - Flask 구축하기 Download 소스 파일은 아래에 있다. 스스로 구축 해도 된다. -> Github Soruce $ git clone https://git..