Web 5

[REACT 이론] [01] 시작

REACT 컴포넌트 기반의 라이브러리 React 애플리케이션은 작고 재사용 가능한 컴포넌트로 구성 Virtual DOM을 사용하여 UI를 관리하고 업데이트 컴포넌트는 UI를 구성하는 요소로, 사용자 인터페이스의 여러 부분을 담당할 수 있습니다. 예를 들어, 버튼, 입력 폼, 헤더, 사이드바, 그리드 등이 모두 React 컴포넌트로 만들어질 수 있습니다. React 애플리케이션을 개발할 때, 이러한 작고 독립적인 컴포넌트를 만들고 조합하여 전체 UI를 구성▶ 코드의 재사용성과 유지보수성을 향상시키며, 대규모 애플리케이션의 더 쉽게 개발 가능 성능을 최적화하고 DOM 조작 작업을 효율적으로 처리할 수 있습니다. 컴포넌트 기반 아키텍처와 Virtual DOM을 결합하여 React는 빠르고 유연한 웹 애플..

Web/REACT 2024.03.04

[JAVASCRIPT 이론] AX5UI 구성

AX5UI 구성 - 다양한 UI 컴포넌트들이 제공 - 각각의 컴포넌트는 필요한 것들만 따로 받아서 사용 - 전체를 포함하는 파일 AX5UI 종류 ax5core AX5UI 에서 사용되는 공통 유틸리티 함수들 모음 ax5ui-kernel 모든 컴포넌트 모음 ax5ui-menu 컨텍스트 메뉴 ( 마우스 우클릭 시 팝업 메뉴 ) ax5ui-grid 테이블 형식으로 데이터를 표현할 수 있는 컴포넌트 ax5ui-docker 화면 분할, 분할된 영역의 크기를 조절, 각 영역들을 이동할 수도 있는 컴포넌트 ax5ui-mask 레이어로 화면을 마스킹 할 수 있는 컴포넌트 ( 화면에 Action 을 할 수 없도록 막는 용도로 사용 ) ax5ui-autocomplete 입력필드에 입력값 제안 기능을 줄 수 있 컴포넌트 ax..

Web/JAVASCRIPT 2024.02.05

[JAVASCRIPT 이론] AX5UI - Select Box

✅ SELECT BOX 기본값jsp/* ax5ui 컴포넌트를 모두 사용하기 위해 필요한 스크립트와 스타일시트 */ javascript$('[data-ax5select="test"]').ax5select({ options: [ {value: "", text: ""}, {value: "", text: ""}, {value: "", text: ""} ]});      📍 SELECT BOX 선택한 값의 데이터 셋팅 javascript$('[data-ax5select="test"]').ax5select(“setValue”, value, true);// 셀렉트 박스에서 현재 선택한 값의 데이터를 셋팅 ex)$('[data-ax5select="test"]').ax5sel..

Web/JAVASCRIPT 2024.02.05

[JAVASCRIPT 이론] AX5UI - Grid

📌 ax5ui-grid 사용법  jQuery 1.X + 와 ax5core가 필요  ▼ 필요한 스크립트와 스타일시트  1. 그리드만 사용 그리드 컴포넌트 자바스크립트 파일과 jQuery, 그리드 스타일 시트 파일을 페이지에 포함 /* jquery *//* ax5core */  2. ax5ui 컴포넌트를 모두 사용        ✅ Grid 기본값javascript/* ax5.grid 기본 객체 생성 */var testGrid = new ax5.ui.grid();testGrid.setConfig({ target : $('[data-ax5grid="testGrid"]') //어떤 그리드를 나타내는지 header: { }, body: { }, columns: [ {key..

Web/JAVASCRIPT 2024.02.01