본문 바로가기

IT/Web Programming

Front-End 발전 역사와 개발 생태계 Front-End 발전 역사와 개발 생태계Introduction 이번 포스트는 과거 JavaScript 탄생부터 시작해서 어떻게 발전해왔는지에 대한 내용과 현재 Front End 개발에 있어서 무엇을 알아야 하는 지에 대한 전반적인 기술 상황에 대해서 알아보겠습니다. JavaScript 탄생 JavaScript라는 언어의 역사는 저의 다른 포스트에서도 볼 수 있지만 여기서도 간단하게 언급하고 넘어가겠습니다. JavaScript언어의 역사는 1995년 Netscape사의 Brendan Eich(브랜든 아이크)에 의해 개발된 Mocha라는 언어부터 시작됩니다. 이 Mocha라는 언어는 “Prototype의 개념과 Functional Language(함수형 언어)의 특성을 가지고 Web에 동적으로 활용할 수 .. 더보기
PDF 컨버터(출력물) DOMPDF 사용팁 # DOMPDF # 사용 팁 DOMPDF 는 HTML 을 PDF 로 변환해주는 컨버터입니다. PHP 5.0 이상에서 지원합니다. CSS 를 지원하며, @media, @page 작업도 지원합니다. CSS 상에서 왠만한 미디어쿼리 및 문서의 paging 기능도 지원하므로 예전에 리포트툴에 의존하던 특정기능들을 어느정도(?)는 지원할 수 있게 되었습니다. 기존의 FastReport로 작업된 출력물들을 DOMPDF로 작업을 했습니다. 툴을 별도로 설치할 필요가 없고, 기존 웹작업 하던대로 작업을 했기 때문에 출력물 또한 기존의 품질을 유지할 수 있었습니다. 처음 사용하던거라 많은 시행착오가 있었지만, 모든 툴이 다 그렇듯이 익숙함이 찾아오면서 나름 유용하게 사용했습니다. 허나 그래도 몇몇가지 문제가 존재합니다... 더보기
[PHP]PHP 코딩 스타일 가이드 Framework Interop Group에서 제시하는 Code Convention 룰(PHP 언어에만 적용되는) 이다.PSR은 0~4 까지 존재하며 이중 1, 2는 코딩 가이드 내용을 0, 4는 Auto Loading과 Log Interface를 제시한다.Drupal, Zend, Symfony, CakePHP, phpBB, AWS SDK, FuelPHP, Lithium등이 이 스타일을 따르고 있다.PSR의 목적은 (자신을 포함)다른 개발자들도 코드를 쉽게 읽고 사용할 수 있으며, 서드파티 라이브러리 연동에 일관성을 유지하도록 하는데 있다.1 PSR-0 / Autoloading StandardPSR-0 는 객체지향 PHP 에서 객체간의 충돌을 방지하고, 객체의 자동 불러오기(autoloader)의 상호운.. 더보기
[javascript] Promise를 사용해봅시다. 자바스크립트를 이용하여 웹페이지를 만들거나 어플리케이션을 만들다보면 콜백안에 콜백, 또 그안에 또 콜백..​ 이른바 콜백 지옥에 빠질수밖에 없습니다.​ 아무리 잘 설계 하고 분리 하여 개발 하여도 말이죠. 그런걸 해결 하기 위하여 Promise란것이 세상에 나왔습니다. 당연히 불행하게도 MS의 IE에서는 그런 기능이 빠진체로. IE를 무시 하고 싶을정도로 매력적인 Promise 기능에 대해 한번 알아보겠습니다. 먼저 콜백에 대해 얘기 해 봅시다. 콜백을 사용 하는 이유는 비동기 프로그래밍을 위하여 사용을 하게 되죠. "A라는 행위가 끝나면 B를 실행 해라." 이걸 프로그램으로 표현을 하면 아래와 같습니다. function A(callback){ if(typeof callback == 'function').. 더보기
[javascript]라이브러리 모음 javascript 라이브러리 모음autocomplete 모음http://autocompletejs.com/http://autocomplete-js.com/http://atmb4u.github.io/AutoJS/http://hakib.github.io/MassAutocomplete/highlight.js신텍스 하일라이터. 코드 3줄이면 페이지 내 코드를 자동으로 인식해서 하일라이팅 해주는 라이브러리. https://highlightjs.org/textures.jsSVG 패턴을 생성해주는 d3.js 확장 라이브러리. 데이터 시각화. http://riccardoscalco.github.io/textures/krakenjsexpress를 위한, 보안 및 확장 가능한 레이어. 페이팔 오픈소스. http://kr.. 더보기
[크로스브라우징]익스플로러와 비익스플로러에서의 Date Object 1. 문제점 익스플로러(이하 익스)와 비익스플로러(크롬,파이어폭스,사파리,오페라)(이하 크롬)에서 Date Object가 서로 다르게 작동하고 있습니다. 익스 new Date('2016-05-25');​​ => 정상동작 new Date('2016-05-25 09:35:00');​​​ => NaN 크롬 new Date('2016-05-25');​​​ => 정상동작 new Date('2016-05-25 09:35:00');​​​​ => 정상동작 2. 해결 ​1. 받은 날짜, 시간 값을 Parsing 해서... 익스에서 NaN으로 출력 되는 현상을 수정 하려면. new Date(year, month, day, hours, minutes, seconds, milliseconds);​ new Date(2016, .. 더보기
[CSS] font-size의 새로운 단위 [em] CSS의 em 단위 CSS에서는 글자 폰트 크기나 width, height 등의 크기를 지정할 때 다양한 단위를 사용할 수 있습니다. (pt, px, em, ex, %) 대부분의 브라우저는 단위를 사용하지 않으면 자동으로 px단위(모니터의 픽셀)로 인식하여 렌더링을 하게 되지만, 현재 표준은 단위를 항상 명시해주는 것입니다. (0 제외) Em Calcurator. 사용 방법은 간단해요. 몇단계 하위 노드로 들어가든 기존의 px 단위를 완벽하게 em 단위로 계산해줍니다. 하던 작업(세션) 저장도 됩니다. -ㅂ- 예전에 픽셀 기준으로 작업 하던 것을 잘 활용하면 완벽하게 em단위로 제작해서 한층 높은 접근성을 확보할 수 있습니다. (물론 em단위로 완벽하게 활용하기 위해서는 디자인의 유연성도 필요하기 때문에.. 더보기
[HTML] HTML 어떻게 읽는것이 좋을까? HTML 어떻게 읽는것이 좋을까? 미투데이에서 label을 어떻게 읽어야 하는지 고민하는 글을 접했는데 결국 HTML 요소를 우리말로 어떻게 읽어야 하는지에 대한 고민을 시작하게 되었습니다. 여러분은 요소를 어떻게 읽고 계신지요? ‘디브, 디-아이-브이, 디비젼, 딥’ 다양한 표현들이 존재합니다. 물론 어떻게 읽더라도 의미가 다 통하기 때문에 중요한 문제는 아니라고 생각하는 분들도 계십니다. 하지만 저는 가장 좋은 표현을 찾아보기로 했습니다. 요소를 ‘디브, 딥, 디-아이-브이’ 라고 읽는 경우 업계 전문가들은 이것이 무엇을 말하는지 쉽게 알기 때문에 아무 문제가 없습니다. 그러나 이 표현을 듣는 비 전문가들은 요소에 대하여 발음만 피상적으로 기억하게 될 뿐입니다. 저는 HTML이 전문적인 용어로 취급되.. 더보기
Xml Web Service 를 사용하기 위한 IIS 및 ASP.NET 2.0 설정 오류 : IIS 메타베이스에 액세스하지 못했습니다. 설명: 현재 웹 요청을 실행하는 동안 처리되지 않은 예외가 발생했습니다. 스택 추적을 검토하여 발생한 오류 및 코드에서 오류가 발생한 위치에 대한 자세한 정보를 확인하십시오. 예외 정보: System.Web.Hosting.HostingEnvironmentException: IIS 메타베이스에 액세스하지 못했습니다. ASP.NET을 실행하는 데 사용되는 프로세스 계정에는 IIS 메타베이스(예: IIS://servername/W3SVC)에 대한 읽기 권한이 있어야 합니다. 메타베이스 권한을 수정하는 데 대한 자세한 내용은 http://support.microsoft.com/?kbid=267904를 참조하십시오. 소스 오류: 현재 웹 요청을 실행하는 동안 처.. 더보기
라이브러리 관리 NuGet * http://docs.nuget.org/docs/creating-packages/hosting-your-own-nuget-feeds- 설치방법 * http://funnygangstar.tistory.com/104 http://docs.nuget.org/docs/creating-packages/creating-and-publishing-a-package- 패키지 파일생성 및 업로드 * http://docs.nuget.org/docs/reference/nuget-config-file - 설정 * 특정버전 설치 Install-Package Common.Logging -Version 1.2.0 * 의존성 관리 ?xml version="1.0"?> $id$ $version$ $title$ $author$ $a.. 더보기