외국 사이트에서 ECMAScript 6 의 전달인자와 매개변수에 관한 글을 봤는데, 알아두면 유용할 것 같아서 일부를 번역하였습니다. 이전 버전인 ECMAScript 5와의 비교를 통해서 어떻게 달라졌는지 아주 간결하고 알기쉽게 설명하고 있습니다. 이 글에서 설명하고 있는 구문은 크롬, 파이어폭스의 비교적 최신 버전이나 엣지 브라우저에서 동작하는 것을 확인할 수 있습니다. ECMAScript 6 에서 전달인자와 매개변수를 사용하는 방법 ECMAScript 6 (ECMAScript 2015) 는 ECMAScript 표준의 새로운 버전이며, 자바스크립트 파라미터 핸들링이 눈에 띄게 향상되었다. 이제 여러가지 새로운 특징 중에서 rest parameters, default values, destructurin..

다음 글은 Ben Cherry님이 쓴 자바스크립트 관련 게시글을 번역한 것입니다.확실히 동의를 구하기 위해 https://twitter.com/bcherry를 통해 메시지를 남겼지만 답장이 없네요..문제가 된다면 바로 삭제하도록 하겠습니다.Cherry! we think you are so generous 원문 글입니다.http://www.adequatelygood.com/JavaScript-Module-Pattern-In-Depth.html 자바스크립트를 코딩하면서 모듈패턴을 만드는 것은 흔한 일입니다.모듈 패턴을 만들면 이해하기 쉽고 많은 장점이 있습니다.저는 모듈 패턴에 대한 관심이 많이 있는데 제가 한번 다뤄보겠습니다. - The Basics (기초 지식)Eric Miraglia(of YUI)로 유..

그 동안 마이크로 서비스 아키텍처 관련 내용을 소개하고 관련 솔루션을 준비하면서 항상 아쉬운 부분이 있었습니다. 우선 기존에 다루었던 마이크로 서비스관련 목록을 다시 나열해 보겠습니다.모놀리틱 시스템에서 MSA 전환도메인 주도 설계마이크로 서비스의 장단점API 서버Event 기반의 Microservices 주로 마이크로 서비스 아키텍처 자체 및 비즈니스 로직이 구현에 대한 글들이 많습니다. 그러나 실제 적용하기 위해서 일반 개발자나 현업이 생각해 보는 부분은 UI 즉 frontend 구현에 대한 고민입니다. 일반적으로 마이크로 서비스 방식에서 각 채널 별 Frontend 관련 개발 패턴은 API기반인 JSON 형태 데이터를 AJAX 방식 호출을 통해 Single Page Application( SPA)을..

CSS를 작성하다 보면 이름짓기에 의외로 어려움을 겪는 경우가 많습니다.여러번의 프로젝트를 수행하다 보면 본인만의 스타일로 클래스명을 짓게되는데, 협업..특히 외주업체나 프리랜서 분들과 작업을 하다보면 자신만의 스타일을 고집하기도 애매한 경우가 허다합니다. 여기, 좋은 CSS Naming Convention을 소개합니다. BEM은 크게 Block로 영역짓고, Element로 지정하며, Modifier로 상태를 표시합니다. .block {}.block__element {}.block--modifier {} 즉, __를 쓰는 경우와 --를 쓰는 경우를 분리한 것인데,__는 명사와 같은 이름을 사용합니다. (__button, __title, __menu 등)--는 동사와 같은 상태를 이름으로 사용합니다. (-..

평안하신가요어느덧 세월은 흐르고 흘러 16년도도 8월입니다. 여기 적혀있는 글이 조금이나마 도움이 되었으면 좋겠습니다. css framework를 소개하고자 합니다.spectre 라고 하고, 일반적으로는 스펙터 라고 읽습니다. 불안, 유령이라는 사전적 의미를 가지고 있습니다. 스펙터의 장점과 단점을 추려본다면, (뒤이어 나올 스펙터의 테이블 class를 적용하여 장단점 테이블을 만들어 보았습니다.)

현재 IT업계에서는 기존 Monolithic 방식의 개발방식에 대한 많은 문제점을 인식하고 있는 상황입니다. 그에 따른 대안으로 Microservice Architecture나 Serverless Architecture등 다양한 방안 찾고 있지만 일반 기업에서 선뜻 아키텍처를 바꾸지는 못하는 상황입니다. 첫 번째 이유는 IT서비스 전문 기업 외에는 아직 일반기업에서 적용한 성공적인 사례가 찾아보기 힘든 점이 있고, 기업 내 자체 IT 인력이 이러한 MSA에 대한 이해도나 실제 구현 및 적용하기 까지 지식이나 경험이 부족한 상태입니다.두 번째로 이러한 부분을 해결하기 위한 솔루션 제품들이 아직 성숙되지 않은 문제도 있습니다. 하지만 불과 몇 년만 C/S 환경에서 웹 기반 아키텍처로 순식간에 변화했듯이 웹 ..

javascript 에서 ajax를 통한 비동기 식으로 개발을 하다 보면 callback 함수로 인해 다들 엄청난 스트레스를 받았을것으로 예상된다. 이 callback함수로 인해 코드의 복잡성이 증가하고 가독성은 말할것도 없다. 다음과 같은 시나리오를 보자 1. /test/returnValue.jsp?value=1 을 호출 2. 리턴 값이 1이면 /test/returnValue.jsp?value=2 호출 3. 리턴 값이 2이면 /test/returnValue.jsp?value=3 호출 4. 리턴 값이 3이면 정상 alert5. 각 상황시 조건이 맞지 않으면 실패를 alert 이와 같은 형태의 시나리오는 우리가 개발을 하다 보면 종종 맞닥뜨리는 상황이다. 다음의 상황을 jQuery의 ajax를 통해 일반적..

안녕하세요?DJ.VUD 입니다. 지난시간에 Raphael.js 에 대한 기본적이고 기초적인 내용에 대해서 알아보았습니다.(http://cyberx.tistory.com/85) 이번에는 TEXT 에 대하여 알아보겠습니다. TEXT 생성일단 TEXT는 크롬:개발자 도구로 살펴볼때 이러한 형태를 가지고 있습니다. 마치.. 에 을 넣어 style로 관리하는 모양새랑 비슷합니다. Raphael TEXT를 만드는 방법은 아주 간단합니다. var text = paper.text( x좌표, y좌표, '텍스트 입력'); TEXT도 다른 도형 또는 path와 마찬가지로 기본 색상은 검정색입니다.폰트명은... 크롬에서 기본만 딱 그려봤습니다. 폰트명은 Arial이고 폰트크기는 10px 입니다. (브라우저마다 폰트모양은 조금..

2015년 BCS(Chartered Institute for IT)는 간부급 IT전문가 350명을 대상으로 향후 12개월의 단기 계획과 3~5년간의 중장기 계획을 조사했는데 향후 12개월 동안 대다수의 기업에서 우선순위가 높은 3개로 정보보안(60%), 클라우드 컴퓨팅(55%), 모바일 컴퓨팅(53%)이 꼽았습니다.그러나 회사가 우선으로 하는 IT동향과 경영 문제를 해결할 만한 충분한 자원이 없다고 느낀다는 IT임원이 무려 92%나 됐었고, 조사에 응한 IT임원의 절반 이상인 53%는 기존 인력 가운데 고급 IT인력과 충분한 자격을 갖춘 IT인력들이 현재와 동일한 수만큼 더 필요하다고 답했습니다. 충분한 인력 자원을 보유하고 있다고 말한 응답자는 8%에 불과했습니다.위에서 볼 수 있는 대부분의 IT 관리..

RaphaelJS는?RaphaelJS는 IE8 이하의 브라우저에서 SVG를 사용하게 하기위한 오픈소스 라이브러리 입니다. 즉, 하위 브라우저에서는 VML로 변환시켜 줌으로써, 국내 브라우저 환경을 대응 할 수 있도록 하는 감사한 Cross-browser를 돕는 adapter 입니다. 현재는 http://dmitrybaranovskiy.github.io/raphael/ 라는 github 에서 관리, 배포되고 있습니다. 기본 사용법SVG가 사용될 영역 엘리먼트를 만듭니다.영역 엘리먼트와 넓이, 높이를 지정하여 라파엘을 초기화 합니다.그리고 그립니다. /* 영역 엘리먼트 작성 */ 결과> 크롬브라우저 결과> IE11에서 개발자도구로 IE8 버전 이렇게 안에 SVG 또는 VML이 자동생성 됩니다. 제공하는 기본..