본문 바로가기

전체 글

(12)
Springboot 프로젝트에 Vue.js 사용해보기 -1 안녕하세요.😀 이번에 front-end 프레임워크를 기존 Angular.js에서 Vue를 사용함에 따라 Vue를 스프링부트 프젝에 적용해보겠습니다. 적용하는 과정을 기록합니다. 환경 ) Intellij + SpringBoot + npm 설치 되어있음 👆적용 과정 1. vue-cli 설치 해당 프로젝트 터미널을 열어줍니다. > npm init -> pakage.json 파일을 자동 생성 해줍니다. > npm i -g @vue/cli ** CLI란 ? Command Line Interface의 약자, vue-cli는 기본 vue 개발 환경을 생성해주는 도구입니다. 폴더 구조나 webpack 설정 등을 도와줍니다. 2. vue 프로젝트 설치 > vue create [vue프로젝트 명] 3. vue.config..
Zipkin과 Sleuth을 사용해보기 -1 안녕하세요! spring boot로 개발한 프로젝트에 Zipkin을 적용해보려 합니다. 그 전에 zipkin에 대하여 공부 하겠습니다. 💡 Zipkin 이란 ? - MSA(마이크로서비스 아키텍쳐) 환경에서 하나의 요청에 대하여 여러개의 서비스들이 호출됩니다. 이 때, 병목 현상등 문제가 생길 시를 대비하여 별도의 모니터링이 필요해졌습니다. 이를 도와주는 것이 바로 Zipkin 입니다. Zipkin은 분산환경에서 로그 트레이싱을 제공해주는 오픈 소스입니다. 💡 Zipkin의 구성 - 1 ) Zipkin Client Library : 정보수집을 담당하고, 수집한 것들을 Collector 모듈로 전송합니다. http를 사용하고 java, javascript, go 언어등을 지원합니다. - 2 ) Zipkin ..
[Front-end] TypeError: Cannot read property 'then' of undefined 🔎 js controller에서 ajax 통신을 하면서 비동기로 동작하는 로직에서 defer를 사용하면서 나타난 에러. 원인 : '.then'을 찾을 수가 없다는 뜻이였는데, promise 객체를 반환 받은 후에 올 함수가 있어야했기 때문. 해결 : .then 이후에는 정확한 함수를 적어줘서 정상 실행되도록 코드 수정 $scope.check($scope.sendParam).then(function(){ $scope.add(); }); --> sendParam을 보내서 check 함수를 실행하고, 이 check함수가 다 끝나고 나서 add 함수를 실행하겠다. ✨ add 함수에는 그 이후의 로직을 넣어주면 된다 ! 오류가 났을때는.then(function()에 모든 로직을 때려넣었음 ,, ($rootScop..
[AngularJS] 주의사항 및 놓친 부분 정리 1. rootScope rootScope를 사용하면 rootScope 내의 코드들만 실행된다. 그 밑에 변수 선언이나 값을 넣어도 반영되지 않음 ! ex) $rootScope.confirm("정말 등록 하시겠습니까?", function (){ $http({ url: Config.serverURL+"...", method: 'POST', params: $scope.sendParam }).then( function (){ $rootScope.alert("성공 하였습니다."); }, function () { $rootScope.alert("실패 하였습니다."); }); }); ////// 여기 이후엔 적용 X ///// 2. data-ng-model vs data-model angularJS는 two way ..
[Front-end] Error: $parse:syntaxSyntax Error 개발자 도구에서 syntaxSyntax에러가 났을 시에는 링크를 타고 들어가서 에러 메시지의 구문을 복사해서 작업중인 파일에서 찾아보기 .. !
[AngularJS] 외부 js 파일을 가져다 쓰기 🔎 현재 js 컨트롤러에서 필요한 함수를 직접 복붙 하지 않고 외부 파일의 함수를 가져다 쓰기 방법 : 1. app.js (전체 js를 등록해주는 js) define 안에 경로명 적어주기 2. function 안에는 해당 파일의 별칭을 붙여준다. 이 별칭으로 다른 js에서 가져다 쓸 수 있다! 단, function 안에는 define 에서 불러온 순서를 따름. 예시 ) define([ "service/myService.js", "service/yourService.js" ], function() { mySvc, yourSvc} );
spring.multipart.max.file.size 에러 🔎 스프링 부트 프로젝트를 RUN 할 시에 무한 로딩과 함께 'spring.multipart.max.file.size' 라는 에러가 나는 현상 원인 : applications.properties 파일을 상용버전, 개발버전꺼를 계속 바꿔가며 실행시켰었는데, 여기가 원인이 아닐 까....하는 생각 ! 해결 : 프로젝트를 다시 build ( 메이븐 탭 -> Lifecycle -> clean ) 해주기
Docker의 Private registry 통해 ssh 서버로 이미지 배포 로컬에서 만들었던 스프링부트 프로젝트를 Docker를 이용하여 이미지를 배포해보았습니다. * ssh 서버는 centos7을 사용합니다* 💡배포 순서 1. private registry 구축 2. 프로젝트 이미지로 빌드 3. ssh 서버와 연결하기 위한 설정 4. 이미지 push 5. ssh에서 pull 하여 이미지 가져오기 6. 도커 이미지 기동 1. private registry 구축 - docker pull registry : private registry 구축을 위해 registry 이미지를 pull 합니다. - docker images 명령어로 현재 registry라는 이미지가 pull 된것을 볼 수 있습니다. 2. 프로젝트 이미지로 빌드 (선행작업 : mvn clean package..