1. 🎯 개요Java에서 AOP(Aspect-Oriented Programming)를 활용하여 로그인 시스템을 구현하는 방법에 대해 알아보겠습니다. AOP를 사용하면 비즈니스 로직과 로깅, 보안 검사 같은 부수적인 기능들을 분리하여 관리할 수 있습니다. 이로 인해 코드의 재사용성과 가독성이 증가하며, 유지보수가 쉬워집니다.2. 🛠️ 필요한 의존성 추가Spring Boot 프로젝트에 AOP를 적용하기 위해, 먼저 pom.xml에 의존성을 추가해야 합니다. AspectJ와 Spring AOP를 사용할 예정입니다. org.springframework.boot spring-boot-starter-aop org.aspectj aspectj..
WEB
🤬 문제 Spring boot를 이용해 jsp를 호출함에 있어 Itellij IDE에서 아래의 오류 발생 페이지를 찾을 수 없음 404 ERROR 😅 원인 해당 프로젝트 실행 설정 중 Working Directory이 부모 폴더의 경로로 설정이 되어있었다. EX) portal/parents ☺ 해결방법 실행 configurations 변경 필요 오른쪽 상단 콤보박스 > 실행 Application 확인 > Configuration Edit > Modify Options > Working directory > portal/parent/myDitectory 수정
VueJS는 인터랙티브 웹 인터페이스를 구축하기 위한 라이브러리로 간단하고 유연하게 사용 가능한 데이터-반응성 컴포넌트 API를 제공합니다. 다수의 개발자들이 VueJS를 사용하는 이유는 가볍고, 쉽기 때문입니다. 쉽다고는 하지만 컴포넌트 간 통신을 위해 부모/자식 컴포넌트 간 props를 전달하거나, 변경해야하는 문제가 발생합니다. 종종 props를 사용하지 않고 this.$parent.data와 같은 접근 방식을 사용할 수 있습니다. 자식 컴포넌트는 부모 컴포넌트에 $emit()을 사용하여 이벤트를 발신하는 방법으로 통신합니다. 이러한 방법이 부모 컴포넌트의 데이터를 변경하는 간단한 방법일지 모르지만, 프로젝트 규모가 커지고 컴포넌트가 많아짐에 따라 받는 스트레스 또한 가중됩니다. 예를 들어 30개의..
1. 소스 받기 git clone [url] 2. 소스 내 Project, Modules 설정 SDK 설정 File -> Project Structure -> Modules clone받은 소스에서 Maven 프로젝트 디렉토리를 Module로 설정 한다. File -> Project Structure -> Modules 해당 소스는 2개의 Maven 프로젝트(LTE-R_COMMON_SERVER, LTE-R_JEOLLA_UI)를 포함하고 있어 두개 모두 Maven Module로 설정을 해준다. Apply 후 OK Maven 목록에서 두개의 버튼을 클릭하여 새로고침 후 Maven Update를 해준다. 3. Tomcat 설정 Run -> Edit Configration Tomcat Server -> Local..
Nuxt.js를 이용해 페이지 이동 시 변수를 넘기는 방법은 2가지(qnery,params) 가 있습니다. 아래와 같이 데이터를 넘길 수 있습니다. this.$router.push({ name: 'board-list', //URL 노출 query: { boardType: "test1" }, //URL 비노출 param" { boardType: "test2" } }) 넘어온 데이터는 아래와 같이 확인 할 수 있습니다. //query 데이터 확인 console.log(this.$route.query.boardType) //board 데이터 확인 console.log(this.$route.params.boardType) query를 사용하면 데이터가 노출되지만 새로고침 시에도 데이터를 유지 시킬 수 있다. p..
개발환경 Nuxt.js 2 Vue.js 2 Spring Boot 3요청사항 ❓ API에 권한을 입히면서 특정 API 사용 시 alert를 노출시키고 페이지 이동은 원하지 않는다는 요청사항이 있어 이를 구현하였습니다.개발 내용 💭 Back End에서 권한을 체크하는 AOP를 하나 만들어 체크를 원하는 API에 Annotation을 넣어 Exception처리를 하도록 구현하였습니다. Front End에서 해당 Error를 보고 권한에 대한 Error일 경우 alert를 발생시켜야 합니다. 문제발생 ❗ 공통적으로 처리하기위해 axiox.onError({})로직에 처리를 하려다 보니 무조건 적으로 Error 페이지로 이동하는 현상 발생 이는 Nuxt 설정으로 헤더 정보를 보고 Error 발생 시 error.vu..
프로젝트 마무리 단계에서 웹 호환성 체크를 하다보니 그동안 모호하게 알고있던 지식에 대해 정리가 필요하다는 것을 알게되어 확실한 정리는 하려고 해보려고 합니다. Front End 개발환경 Nuxt.js 2 Vue.js 2 먼저 세 가지 개념인 서버 사이드 렌더링(SSR), 클라이언트 사이드 렌더링(CSR), 그리고 번들링에 대해 자세히 알아보겠습니다. 서버 사이드 렌더링 (SSR) 서버 사이드 렌더링은 웹 애플리케이션의 초기 HTML을 서버에서 생성하고 클라이언트에 제공하는 방식입니다. 클라이언트는 이 HTML을 받아 브라우저에서 렌더링합니다. 이것은 검색 엔진 최적화(SEO)를 향상시킬 수 있으며, 초기 페이지 로딩 시간을 줄일 수 있습니다. 클라이언트 사이드 렌더링 (CSR) 클라이언트 사이드 렌더링..