로이팩토리

관리 화면들을 만들다 보면 제일 많이 요구되는 부분이 엑셀 다운입니다. 이는 아무래도 웹에 익숙하지 않은 이용자들의 경우 엑셀이 더욱 익숙한 경우도 있고, 화면에서 표현하지 못하는 많은 부분을 엑셀을 통해서 확인 가능하기도 하기 때문입니다. (웹 화면은 개발자가 요청을 수렴 또는 분석을 통해 필요 정보를 노출하게 되지만 실제로 이용자는 그 외적으로 데이터를 조작해서 보고 싶어 하는 경우가 더러 있습니다. 최근에는 빅데이터를 활용하기도 하지만, 학습이 필요한 부분이 있기 때문에 엑셀을 통한 데이터 전달하는 게 없어지는 건 아무래도 몇 년 이내에는 어려울 것으로 보입니다.) /** * 엑셀 다운로드 * @param fileName 엑셀파일명 (ex. excel.xls) * @param sheetName 시트..

스크립트문을 작성하다보면 브라우저의 특성 및 운영체제별로 기능을 분리해야하는 경우가 발생합니다. 이전글에서 모바일과 PC버전에 따른 기능분리에 대해서 이야기할때 잠깐 스쳐지나간 navigator에 대해 좀 더 자세히 이야기해볼까 합니다. 2020/08/13 - [개발 창고/웹 개발] - [Javascript] 모바일과 윈도우 구분짓기, User-Agent [Javascript] 모바일과 윈도우 구분짓기, User-Agent 얼마전 고객의 요청으로 모바일과 윈도우에 동일 기능에 대해 다르게 작동해야하도록 하는 소스를 구현해야 하는 일이 생겼습니다. 그래서 작업하는 김에 또 이렇게 창고에 작업을 남겨두기 위 royzero.tistory.com 일단 navigator에 대한 모든 프로퍼티는 아래의 명령으로 확..

얼마전 고객의 요청으로 모바일과 윈도우에 동일 기능에 대해 다르게 작동해야하도록 하는 소스를 구현해야 하는 일이 생겼습니다. 그래서 작업하는 김에 또 이렇게 창고에 작업을 남겨두기 위해 글을 작성해 봅니다. 참고로 자체 제작 어플을 이용하는 경우엔 AndroidBridge를 활용하면 더 확실하지만, 안드로이드/애플의 브라우저 어플에서 실행할때는 이런 부분에 제약이 있습니다. 2020/08/04 - [개발 창고/안드로이드 개발] - [Android] 안드로이드 기능을 웹에서, AndroidBridge [Android] 안드로이드 기능을 웹에서, AndroidBridge Android 개발 시, 기존 모바일웹을 어플로 띄우고 싶을 때가 있을 겁니다. 그럴 때 사용하는 게 바로 WebView인데 가끔 Web에..

html에서 form을 만들때 가장 쉽게 실수 하는 부분이 submit에 대한 것입니다. 모든 전처리를 서버에서 하는 경우에는 문제가 되지 않지만, javascript내에서 전처리르 하게 하는 경우에는 이 부분이 오작동을 일으키기도 합니다. 다음과 같이 html소스가 되어있다고 가정하고, 해당 파일이 http://localhost:8080/main.html 이라고 가정하였을 때, 다음과 같은 입력창이 하나 생성됩니다. 여기에 아무 텍스트나 입력하고 엔터를 치게 되면, 어떻게 될까요? 결론부터 말하면 아래와 같이 호출되게 됩니다. http://localhost:8080/main.html?keyword= 두 가지 방법이 있는데 javascript에서 막는 방법 (jQuery 기준) $("[name=editF..

Android 개발 시, 기존 모바일웹을 어플로 띄우고 싶을 때가 있을 겁니다. 그럴 때 사용하는 게 바로 WebView인데 가끔 Web에서 안드로이드의 기능 (ex. 카메라, 바코드스캐너, 알림 등등)을 사용하고 싶을 때가 있을 겁니다. 물론 최근의 WebView는 그런 걸 많이 커버하려고도 하지만, 커스터마이즈한 기능들까지 다 커버하지는 못하죠. 그럴 때, 개발자의 갈증을 2프로 정도 해소해줄 수 있는 기능이 바로 AndroidBridge입니다. 이는 AndroidBridge라고 따로 있는 건 아니고 기능상으로 그러하다는 거고 webview를 통해 web과 android가 통신할 수 있도록 다리를 놓아주는 기능이기 때문에 AndroidBridge라고 보시면 됩니다. 1. Bridge 만들기 impor..

흔히 은행권에서 많이 볼 수 있는데요 금액을 숫자로 표기하다 보면 금액이 헷갈릴 수 있기 때문에 편의를 위해 제공되는 기능으로 금액을 한글로 표기해주는 경우가 많죠 /** * @param val 가격정보 (Type. Number) */ function _fmtNumberKor(val){ var numKor = new Array("", "일", "이", "삼", "사","오","육","칠","팔","구","십"); // 숫자 문자 var danKor = new Array("", "십", "백", "천", "", "십", "백", "천", "", "십", "백", "천", "", "십", "백", "천"); // 만위 문자열 var result = ""; if(val && !isNaN(val)){ // CA..

웹 화면에서 날짜 선택을 위한 캘린더를 구현하는 것은 매우 번거로운 일입니다. 때문에 API를 쓰는 경우가 많은데요, jQuery UI에서는 보통 이런 기능을 기본으로 제공하기 때문에 script에 jquery를 import 했다면, 그냥 datepicker의 대상만 지정해주면 쉽게 사용할 수 있습니다. 기본 사용법 Date: 기본적으로 $("대상").datepicker();를 사용해주면, 대상 Element를 클릭 시에 바로 아래 날짜 선택이 가능한 Calendar가 호출됩니다. 이 캘린더를 커스터마이즈 하고 싶은 경우엔 옵션을 추가해줄 수 있는데, datepicker({옵션명1:옵션값1, 옵션명2:옵션값2})와 같은 형태로 추가 가능합니다. 해당 옵션은 아래의 사이트에서 세부적으로 확인 가능합니다. ..

보통 웹페이지를 한번 띄우면 페이지 내의 모든 콘텐츠를 가져오기 때문에 화면의 로드가 길어지는 경우가 많습니다. 때문에 실제로 사용자가 보고 싶은 화면이 아닌 경우에도 (단순히 해당 페이지에 보이는 메뉴를 클릭해서 다른 페이지를 가고 싶은 경우나 스크롤을 내리지 않고 현재 화면에서의 콘텐츠를 클릭하고 싶을 때) 페이지를 기다리게 되고, 또 서버 측면에서는 사용자가 보지 않는 콘텐츠까지 전송해야 하므로 트래픽적으로도 문제가 되는 경우가 많습니다. 특히나 웹보다 저용량으로 제공되어야 하는 모바일에서는 특히나 고려해야 할 대상입니다. 그중에서도 가장 많은 비중을 차지하는게 이미지인데, 이 이미지의 트래픽량을 줄여줄 방안 중 하나가 LazyLoad입니다. 이는 이미지가 현재 화면에 노출되어야 하는 경우에만 서버..