자바스크립트(javascript)나 제이쿼리(jquery)에서 url을 다루기 위해서 로케이션 오브젝트(Location Object)라는 것을 사용해야 합니다. c#의 'url object(uri)'처럼 사용할 수 있습니다. 1. 프로퍼티 읽어오기 현재 url의 로케이션 오브젝트는 'window.location'를 읽어서 사용할 수 있습니다. 1 2 3 4 //javascript var objLocation = window.location; //jquery var objLocationJQ = $(location); cs 로케이션 오브젝트에서 받아올 수 있는 정보는 다음과 같습니다. hash : 앵커 부분(# 뒷부분) host : 호스트 정보(호스트 주소만 나옴) hostname : 호스트의 이름 href..

css에는 마진 상쇄(margin collapsing) 혹은 마진 겹침(margin overlap)라는 현상이 있습니다. 탑과 바텀에 마진이 있는 경우 큰 쪽 한 개만 적용되는 현상을 말합니다. 아래위 마진이 겹쳐 있습니다. 1. 현상 확인 아래 코드를 실행해봅시다. See the Pen CSS3 Margin collapsing (margin overlap ) - Issue Check by DangGun (@danggun) on CodePen. 탑 마진(margin-top)을 20px주고 바텀마진을(margin-bottom) 20px를 줬습니다. 그런데 결과물은 20px 입니다, 이것을 마진 상쇄(margin collapsing), 마진 겹침(margin overlap) 현상이라고 합니다. 2. 현상의 ..

제가 노트북을 모니터에 연결해서 사용하는데... 윈도우10을 깔아보니 노트북 화면으로 가면 자동으로 비율 조정이 됩니다? 1. 증상 확인 양쪽에 창을 놓고 확인해 봅시다. 아래 스샷을 확인하면 왼쪽 창의 비율이 커진걸 알 수 있습니다. 2. 설정 방법 설정 > 디스플레이 > 텍스트, 앱 및 다른 항목의 크기를 변경합니다. 항목을 수정해 줍니다. 전 다시 100%로 바꾸겠습니다. 양쪽 비율이 같아졌습니다! 마무리 그런데 이 기능이 모니터의 물리적인 크기를 감지해서 적용되는 것인지 모델명가지고 감지하는 것인지 무조건 적용되는 것인지 모르겠네요. 거의 노트북 + 모니터 조합만 써서 말이죠 ㅎㅎㅎ

타입스크립트를 시작하기 위한 예제를 따라 해 보겠습니다. 참고 : typescript - Quick start 0. 준비하기 타입스크립트(typescript)가 설치돼 있지 않다면 설치해 줍니다. ( 참고 - typescript - Get TypeScript, [TypeScript] 타입스크립트(TypeScript)를 비주얼 스튜디오(Visual Studio) 2015에 설치하기 ) 타입스크립트를 설치하고 나면 프로젝트에 'TypeScript'라는 항목이 추가된 것을 볼 수 있습니다. 여기서 'TypeScript를 사용한 HTML 응용 프로그램'을 선택하고 프로젝트를 생성해 줍니다. 바로 실행해보면 실시간으로 시간이 갱신되는 타입스크립트 앱을 볼 수 있습니다. 1. 타입스크립트 파일 만들기 프로젝트에 '..

앵귤러JS(Agular, 이하 앵귤러)에서 앵귤러UI(AgularUI)에서 ng-grid라는 것을 지원해 줍니다. (참고 : AngularUI, Angular UI Grid ) 다양한 기능을 오픈소스로 만날 기회!! 지만 상용 그리드(grid)에 비해서 기능이 좀 모자라긴 합니다 ㅎㅎㅎㅎ ng-grid에서는 pdf나 cvs로 출력해주는 기능이 있습니다. 그런데 이 기능을 사용하면 이상한 점을 보게 됩니다..... 필터가 빠진 체로 출력됩니다. 1. 문제 발견 아래 예제는 그리드를 만들고 컬럼에 필터를 적용하였습니다. "눌러서 cvs 저장" 버튼을 눌러 다운로드 받아 봅시다. See the Pen AngularUI - Exporter cellFilter - Issue Check by DangGun (@da..

부트스트랩은 자체적으로 폰트를 사용합니다. 그런데 특정할 수 없는 상황에서 다음과 같은 에러가 발생합니다. 흠.... 파일경로로가보면 파일을 정상적으로 있는데 파일을 못 는 현상이 있습니다. 어디선가 많이 보던 에러인데..... stackoverflow - How to remove error about glyphicons-halflings-regular.woff2 not found 아..... 원인은 간단합니다. '.woff2'라는 확장자는 'MIME'기본 설정에 들어 있지 안씁니다 ㅋㅋㅋㅋㅋ 1. IIS의 경우IIS에서 MIME를 추가하면 됩니다. 사이트에 'MIME 형식'에 들어가서 '추가'를 눌러 아래와 같이 내용을 넣어주고 '확인'을 눌러 줍니다. 파일 이름 확장명 : .woff2 MIME 형식 ..

앵귤러js(AgularJS)에서 기본 제공되는 필터는 사용해 봤으니 직접 만들어서 사용해 봅시다. (참고 : 참고 : AngularJS Develop - 11 - Custom Filters ) 연관글 영역 1. 커스텀 필터(Custom Filter) 작성 앵귤러에서 필터를 추가하려면 '.filter'를 사용하면 됩니다. 아래 코드는 입력받은 값을 리턴해주는 필터입니다. app.filter('MyFilter', ['$filter', function ($filter) { return function (input1, scope, input2) { return "input1 : " + input1 + " input1" + input2; }; }]); 내용은 원하는 대로 작성하시면 됩니다. 2. 사용하기 이렇게 ..

이 필터도 앵귤러js(AgularJS)에서 기본 제공되는 필터입니다. 양이 많으니(= 기능이 많다. ) 차근차근 예제를 따라 해보도록 하겠습니다. (참고 : 참고 : AngularJS API Reference - orderBy ) 연관글 영역 1. 기본 사용법 'OrberBy'는 배열로 결과가 리턴됩니다. 그래서 'ng-repeat' 같은 것으로 사용 가능합니다. See the Pen AngularJS filter - orderBy 1 by DangGun (@danggun) on CodePen. 2. 정렬 변경하기 정렬옵션을 실시간으로 바꿔 봅시다. 이렇게 가지고 있는 데이터셋에서 필터의 옵션만 조정해 주면 앵귤러가 알아서 다시 정렬 해줍니다. See the Pen AngularJS filter - or..

앵귤러JS에서는 데이터를 출력할 때 필터를 적용해서 출력할 수 있습니다. AngularJS API Reference - filter 이 포스팅에서는 배열을 필터링하는 'filter' 통화 표시 필터인 'currency' 숫자 처리 필터인 'number' 날짜 처리 필터인 date 제이썬(Json)으로 표시해주는 'json' 소문자로 바꿔주는 'lowercase' 대문자로 바꿔주는 'uppercase' 글자 갯수를 잘라주는 'limitTo' 를 다룹니다. 연관글 영역 1. filter 참고 : AngularJS API Reference - filter 배열을 필터링해주는 필터입니다. 리턴이 배열로 오기 때문에 반복문(ng-repeat)으로 활용하거나 바인딩하는 것이 가능합니다. See the Pen QGK..

'Web API'의 인증을 세션으로 관리하는 것입니다. 'REST'와는 안 맞는 구조라고 생각돼서 쓸 일이 얼마나 있을지 모르겠네요. 0. 프로젝트 준비 템플릿은 빈 템플릿을 선택해 주시고 참조는 'Web API'만 추가해 줍니다. 'App_Start'의 'WebApiConfig.cs'를 열어 라우터를 아래와 같이 수정합니다. 1 2 3 4 5 config.Routes.MapHttpRoute( name: "DefaultApi", routeTemplate: "api/{controller}/{action}/{id}", defaults: new { id = RouteParameter.Optional } ); Colored by Color Scripter cs 'Web API'만 참조하는 경우 '{action}..