수업 & 공부/개발환경 만들기 (12) 썸네일형 리스트형 Spring security 설정으로 인한 401 Unauthorized 에러 Vue파일 빌드 > ../static에 index.html 파일 확인 후 Springboot jar배포를 하고 cmd창으로 jar파일을 실행하고 index.html로 접근하니 401에러가 떴다. 아래 블로그를 참고하여 해결하였다 https://subbak2.com/11 Spring security 설정으로 인한 401 Unauthorized 에러 1. 개발환경 Back-end : Spring-boot Front-end : Vue.js 2. 문제현상 1) Back-end와 Front-end를 따로 서버 구동했을때는 API 통신이 원활하게 진행됨 (Back-end : mvn spring-boot run / 8080 포트 Fron.. subbak2.com (Vue.js환경 만들기 4) proxy 설정 3. Springboot + Vue 개발환경 만들기1 Springboot는 이때까지 작업한 MySpringbootApi 를 사용해볼것 (안되면 새로 만들어야함..) vue cli로 src 디렉토리 아래에 vue.js 프로젝트를 하나 만들어 볼것이다 1. Vue create vue create 기능은 CLI 3.xx.. dwc04112.tistory.com 위 글에서 이어집니다 vue.js dev서버에 proxy 설정을 해서 spring으로 오게 될 요청들을 모두 vue.js dev서버에서 proxing 하여 받고, spring쪽으로 보내주도록 설정을 해볼것이다 클라이언트에서 8081(vue)포트로 요청을 보내면 특정 url을 지정해 놓고, 8081에 해당 url로 온 요청을 다 8080(spring) 으.. (Vue.js환경 만들기 3) Springboot + Vue create Springboot는 이때까지 작업한 MySpringbootApi 를 사용해볼것 (안되면 새로 만들어야함..) vue cli로 src 디렉토리 아래에 vue.js 프로젝트를 하나 만들어 볼것이다 1. Vue create vue create 기능은 CLI 3.xx 버전부터 지원한다고 한다.. 바로 이전에 2.xx버전을 다운받았지만 참고하는 글과 같은 환경을 만들기 위해서 npm을 uninstall하고 다시 install 한다 (여기선 Vue3버전을 사용했지만 Vue 2버전을 설치하자..) 다시 Springboot 프로젝트의 src아래에 vue create frontend를 생성하자 -> default로 시작하면 새로운 프로젝트가 시작된다 만약 intellij Terminal에서 vue 버전을 확인할때 오류.. (Vue.js환경 만들기 2) Vue -cli 설치 및 프로젝트 생성 Vue -cli 여기서 CLI 란 ? 명령 줄 인터페이스(CLI, Command line interface) 또는 명령어 인터페이스는 텍스트 터미널을 통해 사용자와 컴퓨터가 상호 작용하는 방식을 뜻한다. Vue project 실행을 보면 더 쉽게 이해될것 그렇다면 vue-cli 는 기본 vue 개발 환경을 설정해주는 도구라고 볼 수 있다. 1. vue-cli 설치 Node.js 환경변수 설정까지 마치고 이제 vue -cli를 설치한다 vue는 현재 2가지 버전에 대한 설치를 제공한다. 2.x와 3.x 버전이 있는데 2.x 버전이 안정화 되어있고 많이 사용한다고 한다. 따라서 2.x 버전 설치! ver 2.x : npm install vue-cli -global ver 3.x : npm install @v.. (Vue.js환경 만들기 1) Node.js -npm 설치 1. Node.js 설치하기 Vue.js 를 사용하기 위해서 Node.js(npm) 를 설치해줘야한다. npm은 Node.js - Package - Manager 즉 Node.js 로 만들어진 프로그램을 쉽게 설치 등을 도와주는 것이다 https://nodejs.org/ko/ Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 원하는 버전을 선택하여 다운로드 신뢰도가 높은 LTS 버전을 다운로드 했다 2. node.js & npm 버전확인 cmd창에서 설치된 폴더로 이동하여 다음 명령어를 입력 아직 환경변수를 설정하지 않아서 설치된 폴더로 이동하여 version을 확인. node -v npm .. 47 : Springboot(token로그인 환경 만들기) 추가된 파일 member member memberRepository Role security - controller JwtAuthenticationController MemberController - service JwtUserDetailsService SpringbootApiApplication passwordEncorder 추가 pom & ddl파일 추가 POSTMAN IMPORT 1. File > Invalidate Caches 실행하기 2. collections > import 받은 collection과 Environment 적용하기 적용한 파일명 SpringbootApi.postman_collection.json SpringbootApi[local].postman_environment.json .. 43- Git-branch & Merge Git - Branch 를 왜 사용할까? board 수정하다 comment수정하다 보면 history에서 여러가지 파일들이 섞여있는 것을 볼 수 있다. 그렇다면 텍스트(파일)들의 변화를 어떻게 관리할까? git - branch를 연습해보자 1. C\gitpractice\ 파일 안에 git파일을 생성하고 sourcetree에 추가해서 환경을 만들었다. 그리고 source.txt 파일을 생성 후 commit하였다. 2. 우선 master 상태에서 branch를 생성하여 commit을 따로 해보자. 가지(make-branch)를 생성하고 make-branch 가지가 선택된 상태에서 새로운 파일 makebranch.txt 파일을 아까의 위치에 추가하여 commit을 했다. 3. 아래 사진과 같이 branch가 .. Postman (1) 계속 추가 1. 왼쪽은 Request 오른쪽은 Response 역할을 한다! 2. rsponse의 Body 밑 버튼으로 출력 방식을 바꿀 수 있다 3. Post방식으로 insert! Body > raw > JSON 방식으로 값을 입력해서 넣음! 아래 참고 이전 1 2 다음
