부트스트랩에서 제공하는 기능을 사용하다보면 커스터마이징 하고싶은일이 발생합니다. 저의경우 부트스트랩의 dropdown 플러그인을 사용하던도중 width를 커스터마이징 하고싶었습니다 https://getbootstrap.kr/docs/5.0/components/dropdowns/ 드롭다운 Bootstrap의 드롭다운 플러그인으로 링크 목록 등을 표시하기 위한 상황별 오버레이를 토글합니다. getbootstrap.kr 위 링크의 드롭다운을 사용하는데 좌우 길이가 너무 길어 공백이 생기는것이 마음에 안들었습니다. Filter Today Week Month 코드는 이런식이고, 해당 코드를 통해 bootstrap 플러그인중 하나인 dropdown-menu, dropdown-item을 통해 드롭다운 기능을 사용한것..
*이 포스트는 Vue.js 프로젝트 투입 일주일 전 (고승원 저) 을 보며 공부한 내용입니다. *개인 공부용 Post이기 때문에 내용이 생략되거나 두서가 없을 수 있습니다. Vue.js는 사용자 인터페이스 개발을 위한 Progressive Framework 입니다. Progressive라는것은 Web과 Native App의 장점을 모두 수용할 수 있다는 뜻이다. Web의 장점 - 별도의 설치 없이 브라우저만 있으면 접속이 가능합니다(뛰어난 접근성) Native App의 장점 - 웹보다 빠르며 더 뛰어난 사용자 경험을 제공합니다 Vue.js는 SPA(Single Page Application) 을 개발하기 위한 프론트엔드 프레임워크입니다. SPA란? 기존의 Spring Framework(Boot포함) 을 ..
앞서 YouTube 강의 vue.js 한시간만에 입문을 듣고 난 후, 해당 강의를 올려주신 분이 집필한 책인 vue.js 프로젝트 투입 일주일 전 이라는 책을 구매했다. 포스팅 하진 않았지만 이 분의 node.js 강의도 들었었는데 잘 가르쳐주시는 것을 보고 믿고 구매했다. 그리고 오늘 로켓배송으로 책이 도착했다! 책의 저자는 고승원 님이시고 지금은 품절이지만 다행스럽게도 품절 전에 구입할 수 있어서 좋았다! vue.js를 배워야겠다는 열정이 불타오를때 하루만에 책이 도착해서 열정이 식어버리기 전에 바로 공부할 수 있어서 좋다. 고마워요 쿠팡맨 ^^7
data를 활용해보자!! Home.vue는 원래 Welcome to Home! 이었다. 스크립트 default에 data() { return } ; 을 통하여 데이터를 활용 할 수 있다. mustache 문법과 비슷하게 {{변수이름}} 을 써주면 변수값으로 들어간다고 한다. 내용이 잘 바뀐걸 볼 수 있다. input값은 어떻게 받아올까? 원래 html태그의 value로 쓰던부분이 Vue.js 에서는 v-model 이라는 값으로 쓴다. input1 설정하고 결과를 보면 이런식으로 값이 들어간걸 볼 수 있다. 특이한 점은 1-way 방식이 아니라 2-way 방식이라는 것이다. 2-way는 뭐가 다른거? 기존에 알던 html은 값을 보여주고 끝이었다. 하지만 2-way를 함으로써 사용자가 input v-mod..
vue.js는 node.js가 설치된 이후여야함 해당 강의를 보고 공부중입니다.. https://www.youtube.com/watch?v=sqH0u8wN4Rs 나는 인텔리제이에서 할거기 때문에 플러그인을 설치해주었음 File>new>project 를 가면 JavaScript 항목에 Vue.js가 있는걸 확인 할 수 있다. project 이름과 경로만 원하는대로 바꿔주고 Finish를 눌러 생성하면 된다. Intelij에서 vue create와 Vue CLI를 자동으로 가져와서 프로젝트를 생성해줘서 편하다. npm run serve cd test 로 test폴더로 이동후에 npm run serve를 입력하면 development server 가 실행된다. 그럼 로컬서버와 네트워크 서버 주소가 생성되는데,..
- Total
- Today
- Yesterday
- chmod 400
- Vue.js 책
- JavaScript
- MySQL 문제
- 데이터 사이언스 프로그래밍 파이썬
- windows10 chmod 400
- 입문
- 윈도우 chmod
- Vue.js 프로젝트 투입 일주일 전
- 배열 특정객체 제거
- heap max
- javascript 객체배열
- vue.js 특징
- dict 연속성
- Java수료
- vue bootstrap scss
- 파이썬
- Vue.js 입문
- 부트스트랩 커스텀
- 코딩테스트
- 다리위를지나는트럭
- 코드잇 강의
- bootstrap5
- vue.js 개념
- 배열 특정요소 제거
- Python
- 프로그래머스 코딩테스트
- Vue.js
- Vue.js강의
- 프로그래머스
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |