WebGL(Web Graphics Library)은 별도의 플러그인 설치 없이 웹 브라우저에서 하드웨어 가속(GPU)을 이용해 2D 및 3D 그래픽을 구현할 수 있게 해주는 자바스크립트 API입니다. 핵심 특징으로는 HTML5 Canvas 요소 지원, OpenGL ES 기반 동작, 플러그인 불필요 등이 있습니다. WebGL은 현재 웹 산업에서 매우 활발하게 사용되고 있으며, 기술적 중요도가 계속 높아지고 있는 분야입니다. 특히 산업용 시스템(MES/WMS)을 다루시는 환경이라면 더욱 그렇습니다. 웹 환경에서 3D 또는 복잡한 2D 그래픽 렌더링이 필요할 때 WebGL은 대체 불가능한 표준 기술입니다. 1. WebGL이 사용되는 주요 분야디지털 트윈 (Digital Twin) 및 관제 시스템: 공장 자동화..

화상회의 서비스(Zoom, Google Meet), 온라인 상담, 라이브 스트리밍, 화면 공유 서비스 등을 만들 때 가장 많이 사용되는 기술 중 하나가 바로 WebRTC(Web Real-Time Communication) 입니다. WebRTC는 별도의 플러그인 설치 없이 브라우저와 모바일 앱에서 실시간 음성, 영상, 데이터 통신을 가능하게 하는 오픈 표준 기술입니다. WebRTC가 탄생한 이유과거 웹 브라우저에서 실시간 영상 통화를 구현하려면 Flash, ActiveX 같은 별도 플러그인이 필요했습니다. WebRTC는 이런 문제를 해결하기 위해 등장했으며, 현재는 Chrome, Edge, Firefox, Safari 등 주요 브라우저에서 기본 지원됩니다. WebRTC의 주요 특징1. 실시간 통신음성 통화..

ajax call웹개발을 하면서 가장 많이 사용하는부분이 자바스크립트이고 그중 JQuery 를 많이 사용하는데요. Jquery 를 사용하여 ajax를 호출하여 데이터 처리하는데 많이 사용합니다. 버튼을 눌렀을 때 화면의 값을 읽어서 DB 처리 페이지로 넘겨 주로 처리하죠var form_data = { MODE: "SAVE", DATA1: $("#DATA1").val()};// 폼 데이터 POST 로 넘길 값들$.ajax({ type: "POST", // POST 방식으로 호출 url: "URL", // URL 정보 data: form_data, success: function (response) { alert(response); // response 에는..

웹프로그래밍을 하다보면 화면에서 엑셀로 Export 해달라는 기능요청이 있는데 스프링, JSP 로 웹프로그램을 만들때 사용하는 팁을 소개합니다. table 내용을 엑셀로 export 하는 소스 입니다. excel_download.jsp 소스웹페이지에서 호출은 아래 소스를 동작 할 페이지에 넣어 줍니다. 버튼 클릭 이벤트에다가 다음과 같이 코딩하면 됩니다. ​"#table" 값이 export 할 테이블 아이디구요.​ Jquery 를 통해서 호출합니다.$("#excel_table").val($("#table").html());$("#excel_form").submit(); 처음에 form tag 값을 사용하지 않고 Jquery 로 호출을 했는데 정상적으로 동작하지 않아서 form 태그를 사용하게 되었습니다.

로컬 스토리지이번 웹 작업을 하면서 세션을 사용하기에는 데이터량이 많고 만료시간이 없어 오랫동안 데이터를 보관할 수 있는 로컬 스토리지를 사용해보기로 하였습니다. ​사용법은 생각보다 간단하네요 Key, Value 쌍으로 데이터가 저장되고 Key 값을 이용해 값을 불러올 수 있네요. ​로컬 스토리지에 데이터를 저장하는 방법은 자바스크립트에서// 로컬 스토리지에 값 저장localStorage.setItem('A', 'AAA');localStorage.setItem('B', 'BBB');이런 식으로 저장하면 됩니다. 불러올 때는 var A = localStorage.getItem('A');그리고 로컬 스토리지에 여러 가지 메서드가 있는데localStorage.removeItem(키); // 해당 키를 지운다...

Github.io 페이지에 갤러리 만들기https://skshpapa80.github.io/photo/?data=1 Photo | 선경선향아빠의 HomepageMES 개발자skshpapa80.github.io위 페이지를 만들 때 JSON 파일에 이미지 정보를 넣고 이미지 정보를 읽어서 위 이미지처럼 뿌리는 javascript입니다. github.io 에 홈페이지를 운영하고 있는데 갤러리를 만들어 보고 싶었습니다. 그런데 일일이 HTML에 입력하는 건 좀 아닌 거 같아서 JSON 을 DB처럼 활용하고 Jquery로 읽어 와서 갤러리처럼 표시하면 될 거 같았습니다.$(document).ready(function() { $(document).on("click","#open-image",function(..