본문 바로가기

bootstrap4

Angular JS 사용해서 todo 만들기 (feat. Bootstrap) Angular 싱글톤 HTML Tag를 커스텀해서 사용 Controller로 View의 비즈니스 로직을 만듬 https://docs.angularjs.org/guide/concepts AngularJS Loading … There was an error loading this resource. Please try again later. docs.angularjs.org AngularJS 사용방법 html의 head에 angular CDN 추가 1 cs ng ~~ 를 붙여 angular function을 사용 ng-app : library를 사용하겠다 ng-init : 초기 세팅값 ng-controller : View 관리 Controller 선언 ng-repeat : for문 처럼 반복 출력 ng-cli.. 2019. 5. 14.
Bootstrap / Google Meterial Design Bootstrap웹사이트를 쉽게 만들 수 있게 도와주는 HTML, CSS, JS 프레임워크 * What ?반응형이며 모바일 우선인 웹 프로젝트 개발을 위한 무료 프레임워크입니다. 프론트엔드 진영에서 레이아웃과 다양한 인터페이스를 제공하여 웹사이트 제작의 간소화를 돕습니다. 2011년 GitHub에 오픈소스로 release 되었고, 2014년 6월에 GitHub에서 1등 프로젝트가 되었습니다.3 버전 부터는 모바일 중심의 프레임워크로 변경되었습니다. * Why ?팀내에서 개발시 다양한 라이브러리를 사용하므로써, 시간이 많이 걸리고 일관성이 떨어짐을 보완했습니다.부트스트랩을 통해서 일관성 및 시간절약이 가능해졌습니다. * How ?1. 부트스트랩을 직접 다운받는 방법. https://getbootstrap... 2019. 3. 4.
Vue bootstrap 속성 커스터마이징 가져온 bootstrap을 커스터 마이징 하겠습니다. 먼저 atom을 설치합니다. https://atom.io/ 그다음 커멘드창에 가져온 부츠스트랩 폴더를 엽니다. 이창에서 atom . 명령어를 날리면 Atom 창이 바로 뜹니다. src > router > index.js 페이지에 들어가면 각 path 별로 어떤 화면을 가져오는지 확인할 수 있습니다. ↓ main dashboard 저는 http://localhost:9527/#/documentation/index path에 있는 documentation 페이지를 바꿔보겠습니다. 방금 index.js 페이지에서 documentation url 을 찾습니다.그럼 /views/documentation/index component를 띄우는 것을 알 수 있습니다.. 2018. 11. 23.
Vue bootstrap 적용해보기 vue bootstrap 가져와서 적용해 보는것을 해보겠습니다. vue bootstrap 사이트를 찾습니다.https://cssauthor.com/vue-js-admin-templates/저는 이 사이트를 이용했습니다. 원하는 페이지 zip파일을 받습니다. 받은 zip파일 압축을 푼 뒤에 커멘드창에서 zip파일 푼 주소로 가봅니다. C:\Users\USER\eclipse-workspace\vue-element-admin-master> 저는 여기에 설치했습니다. 여기서 npm install npm run dev 명령어를 차례로 실행하면 화면에 뜬 http://localhost:9527 주소로 들어가 확인해볼수 있습니다. 이상으로 vue bootstrap적용 이었습니다. 2018. 11. 23.