Front

· Front/Vue
⚡ 개요개발 단계에서 발생한 session 이슈가 있어서 해당 내용을 정리 하려고 한다. 운영 단계에서는 발생할 가능성이 적은 내용이며 보안상의 이슈이기 때문에 간단하게만 정리하고 넘어가려고한다. 특정 데이터를 통신 과정에서 유지하기 위해서 session, cookie, token 등 여러가지 방법이 존재한다.Spring boot session 을 검색만 하더라도 어떻게 구현을 해야하는지도 나온다. 물론 개념적으로 더 알면 좋지만 검색을 하고 따라만 하더라도 개발자 도구에서 쿠키를 확인 해보면 session ID가 들어오고 유지되는 부분을 확인 할수가 있다.로그인 페이지를 구현하고 테스트 하는 과정에서 계속 session에 저장되지 않고 새로운 session이 생기는 이슈가 발생해서 내용을 정리하게 되었..
· Front/Vue
⚡ 개요spring boot + vue 프로젝트를 진행할 때, vue에서 router를 설정했지만, 새로고침을 하는 순간 404 에러 페이지가 로드되는 이슈에 대해서 내용 및 수정 방법에 대해서 정리를 하려고 한다. 일단 기본적으로 404가 나오는 이유에 대해서 설명하자면 새로고침을 하는 순간 spring에서 servelt에 맵핑된 주소를 찾는데 없기 때문에 404가 발생하는 것이다. 단순하게 컨트롤러에 전부 맵핑을 해준다면 해결되는 이슈이기도 하다. Vue는 SPA이고, index.html 페이지 내에서 모든 동작이 이뤄지도록 되어있다. 페이지 이동을 몇 번을 하던 결국은 index.html 페이지 하나에서 동작한다고 보면 된다. ⚡ History Modevue 공식 문서를 확인 해보면 History ..
· Front/Vue
⚡ 개요최근에 프로젝트를 하면서 신규로 적용했던 내용을 정리하려고 한다. 일단 공식 가이드 문서가 순차적으로 잘 되어있기 때문에 공식 가이드를 먼저 보는 걸 추천한다 (링크)  공식 가이드 문서가 잘 되어 있기때문에 설치에 대한 내용은 보고 따라 하는 게 편하다. vue cli를 통해서 라이브러리를 추가하는 방법도 존재하고, 이미 프로젝트가 존재하는 경우에도 추가하는 방법이 자세히 설명되어 있다. ⚡ 사용 이유공식 가이드에 따른 장점과 내가 적용을 하면서 느낀 사용 이유에 대해서 정리를 해놓으려고 한다.  📗 공식 가이드 문서 기준 사용 이유 (링크)1. 지원 범위가 넓다.React를 기준으로 가이드가 작성되어 있지만 다른 FrontEnd 프레임 워크를 지원 하고 있다. 2. HTTP 네트워크 통신아마..
· Front
⚡ 개요 2023년도 끝나가는데 새로운 언어에 대해서 공부를 하고 도전해보려고 한다. 많은 언어들이 있지만 파이썬을 선택한 이유는 많은 정보를 찾아봤을때 웹을 가장 빨리 만들고 쉽게 만들 수 있다고 소개를 하고 있다. 회사에서 개발을 하다보면 중간에 계속해서 기획이 변경되는 과정들이 존재한다. 이 과정에서 내가 사용하고 있는 자바로 프로토 타입을 만든다고 했을 때, 기존 소스를 카피해서 만들어야 하고 지금의 경우는 프로젝트가 커짐에 따라서 이 또한 쉽지도 않다. 이런 저런 이유가 존재하지만 결국은 쉽게 만들 수 있고, 많은 개발자들이 사용하고 있는 파이썬을 서브 언어로써 사용해 볼 수 있도록 공부를 해보려고 한다. 물론 자바로 개발을 하고 있기 때문에 코틀린의 경우는 짬짬이 공부를 하고 있다. :) 예전..
· Front
⚡ 개요 PWA는 Progressive Web App의 약자이다. PWA는 모바일 웹 애플리케이션의 새로운 형태로 사용자가 앱을 다운로드하거나 설치하지 않아도 모바일 기기에서 애플리케이션을 실행할 수 있게 해준다. PWA는 일반적인 모바일 웹 사이트와 유사하지만 추가적인 기능을 제공한다. 예를 들어 오프라인에서도 작동할 수 있고 네이티브 앱과 유사한 기능을 제공하며 앱 아이콘을 홈 화면에 추가할 수 있다. PWA는 웹 기술로 만들어지기 때문에 앱 스토어의 검토 과정을 거치지 않아도 되고 업데이트가 더욱 용이하다. 또한 여러 플랫폼에서 동작할 수 있기 때문에 개발자는 앱을 각 플랫폼마다 따로 개발할 필요가 없다. PWA는 현재 많은 기업이 적극적으로 도입하고 있으며 모바일 웹 애플리케이션의 발전에 큰 역할..
· Front/Vue
⚡ 개요 vue 를 사용하는데 있어서 기본적인 사용 방법에 대해서 정리를 하려고 한다. 프론트쪽 개발도 간간히 같이 하고 있는데 jsp를 개발할때와는 다르게 내 기준으로는 작업을 하는데 이해가 안되는 부분도 많고 왜 이렇게 동작하는지 이해가 안가는 부분이 많아서 최근에 백엔드 공부와 별개로 정리 하면서 공부를 하고 있다. ⚡ 라이브러리 정리 📒 Vuex 애플리케이션의 상태를 효율적으로 관리하기 위한 중앙 집중식 저장소다. Vue Store는 일반적으로 Vuex라는 Vue.js 공식 상태 관리 라이브러리를 사용하여 구현된다. (vue3.x 에서는 공식 상태 관리 라이브러리가 pinia로 바뀌었다.) Vuex를 사용하면 애플리케이션의 모든 컴포넌트에서 전역으로 상태를 관리할 수 있으며, 상태의 변화를 추적하..
· Front/Vue
⚡ 개요 회사에서 프로젝트를 개발하면서 vue.js를 처음 사용하게 되었다. 처음에는 아무것도 모르고 사용을 했고 어느 정도 사용했을 때는 내가 잘 알고 사용하는 것이 맞는가? 이렇게 사용해도 되는 건가? 에 대한 의문이 들었고 vue에 대해서 기본적인 내용과 추가적으로 내가 개발하면서 느꼈던 내용들을 정리해놓으려고 한다. ⚡ vue란 무엇인가? 탄생 배경 및 기본적인 개념 Vue.js는 Evan You가 개인적으로 개발하면서 AngularJS와 React.js를 참고하여 만든 자바스크립트 프레임워크이다. Vue.js의 가장 큰 특징은 간결한 문법과 컴포넌트 기반 아키텍처, 그리고 반응형 UI를 제공한다는 것이다. Vue.js는 MVVM(Model-View-ViewModel) 아키텍처를 기반으로 한다. ..
HaeTae
'Front' 카테고리의 글 목록