반응형 Development/Web12 [Web] 뷰 컴포넌트 통신 이번 포스팅은 뷰 컴포넌트의 통신에 대하여 알아보도록 하겠습니다. #1. 컴포넌트 간 통신과 유효 범위 앵귤러1이나 백본(backbone.js)과 같은 초창기 자바스크립트 프레임워크에서는 한 화면을 1개의 뷰로 간주했습니다. 따라서 한 화면의 데이터를 해당 화면 영역 어디서든지 호출할 수 있었죠. 하지만 뷰(Vue.js)의 경우 컴포넌트로 화면을 구성하므로 같은 웹 페이지라도 데이터를 공유할 수 없습니다. 그 이유는 컴포넌트마다 자체적으로 고유한 유효 범위(Scope)를 갖기 때문입니다. 이는 뷰 프레임워크 내부적으로 정의된 특징입니다. 따라서 각 컴포넌트의 유효 범위가 독립적이기 때문에 다른 컴포넌트의 값을 직접적으로 참조할 수가 없습니다. 다음 예제를 보겠습니다. 이 예제는 2개의 지역 컴포넌트를 등.. 2022. 9. 19. [Web] 뷰 컴포넌트 이번 포스팅은 뷰 컴포넌트에 대하여 알아보도록 하겠습니다. #1. 컴포넌트 컴포넌트(Component)란 조합하여 화면을 구성할 수 있는 블록(화면의 특정 영역)을 의미합니다. 컴포넌트를 활용하면 화면을 빠르게 구조화하여 일괄적인 패턴으로 개발할 수 있습니다. 이렇게 화면의 영역을 컴포넌트로 쪼개서 재활용할 수 있는 형태로 관리하면 나중에 코드를 다시 사용하기가 훨씬 편리합니다. 또한 모든 사람들이 정해진 방식대로 컴포넌트를 등록하거나 사용하게 되므로 남이 작성한 코드를 직관적으로 이해할 수 있습니다. 뷰에서는 웹 화면을 구성할 때 흔히 사용하는 내비게이션 바(Navigation bar), 테이블(Table), 리스트(List), 인풋 박스(Inout box) 등과 같은 화면 구성 요소들을 잘게 쪼개어 .. 2022. 9. 18. [Web] 뷰 인스턴스 라이프 사이클 이번 포스팅은 뷰 인스턴스 라이프 사이클에 대하여 알아보도록 하겠습니다. #1. 뷰 인스턴스 라이프 사이클 인스턴스의 상태에 따라 호출할 수 있는 속성들을 라이프 사이클(Life Cycle) 속성이라고 합니다. 그리고 각 라이프 사이클 속성에서 실행되는 커스텀 로직을 라이프 사이클 훅(hook)이라고 합니다. ▶라이프 사이클 : 모바일 앱을 비롯하여 일반적으로 애플리케이션이 가지는 생명 주기 라이프 사이클 속성에는 created, beforeCreate, beforemount, mounted 등 인스턴스의 생성, 변경, 소멸과 관련되어 총 8개가 있습니다. 이 그림은 인스턴스가 생성되고 나서 화면에 인스턴스가 부착된 후 소멸되기까지의 전체적인 흐름을 나타낸 뷰 인스턴스 라이프 사이클 다이어그램입니다. 라.. 2022. 9. 18. [Web] 뷰 인스턴스 이번 포스팅은 Vue.js에서 뷰 인스턴스에 대하여 알아보도록 하겠습니다. #1. 뷰 인스턴스의 정의와 속성 뷰 인스턴스(Instance)는 뷰로 화면을 개발하기 위해 필수적으로 생성해야 하는 기본 단위입니다. 인스턴스는 뷰로 화면을 개발하기 위해 빠트릴 수 없는 필수 조건입니다. 뷰 인스턴스 생성 뷰 인스턴스를 사용하기 위해 아래쪽과 같은 형식으로 뷰 인스턴스를 생성합니다. new Vue ( { ..... } ); 그럼 'Hello Vue.js' 샘플 코드에서 인스턴스와 관계된 부분을 다시 한번 살펴보도록 하겠습니다. {{ message }} 먼저 'Hello Vue.js' 텍스트를 화면에 표시하기 위해 new Vue()로 뷰 인스턴스를 생성하였습니다. 그리고 인스턴스 안에 el 속성으로 뷰 인스턴스가.. 2022. 9. 18. [Web] JSP에서 데이터를 엑셀 파일로 내보내는 방법 완벽 가이드 JSP에서 데이터를 엑셀 파일로 내보내는 방법 완벽 가이드웹 개발을 하다 보면 사용자가 데이터를 엑셀 파일로 다운로드할 수 있게 해야 하는 경우가 많습니다. 특히 JSP 환경에서 작업하는 개발자라면 이 기능을 어떻게 구현해야 할지 고민하실 텐데요. 이 글에서는 JSP에서 데이터베이스의 정보를 엑셀 파일로 변환하고 다운로드하는 방법을 단계별로 자세히 알아보겠습니다.목차필요한 라이브러리 준비하기기본 엑셀 파일 생성 방법데이터베이스 연동하기스타일과 셀 서식 적용하기다운로드 기능 구현하기자주 발생하는 문제와 해결 방법 #1.필요한 라이브러리 준비하기JSP에서 엑셀 파일을 생성하려면 Apache POI 라이브러리를 사용하는 것이 가장 일반적입니다. 이 라이브러리는 Microsoft Office 형식의 문서를 생성.. 2020. 4. 8. [Web] JSP / Servlet/ Java 에서 현재 경로 알아내는 방법 완벽 가이드 웹 개발 시 JSP/Servlet/Java에서 현재 경로 알아내는 방법 완벽 가이드웹 개발을 하다 보면 현재 작업 중인 파일이나 디렉토리의 경로를 알아내야 하는 상황이 자주 발생합니다. JSP, Servlet, Java 각 환경에서 현재 경로를 알아내는 방법은 조금씩 다릅니다. 이 글에서는 각 환경별로 현재 경로를 쉽고 정확하게 알아내는 방법을 상세히 알아보겠습니다.목차Java에서 현재 경로 알아내기JSP에서 현재 경로 알아내기Servlet에서 현재 경로 알아내기상대 경로와 절대 경로 이해하기자주 발생하는 문제와 해결 방법 #1. Java에서 현재 경로 알아내기일반 Java 애플리케이션에서는 다양한 방법으로 현재 작업 디렉토리와 클래스 경로를 알아낼 수 있습니다.1. 현재 작업 디렉토리(Working D.. 2020. 4. 8. 이전 1 2 다음 반응형