본문 바로가기
반응형

2017/0564

[Javascript] Jasmine을 이용한 테스트 코드 작성 Jasmine을 이용한 테스트 코드 작성 테스트 주도 개발(TDD)에서 테스트 코드는 가장 중요한 요소로 손꼽힌다.이러한 테스트코드 작성을 도와주기 위한 툴(라이브러리)은 여러개가 있는데그 중 자바스크립트 관련 도서에서 자주 언급되는 자스민(jasmine)을 사용하는 기본적인 방법에 대해 알아보자 1234567891011121314151617181920212223 test Colored by Color Scriptercs 우선 테스트 코드를 사용하기 위한 기본적인 HTML 코드이다.자스민은 다운받은 후 폴더에 추가하여 사용 할 수도 있지만 개인적으로 이렇게 예제 용으로 작성하는것은 CDN을 선호하므로 위와 같이 자스민 코드의 link를 걸어준다.그리고 하단에 테스트를 원하는 js파일과 이에 대한 테스트 .. 2017. 5. 8.
[CSS] 7:3 비율 텍스트 레이아웃 7:3 비율 텍스트 레이아웃 기본적으로 7:3 비율로 이루어진 기본적인 텍스트 레이아웃을만들어보자 12345678910111213141516171819 About me Lorem ipsum dolor sit amet, consectetur adipisicing elit. Illo officia quod, maxime modi eaque rerum atque blanditiis animi expedita velit quibusdam repudiandae architecto iusto natus soluta sequi ab similique, fugit ut minus. Optio saepe dolorum numquam repellendus commodi ducimus dicta deleniti. Ex do.. 2017. 5. 5.
[CSS] 백그라운드 이미지 위에 글씨 배치 - 응용 백그라운드 이미지 위에 글씨 배치 앞선 포스팅에서 백그라운드 이미지 위에 글씨를 배치해보았다.이번에는 좀 더 나아가서 어떻게 border를 넣고, 깔끔하게 보이게 하는지를 알아보겠다. 12345 .img .content{ font-family: 'Archivo Black', sans-serif;}Colored by Color Scriptercs 가장 먼저 기본이 되는 폰트를 수정해주도록 하자구글 폰트에서 마음에 드는 폰트를 골라 넣어주면 되는데,나는 위와 같은 폰트를 골랐다. 1234.img .content{ padding: 30px; border: 5px solid white; }cs 다음으로 외부에 있는 테두리를 넣어준다.padding이 없으면 테두리와 텍스트가 너무 달라 붙기 때문에적당한 간격으로 .. 2017. 5. 1.
[CSS] 백그라운드 이미지 위에 글씨 배치 백그라운드 이미지 위에 글씨 배치 요새 웹 디자인은 싱글 페이지에 길게 스크롤 되어 정돈된 이미지를 보여주는것이 많다.이 때 가장 첫번째 보여지는 이미지는 하얀색 글씨에 톤 다운된 이미지를 쓰곤 한다.이를 구현하기 위해 어떤 식으로 CSS를 넣는지 알아보자 디자인적인 부분은 제외하고 기본적인 부분만 구현하도록 하겠다.(물론 나는 전문적인 웹 디자이너나 퍼블리셔가 아니므로 꼼수나 잘못된 코드가 있을 수 있다.) 123456789101112131415 Hello! My name is nunu Colored by Color Scriptercs 우선 기본적인 HTML 코드이다.태그마다 기본적으로 설정되어 있는 스타일을 제거하기위해 reset.css를 적용해준다reset.css 코드는 구글에서 검색하면 제일 상단.. 2017. 5. 1.
반응형