뭐가 자꾸 궁금한 개발자

오늘은”PWA(Progressive Web Application)“에 대해 자세히 알아보겠습니다. 최신 모바일 기술에 대한 자료 조사를 진행하다 흥미로운 트렌드인 PWA를 발견했습니다. 그중 ‘PWA가 앱스토어의 종말을 가져올 것이다.’, ‘앞으로 네이티브 앱으로 만들어야 하는 경우는 게임 말고는 없을 것이다’ 와 같은 일부 전문가들의 주장이 이번 포스팅의 주제를 정하는데 큰 역할을 했습니다. 본문에 들어가기에 앞서.. PWA(Progressive Web Application)라고 들어본 적 있으신가요? 쉽게 말해, 우리가 기존에 앱 스토어에서 설치하는 것 뿐만 아니라, 웹 기술만으로 앱과 같은 기능을 갖춘 웹 앱입니다. 개발자 입장에서 안드로이드/ios 지식 없이도 두 플랫폼 위에서 작동하면서 기기에 ..

어떤 경우에 사용했나? 보통 리스트성 데이터는 DB에서 조회해서 가져올 때 'order by' 를 이용해서 정렬된 데이터를 가지고 옵니다. 목록 데이터에 대한 정렬기준을 여러가지 제공하는 경우 매번 request를 요청하는건 불필요한 행위지요. 이럴 경우에는 jquery의 sort 함수를 이용해서 쉽게 정렬을 변경할 수 있습니다. html 기본구조 node.js에서 ejs 템플릿 엔진을 이용해서 html을 만든 예제입니다. 정렬의 기준이 되는 데이터를 html의 data 속성을 이용해서 각 li 태그에 설정해놓아야 합니다. (정렬을 위해 루프를 돌 때 정렬 기준 데이터를 가져올 수 있는 방법으로 세팅합니다.) //테스트 목록 //정렬 버튼 최신순 인기순 javascript 부분 $("#btnCreatDt..

이번 포스팅에선 달력 라이브러리를 하나 다뤄볼까 합니다. air - datepicker라는 녀석이고 jqeury가 필요합니다. 아래는 공식 홈페이지입니다. 다양한 예제와 사용법이 정리되어 있습니다. http://t1m0n.name/air-datepicker/docs/ Air Datepicker Datepicker's language. If string is passed, then language will be searched inDatepicker.languageobject. If object is passed, then data will be taken from this object directly. If some fields are missing, they will be taken from defau..

자바스크립트 변수의 선언 방법을 var, const, let으로 나누어 살펴보고자 한다. 자바는 int, String, long... 자바스크립트는 그런 거 상관없이 무조건 var~! 이것이 지금까지 주먹구구식으로 배운 나의 얕은 자바스크립트에 대한 지식이었다. 물론, var 외에 const, let 변수는 다른 분들이 코딩해놓은 소스에서는 종종 봤던 것 같다. var는 그렇다 쳐도 const, let... 도대체 이것은 무엇을 의미하는 것일까? 본격적으로 변수의 선언 방식에 대해 알아보기 전, '스코프'의 개념부터 공부해봤다. ※ Scope(스코프)란? - 우리말로 번역하면 범위로, 자바스크립트에서는 변수에 접근할 수 있는 범위를 의미한다. - 전역과 지역, 함수와 블록으로 구분하여 알아본다. ㅁ 전역..

1.프로젝트 내에 연결한 톰캣 프로젝트의 server.xml을 연다. 2. 제일 밑으로 내리면 요놈이 있을 것인데 원래는 한 줄로 되어있고 제일 마지막에 /> 로 마감이 되어있을 것이다. /(슬래시) 지우고 3. 이렇게 되게 만든다. 4. 그럼 저 Context 태그 사이에 이걸 추가한다. 대충 이런 그림이 될 것임. 5. 저장하면 에러가 사라지고 실행 잘 됨. 출처 : https://october-east-sea.tistory.com/155 [JSP 오류]Name [DB명]은(는) 이 컨텍스트에 바인딩되지 않았습니다. [jdbc]을(를) 찾을 수 없습니다. 1.프로젝트 내에 연결한 톰캣 프로젝트의 server.xml을 연다. 2. 제일 밑으로 내리면 요놈이 있을 것인데 원래는 한 줄로 되어있고 제일 마..

자바스크립트로 웹 프로그래밍을 하다 보면 자주 Alert 함수를 사용하게 됩니다. Alert는 사용자에게 알림을 주고자 할 때 사용하는데요. 자바스크립트의 alert는 아주 기본적인 브라우저 UI를 제공하고 있습니다. 자바스크립트 기본 Alert 하지만 우리는 이런 알림창보다 더 예쁜 알림 창을 원하죠. SweetAlert2!! sweetalert2.github.io/ SweetAlert2 A beautiful, responsive, customizable and accessible (WAI-ARIA) replacement for JavaScript's popup boxes sweetalert2.github.io 해당 링크로 들어가면 사이트가 워낙 관련 내용을 잘 설명해줘서 제가 뭐 자세히 설명해 드릴 ..

1. 개요 PHP 에서 Array 형 데이터를 JSON 포멧으로 출력하고자 하는 경우 json_encode 함수를 호출함으로써 간단하게 데이터 변환이 가능하다. 단, 해당 함수는 UTF-8 형태의 String 값만을 사용할 수 있기 때문에 iconv 를 사용하여 UTF-8 인코딩을 하여 사용해야만 한다. 그런데 여기서 문제가 발생하는데, 한글 데이터를 사용할 경우 json_encode 함수가 한글을 유니코드 형태로 자동으로 변환해서 출력하게끔 되어 있다. 2. 해결 방안 PHP 5.4 버전 이상을 사용할 경우, 다음과 같이 상수 변수 값을 옵션으로 줌으로써 간단하게 해결이 가능하다. json_encode($arrJson, JSON_UNESCAPED_UNICODE); 그러나, 하위 버전 PHP를 사용하는 ..

위 구문을 php파일로 만들어 http://아이피/php파일 형식으로 웹에서 확인해보면됩니다., 출처 : https://djnote.tistory.com/42 [Windows ] mssql+php 연동테스트(sqlsrv) 위 구문을 php파일로 만들어 http://아이피/php파일 형식으로 웹에서 확인해보면됩니다., djnote.tistory.com

Chrome 에서 확인한 문제점. 프로세스 과정 1. 자바스크립트 함수를 호출해 document.body 에 iframe 요소를 생성한다. 2. 이어서 해당 함수 내에서 타이머 스레드를 생성한다. 3. 타이머 함수를 통해 iframe 안의 file type 의 input 박스를 검색한다. 4. 해당 개체를 발견한 경우 click 명령 이벤트를 호출한다. 5. Click 이벤트를 호출하고 나면 타이머 스레드를 clear 시킨다. 예상 결과 : 파일 업로드를 위해 대상 파일을 선택하는 다이얼로그가 뜬다. 프로세스 결과 - Internet Explorer 에서는 정상적으로 작동한다. - Chrome 에서는 팝업창이 호출되지 않는다. 해당문제에 대해서 구글 및 네이버 검색을 해보았으나 이에 대해 명료한 답을 찾..

웹퍼블리싱 작업을 하다 보면, 특히 반응형이나 모바일 환경에서 table, 표의 양의 방대하다보면 모바일 환경에서 많이 깨져서 보입니다 ,, 반응형 웹에서 테이블이 구조가 바뀌는 소스도 있겠지만, 가장 기본적인 디바이스 크기가 넘어가면 스크롤로 데이터를 볼 수 있게 해주는 css를 소개해드리겠습니다. 제목 제목 내용내용내용내용내용내용내용내용내용내용내용내용내용내용내용내용 내용내용내용내용내용내용내용내용내용내용내용내용내용내용내용내용내용내용내용내용 내용내용내용내용내용내용내용내용내용내용내용내용내용내용내용내용 내용내용내용내용내용내용내용내용내용내용내용내용내용내용내용내용내용내용내용내용 div {width:100%;overflow:auto;} div table {white-space:nowrap;border-collap..