전체 글 177

Vue ) 프록시 설정. Dev Server has been initialized using an options object that does not match the API schema.

나는 뷰를 cli를 통해서 설치한게 아니라 따로 npm으로 필요한것만 설치를 했었다. 그러다 보니 구글링해서 많이 나오는 것을 가져다 쓰면 오류범벅... 그래도 덕분에 이걸쓰려면 뭐가 필요한지 알아가는것같으니 좋다고 생각하자..하하 프록시를 설정하는와중에 나오는 오류다. [webpack-cli] Invalid options object. Dev Server has been initialized using an options object that does not match the API schema. - options.proxy should be one of these: object { … } | [object { … } | function, ...] -> Allows to proxy requests, c..

Front-end/Vue.js 2022.11.19

JavaScript) 자바스크립트 글자 변경, 여러개, 공백제거

자바스크립트에서 글자를 변경하는 공식은 아래와 같다. replace(변경하고싶은문자, 변경할 문자) 이렇게 도 -> 만으로 글자를 변경할 수 있다. 하지만 원본 텍스트가 바뀌는 것은 아니다. 다시 test를 출력해보니 그대로 "도"로 출력이 되는데, 원본 텍스트를 바꾸려면 바꾼것을 다시 넣어줘야한다. test = test.replace("도", "만") [공백제거] 보통 로그인 기능을 만들때 사용자가 자신도모르게 공백이 들어가는 경우가 있어 공백을 제거하는 과정을 넣는게 좋다. 공백을 제거할때도 replace를 써서 활용할 수 있다. 문자열.replace(/\s/gi, "") [여러글자 한꺼번에 치환] 문자열.replace(/ 글자1 | 글자2 | 글자3 /gi, "변경할 글자") [replace 사용방..

Vue.js) 스크롤 감지하기. 스크롤 할 때마다 특정 함수 실행

vue 프로젝트에서 화면을 스크롤할때 감지하여 특정 함수를 실행시키고 싶었다. 계속 addEventListener를 해줘도 안되서 뭐지 했는데 뒤에 true를 써줘야 했던것...ㅠㅠㅠ // 이벤트 등록 mounted() { document.addEventListener('scroll', this.scrollEvents, true); }, // 이벤트 해제 beforeUnmount() { window.removeEventListener('scroll', this.scrollEvents); }, methods : { scrollEvents(e) { console.log("스크롤될때마다 이 함수 실행?",e) } } 결과화면 => 스크롤 내릴때마다 함수가 실행된다! 이제 응용해서 만들어야지~

Front-end/Vue.js 2022.09.29

Vue.js) Vue 시작하기, 설치하기(**cil없이 설치)

1. node.js 설치하기 노드js는 웬만하면 12버전 이상으로 설치를 권장한다. https://nodejs.org/ko/download/ 설치 후 버전 확인. 노드를 설치했으면 npm도 자동으로 설치되어 npm버전도 확인해준다. D:\> node -v v16.14.0 D:\> npm -v 8.3.1 2. Vue 패키지 설치 우선 작업을 할 폴더를 생성하고 그 폴더 안으로 들어가서 패키지를 설치한다. D:\myVue> npm init -y 아무것도 없었던 작업폴더에 파일이 하나 생성된다. 3. webpack 패키지 설치 > npm i vue > npm i -D vue-loader vue-template-compiler vue-style-loader webpack webpack-cli webpack-de..

Front-end/Vue.js 2022.09.29

MS-SQL) 해당 테이블을 사용하는 프로시저 조회하기, 특정 단어를 포함하는 프로지서 조회하기

1. 해당 테이블을 사용하는 프로시저 조회 select so.name from dbo.syscomments sc with(nolock) inner join dbo.sysobjects so with(nolock) on sc.id = so.id where so.xtype in ('p', 'fn') --> p : 저장프로시저, fn : 스칼라함수 and sc.text like '%테이블 이름%'; 2. 특정 단어를 포함하는 프로시저 조회 SELECT OBJECT_NAME(object_id), OBJECT_DEFINITION(object_id) FROM sys.procedures WHERE OBJECT_DEFINITION(object_id) LIKE '%찾고싶은 단어%'

Database/MS-SQL 2022.09.26

Vue.js) 태그 스타일에 변수 적용하기(CSS에 변수 적용) Vue2, Vue3

내가 하고싶은것은 넓이가 유동적으로 변하는 값에 따라 높이를 맞추고 싶었다. 그냥 간단히 말해 vue단에서 선언한 변수를 css에 적용하고 싶었다. 여러가지 구글링 했을때는 css변수 사용해서 :root에 변수를 선언하라고 되있는데, 나는 css에서 새로운 변수를 만드는게 아니라 자바스크립트 단에서 만든 변수를 사용하고 싶었다. 방법은 생각보다 간단! Vue3 1) 변수 선언 data() { return { hhhhh : '', }; }, 2) 변수에 값 넣기 mounted(){ this.hhhhh = 50 * 10 + "px"; }, 3) 변수를 style에 적용 변동css 변동css Vue2 Vue2는 3과 적용 방법이 살짝 다르다.

Front-end/Vue.js 2022.08.12

이클립스 안켜짐. workspace is in use or cannot be create, please choose a different one.

이클립스를 열면 다음과같은 에러메시지가 나온다. workspace is in use or cannot be create, please choose a different one. 문구 의미: 이미 해당 워크스페이스가 이클립스로 열려있으니 다른 워크스페이스를 선택해라~ 원인: 해당 워크스페이스를 연 이클립스가 이미 있어서. 상태: 이클립스가 열려있다고 문구가 뜨는데 열려있는 이클립스가 보이지 않는다. 해결방법1. 작업관리자를 열어 해당 작업을 종료한다. 작업관리자를 열어서 보면 화면으로는 보이지 않지만 이클립스가 실행되고 있는게 보인다. 이클립스를 우클릭해서 "작업끝내기"를 누른다. 다음으로 워크스페이스 폴더의 .metadata로 들어가서 .lock 퍼알울 삭제한다. 대부분 이 방법으로 하면 해결되는것같던데..

Back-end 2022.06.26

JAVA) 자바 Math.ceil 자세히 알아보기(올림, 소수점 버리기)

페이징 처리를 구현하다가 공식중에 Math.ceil이 있는데, 좀 이해가 가지 않고 헷갈렸다. Math.ceil이 올림인건 알지만, 소수점으로 계산했을때, 정수로 했을때 등등이 달랐기 때문에 어려웠다. 결과를 구글링 해보았지만 예제도 부족했고, 이참에 확실히 알아야 까먹지 않을것같아서 적어보기로 했다. Math 클래스 java.lang 패키지에 속한 클래스로, 수학에서 자주 사용되는 상수와 함수들이 구현되어있는 클래스다. 여기 구현된 메서드들은 static Method 이므로, 객체를 생성하지 않고도 바로 구현할 수 있다. Method 종류 1) random(랜덤 뽑기) 2) abs(절대값) 3) min(최소), max(최대) 4) ceil(올림), floor(내림), round(반올림) 5) pow, ..

Spring) 비즈니스 계층. 서비스(Service)란?

비즈니스 계층, 서비스는 컨트롤러와 DAO사이에 위치해서 서로 의존성이 높아지는것을 방지하는 완충제 역할을 한다. 컨트롤러에서 DAO를 바로 호출할 수 있지만, 그러면 컨트롤러와 DAO가 종속되어버린다(강한결합). 그래서 컨트롤러와 DB의 다이렉트 연결을 한단계 떨어뜨려 종속되는것을 막는 것. => 외부 호출에 대한 영속계층(persistence) 종속성을 막는다. 종속성을 떨어뜨린다는건 매우쉽게 말하면 컨트롤러는 컨트롤러의 역할만 하게 하고, 그 외의 역할은 못하게 하는 것. 이렇게 하는 이유는 중간에 DB를 바꾼다거나 할때 바뀌는 부분만 갈아끼우기 형태로 바꿀 수 있기 때문이다. 종속이 되면 서로 강한결합이 되어있으니 모두 다 뜯어고쳐야 하는 상황이 발생하게된다. 1. 서비스 패키지 만들고 객체 등록..

Back-end/Spring 2022.05.02
반응형