웹(Web) 67

Vue.js 문법정리

[속성/값 전달] ※Provide, Inject를 통해 중간 매개체를 건너뛰고 값전달 가능 단, Provide를 사용하면 반응형으로 되기 어려움 ※참조 사용하기 $ref : ref값을 통해서도 값을 전달=querySelector같은것 - 대신 html랜더링 되고나서 사용가능(created단계에서는 불가, mounted단계에서 html연결된직후 가능) 1. 부모컴포넌트 -> 자식컴포넌트 : props를 사용해서 데이터값을 주로 주고받는다. 값전달 //부모컴포넌트 이름: {{name}} //v-bind는 :변수명으로 생략가능 export default{ data(){ return{ name: '뷰제이에스' } } } 부모컴포넌트의 "name"이라는 변수(export default date()에서 정의된)를 ..

Redis refuse관련 에러 처리

본 글은 EC2환경에서 Redis서버를 설치하여 Sentinel을 구성하던 중 발생한 에러 처리 과정을 담음. Master-Slave 'refused' 관련 에러 AWS환경에서 보안그룹은 이러한 상태로 구성했다. *Master쪽 Redis서버에서는 다음과 같이 IP주소를 열어준다. $ vi /etc/redis/redis.conf # 기존 주소 bind 127.0.0.1 ::1 # 변경 주소 bind 0.0.0.0 ::1 단, 이렇게 모든 IP에 대해 열어주어서 해킹을 당한적이 있으므로 패스워드를 설정했다. 1. Master쪽 패스워드 설정 $ vi /etc/redis/redis.conf # 설정파일 수정(패스워드설정) requirepass 2. Slave쪽 패스워드 설정 $ vi /etc/redis/re..

리눅스 터미널 명령어 모음

1. 디렉토리 이동종류 1-1) 현재 디렉토리: cd . 1-2) 한단계 상위: cd .. 1-3) 최상위 디렉토리: cd / 1-4) 사용자 홈 디렉토리 : cd ~ 혹은 cd ~/ 1-5 이전경로 : cd - 2. 디렉토리 모든목록 상세조회 : ls -al 혹은 ll 3. 복사 : cp [파일] [뉴파일] 4. 파일제거 : rm [파일] 5. 터미널창초기화: clear 6. 파일내용 출력: cat [파일] 7. 파일편집기 오픈: vi [파일] - 에디터옵션 7-1) 현재커서 위치부터 입력, 탈출 : i , ESC키 7-2) 에디터 닫기 : :q! 7-3) 변경내용저장후 닫기 : :wq 8. 파일권한변경 : chmod [옵션] [파일명] 8-1) [옵션 7구성] : rwx(읽기쓰기실행) 4+2+1 8-..

[그라파나x엘라스틱서치] 시각화 방법

그라파나를 사용하면 Alert기능을 무료로 사용할 수 있으므로 키바나보다 많이 사용한다. 연결 1.그라파나에서 DataSources 선택 먼저 데이터소스를 추가해준다. 2. 엘라스틱서치 선택 데이터 시각화 Metric에 관한부분 설정을 하면 위와 같이 출력된다. 그라데이션 및 색상 위와 같이 범주를 누르면 색상을 변경할수 있으며, 아래의 Fill Gradient를 누르면 그라데이션 값을 설정 할 수 있다. 그런식으로 만들면 아래와 같은 시각화 화면을 얻을 수 있다. 벤치마크 테스트 본인의 컴퓨터를 Cpu, 메모리, Gpu 등을 벤치마크 테스트하는데에 주로 사용한다. 참고영상 : https://www.youtube.com/watch?v=qI7_By77c6c

"JAVA" 백엔드 개발자 로드맵

2024.03.02 - [코딩테스트/취업&코테 정보] - 2024 개발자 부트캠프 무엇을 해야하나? 2024.02.25 - [코딩테스트/취업&코테 정보] - (2024.02)개발자 '연봉 5000만원'을 목표로 잡지 말자 이것이 자바다 | 신용권 - 교보문고 이것이 자바다 | JAVA 17 버전으로 업그레이드해서 돌아왔다! 7년 동안 꾸준히 사랑받은 자바 베스트셀러 1위, 『이것이 자바다』 개정판!『이것이 자바다』는 기본 개념에 충실한 설명으로 2015년 product.kyobobook.co.kr JDBC를 도와주는 라이브러리는 1. ORM 중 대표적인 hibernate 2. Mybatis 사용한다. JSP는 Tiles를 공부하면 화면에 중복되는 부분을 처리하는데 도움 준다. 2021 자바 개발자 로드맵..

Nexus 3.xx 설치/실행 오류 해결(Windows 환경)

-설치법- 준비작업 Java JDK 사전 설치(8버전 권장) 다운로드 : https://www.sonatype.com/download-oss-sonatype Windows 설치하기 압축해제 다운로드 받은 설치 파일을 적당한 폴더에 압축을 해제한다. 해당 위치의 CMD창에서 관리자 권한으로들어간다. (관리자 권한으로 접속하지 않을 시 뜨는 에러: Could not start service. Error code: 5) cd를 통해서 nexus-(설치한버전)\bin 위치로 들어가서 nexus.exe /install nexus.exe /run -오류 해결방법- 1. nexus.exe /start 오류 nexus is starting... Windows11 환경에서 시도했는데 위와 같은 오류로, 넥서스가 계속 실..

Vue Composable(컴포저블)

컴포저블이란? Vue 앱의 컨텍스트에서 컴포저블은 Vue 컴포지션 API를 활용하여 상태 저장 로직를 캡슐화하고 재사용하는 함수입니다. 우리는 보통 Input, Output 나오는 로직 -> Function(모듈) 라고 한다. 하지만, 컴포저블 함수는 '상태'를 리턴하는 것을 일컫는다. 상태가 컴포넌트 단위로 각각 생성된다 일종의 Factory처럼 상태를 사용하는 객체를 찍어내는 것이 기본 동작 방식이다. 하지만, 상태를 공유하고싶다면? (= 일종의 싱글톤 패턴처럼 상태를 관리하고싶다면?) Pinia, 혹은 VueX를 사용한다

Vue.js 기본 정리(v-for,데이터바인딩,EventHandler,v-if)

이 글은 Vue.js 사용에 앞서 가벼운 사용 방법을 적어 둔 글이다. 참고 자료 : 유튜브 코딩애플(https://youtu.be/-tVaahsXpwk?si=z0Ki1RrHcGBks7qD) 프로젝트 생성 vue create 프로젝트명 미리보기 띄우고 싶으면 터미널에 npm run serve 위와 같이 입력하면 된다. Vue는 index.html이라는 메인페이지 않에 App.vue코드를 박아넣는 것 디렉토리/파일 설명 node_modules :프로젝트에 쓰는 라이브러리들 src : 소스코드 다 담는곳 public : html파일, 기타팡리 보관 package.json : 라이브러리 버전, 프로젝트 설정 기록 Vue 특징(with 코드) {{데이터 바인딩}} = JS 데이터를 HTML에 꽂아 넣는 문법 d..

[SpringBoot] java record와 DTO에 관하여...

SpringBoot에서 Input, Output처리에 대해 정의하는 글이다. VO(Value Object) : 불변값 -> 따라서 return값으로 사용(수정X) DTO(Data Transfer Object): Getter/Setter 자유롭게 사용(수정O) (암기는 DTO가 T가 들어있으니 geTTer/seTTer 를 사용한다고 생각하면 된다.) Client한테 받을때(수신정보) : BO(Business Object) Server에서 보낼때(송신정보) : VO(Value Object) 흔히 위 객체를 InputVO, OutputVO로 혼동해서 쓰는데, 사실 여기서는 Ouput일때는 BO로 쓰는것이 조금 더 명확한 표현이라 할 수 있다. *BO(Business Object) : 비즈니스 로직을 포함하는 ..