라벨이 Angular2 공부인 게시물 표시

[Angular 2+ / 퍼블리싱] 일반적인 모바일 UI 를 코딩할때 유용한 링크 모음

*이 문서는 지속적으로 업데이트 될 예정입니다 *가로스크롤 UI 모바일에서 터치 + 스크롤 되는 기본적인 CSS 문법이 가장 잘 설명된 예 입니다. 자세한 설명은 여기서 보실 수 있습니다. See the Pen Flickity horizontal scrolling navigation by Steve ( @stevemckinney ) on CodePen . Angular2+ 에서 Bootstrap 과 함께 horizontal scroll 을 구현할 때 한가지 팁이라면 가로 width 를 고정값을 주면 화면 리사이징 할 때 Bootstrap Layout 이 깨집니다. height 만 주거나, 이게 불편하면 Slider 플러그인 같은 다른 대책을 구해보심이 좋을듯합니다. + Sly 라는 꽤 괜찮은 가로 스크롤 플러그인이 있는데 angular2 용으로는 아직 없어서 대단히 아쉽네요 http://darsa.in/sly/ * 이미지의 가로 세로 비율 유지하면서 잘라 보여주기 (CSS) 중앙 정렬 맞추면서 Responsive UI 에서 이미지 비율대로 Crop 해 보여주기 링크 소스 설명은  여기서  보실 수 있습니다. See the Pen 이미지의 가로세로비를 유지하면서 틀 안에 맞추기 by feeva ( @feeva ) on CodePen . * 함께 보면 좋은 문서 당신은 모를 수도 있는 CSS의 7가지 단위 vh, vw 같은 것들은 PC Web 에서는 아직 쓸 수 없겠지만 모바일만을 대상으로 한다면 꽤 매력적인 신기능입니다

[Angular2+] 유용한 Angular2+ 라이브러리 모음

이미지
* 이 문서는 지속적으로 업데이트 될 예정입니다 이번에 Angular2 로 프로젝트를 진행하면서 레퍼런스가 없어서 많은 어려움을 겪었습니다. 다행히 능력자님들이 이미 만들어 배포해두신 Angular2+ Component 들이 많아서 큰 도움을 받았습니다. 그 중 몇 개를 소개하려고 합니다. Angular 2+ Components & Libraries http://laptrinhx.com/topic/26993/angular-2-components-libraries#ui-components 유용한 Angular2 컴포넌트 라이브러리들을 링크로 정리한 문서 (아래에 소개할 링크도 일부 포함되어 있습니다) 필요한 부분을 찾을 때 참조하면 좋습니다. Swiper https://github.com/ksachdeva/angular2-swiper-example Swiper Demo 보러가기 >   http://idangero.us/swiper/demos/#.WZooPT5JYUE 웹/모바일 UI 에서 가장 흔히 쓰이는 swiper jQuery 용으로는 수도 없이 많지만 Angular2+ 용으로는 거의 유일무이하게 쓸만해 보이는 라이브러리입니다. 수많은 기능을 제공합니다. (Zoom, AutoScrolling 기타등등) Responsive UI, Bootstrap 에서도 무리 없이 잘 동작합니다. 약간의 버그가 있긴 하지만 고객이 문제삼지 않는다면 넘어가줄 수 있는 수준입니다. PrimeNG https://www.primefaces.org/primeng/#/ FileUpload, DataTable, Calendar, Chart 같은 온갖 기본 컴포넌트들이 무료 로 제공됩니다. 사용법도 간편합니다. 모듈만 임포트하면 끝~ 디자인도 꽤 괜찮구요. 직접 개발하려면 어마어마한 시간이 드는 것을 PrimeNG 모듈을 사용해서 시간을 상당히 단축시킬 수 있었습니다. 굳이 ...