본문 바로가기

Programming47

accessToken / refreshToken(React with Zustand) 추후 실무에 투입된 내가 보려고 쓰는 게시글 Vue건 React건 상태관리를 위해 store를 사용하는데, 로그인 정보 같은걸 새로고침 하면 리로드 되는 이슈로 인해persist라는 옵션을 사용하게된다.근데 이 persist는 아시다시피 보안이슈가 있음.왜냐면 localStorage에 저장되는 거라 보안에 취약하기 때문이다. 그래서 token 같은 경우는 HttpOnly Cookie로 처리하게 되는데, 아래 예시는 accessToken은 js메모리 기반으로 저장하고, refreshToken은 spring 쪽에서 cookie에 저장해서 처리한다는 가정하에 미리 작성한 예시코드이다. Auth Store (메모리 기반 access token)// stores/authStore.tsimport { crea.. 2026. 1. 8.
JPA 에러 로그 확인 방법(InvocationTargetException) JPA를 사용하던 중, 프론트쪽에서 모든 데이터가 정상적으로 들어오고 있음에도계속 InvocationTargetException 에러를 뱉어냈다. run 탭에 로그도 안찍히고 답답하던 찰나,src > main > resources > application.properties에 아래 한 줄 추가해 주니까run 탭에서 그제야 어떤 에러인지 제대로 보였다. spring.jpa.properties.hibernate.jdbc.lob.non_contextual_creation=true DB설정이 UTF-8이 아닌 다른걸로 설정되있어서 발생했던 에러였다..2시간만에 에러 수정!!!!!!!!!!!!!!! 2025. 4. 23.
자바스크립트에서 this란? 🔍 this란?자바스크립트에서 "누가" 실행했는지를 가리키는 키워드다.기본적으로는 window를 나타낸다.   웹을 켜고 콘솔창에서 this를 입력하면 window 관련정보가 출력된다.  예를 들어서어떤 객체(Object) 안에서 함수를 실행하면, 그 함수 안의 this는 그 객체 자신을 가리킨다. const student = { name: 'ashley', sayHello: function () { console.log(this.name + ' 안녕!'); }};student.sayHello(); // 👉 "ashley 안녕!" (this는 student를 가리킴)     익명 함수에서 this  VS 화살표 함수에서 this 익명함수(function)const person = { na.. 2025. 4. 11.
script defer와 script async의 차이점 및 비교 우리는 보통 웹페이지를 만들 때 아래처럼 적는다. hello  위의 코드의 경우, 위의 head 태그부터 코드를 읽다가 script.js를 만나면 바로 실행되기 때문에 그동안 나머지 HTML 부분은 멈추게 된다.이게 바로 느려지는 이유그래서 등장했다. defer / async   defer  📄 본문 내용 // script.jsconsole.log('🕓 defer 실행됨!');  1. HTML 파싱과 script 파일 다운로드 동시에 시작2. HTML 다 파싱된 후 console.log 출력됨‼️단, 여러 defer 스크립트가 있다면 작성 순서대로 실행됨   async 📄 본문 내용 // script.jsconsole.log('⚡ async 실행됨!');  1. HTM.. 2025. 4. 11.
Vue 생명 주기(Lifecycle) 쉽게 이해하기 Vue 라이프사이클이란? Vue는 웹사이트를 만들 때 "컴포넌트"라는 블록을 사용함이 블록(컴포넌트)은 "탄생 → 성장 → 소멸" 과정을 거치는데, 이 과정을 'Vue 라이프사이클'이라고 한다.  Vue의 라이프사이클 단계 단계Vue에서 하는 일사람으로 비유1. beforeCreate데이터와 이벤트가 아직 준비 안 됨아기가 태어나기 전 (배 속)2. created데이터와 이벤트 설정 완료아기가 태어남 (이름,가족 등록 완료)3. beforeMount화면에 출력될 준비 완료유치원 가기 직전 (준비 다 됨)4. mounted화면에 실제로 표시됨유치원에서 친구들과 놈5. beforeUpdate데이터가 바뀌었지만 아직 화면에 반영 안 됨시험 성적이 나왔지만 부모님이 아직 모름6. updated화면이 새로운 데이.. 2025. 4. 3.
깃허브(github)에 push된 특정 파일 삭제 | 실수로 보안파일 올렸을 때 삭제 방법 github에 실수로 .env 파일을 올려버렸다.API KEY 정보들이 있기때문에 보안상 위험하다. 1. 터미널에서 삭제해야 하는 폴더가 있는 경로로 이동하고, 아래 명령어를 입력해 준다.git rm .env 그랬더니 아래와 같은 에러가 떴다. error: the following file has local modifications:     server/.env (use --cached to keep the file, or -f to force removal) .env 파일이 github에 올라간 뒤 로컬에 수정사항이 있어서 강제로 삭제해야 한다는 내용이다.당황하지 말고 2. git rm --cached .env 명령어 실행  3. 다시 commit 진행  4. push 진행 2025. 3. 26.