Full-Stack Develop Vue.js & Flask

free admin template인 vue-flask-docker이다.유료로 구매한 템플릿이 있지만 소스코드를 공개 할 수 없을 것 같아 free 라이센스를 가진 템플릿을 사용해서 vue와 관련된 것들을 공유 해 보려고 한다.소스 파일은 아래에 있다. 다운받아도

Dockerfile과 docker-compose를 사용해서 작성 된 frontend / backend 를 올렸다.이제 frontend ←→ backend가 서로 통신이 되는지, 데이터를 주고 받을 수 있는지 확인 해 보려고 한다.이전에 작성 했었었던 docker-com

Vue에서 생성한 button과 function을 바인딩 해 보도록 하려고 한다깃허브 소스는 링크로 첨부한다 → 링크이전의 글에서 axios로 front와 back을 연동했다.axios를 가지고 backend와 frontend에서 데이터를 서로 연동을 해 주었는데 이번

Frontend에 전달할 데이터를 생성하자vue의 Component는 페이지가 될 수도 있고, 페이지를 구성 할 수 있는 요소가 될 수 있다. 이번에는 Component를 생성해서 Dashboard에 나만의 정보를 띄우려고한다.그 과정 중 이번에는 Backend의 데이

Backend에서 보내준 데이터를 frontend에서 보여주자이전 글에서 네이버 야구경기의 데이터를 긁어오는 과정을 Backend에 적용했다.이제 Vue에서 Backend와 연동하여 데이터를 보여주는 Component를 작성하겠다.완성된 소스는 깃허브에 있다 →

Vue.js & Flask를 docker-compose로 올렸기 때문에 DB도 마찬가지로 같이 docker로 올려주려고 한다.사용하려고 하는 db는 mysql이다docker-compose 세팅까지의 코드는 깃허브에 있다 (링크)처음 프로젝트를 세팅 했을 때, docke

사용할 화면이 flask 서버 내에서 작성 된 것이 아닌 Vue.js에서 작성 된 것이기 때문에 flask서버에서는 api를 작성 해 주도록 할 것이다.회원가입로그인로그아웃데이터베이스를 미리 세팅하고 데이터를 하나 넣어주도록 하겠다mysql을 사용하고 flask-sql

JWT 토큰을 사용해서, 현재 사용자의 인증을 체크 해 주자.JSON Web Token (JWT) 은 웹표준 (RFC 7519) 으로서 두 개체에서 JSON 객체를 사용하여 가볍고 자가수용적인 (self-contained) 방식으로 정보를 안전성 있게 전달해줍니다.re

JWT토큰을 발행하고 할당, 그리고 Validation까지 했으니, 이제 이 동작들을 Frontend로 가져가서 작업 해 보도록 하자front-back의 소스는 여기 에 올려놓았다frontend 구조라 스트럭쳐가 꽤 길다backend의 코드에서 필요한 정보를 넘겨주기