# bootstrap
UMC 1기 Server Session 8주차, 9주차 워크북
이번 주차는 웹 프론트엔드 심화입니다. Vue.js로 전에 진행했던 야놀자 백엔드 API를 연결해보았습니다.
TIL 011 | Bootstrap & Tailwind CSS
Today, I Learned.멋쟁이 사자처럼 프론트엔드 스쿨에서 배운 내용 정리. - Bootstrap. - Tailwind.
[Vue.js] Bootstrap 적용하기
Bootstrap-vue.orgVue.js 프로젝트를 진행하는데,예쁜 템플릿 테마들을 다운로드 받아서 사용하는 것도 좋은 방법이다.여기서 이쁜 테마들 받을 수도 있다. >> vuejs.org-테마하지만 테마 템플릿에서 사용하다 보면 사용하지 않는 부분들이 리소스를 낭비
과제 003 | 상용 웹 서비스(조코딩님 특강)
[멋쟁이 사자처럼 프론트엔드 스쿨]에서 배운 내용을 활용한 과제. - 쉽고 간단하게 상용 웹 서비스 제작
TIL | Nov,22
input checkbox 커스텀 스타일링이 까다로운 input요소를 txt-hide로 화면에서 감춰주고 label 요소를 연결하여 스타일링을 진행한다. checkbox는 가상요소로 처리해주었다. IR(Image Replacement) 테크닉 naver에서 사용
게시판 페이징하는 방법
페이지 번호를 넣어 각각의 페이지에서 일정한 수의 게시글을 가져온다. 현재 페이지의 페이지네이션 UI에서 disabled 클래스를 추가하여 비활성화 한다.
부트스트랩, 넌 뭘까?
원래 HTML, CSS를 배울 때 정말 그 과정이 순탄치가 않았다. 세로 정렬, 중앙정렬 그 어느 것 하나 쉬운 것이 없었지만, 이런 건 그래도 하다보니까 어느정도 익숙해져 갔다. 특히 Flexbox를 배우니까 좀 더 수월했다. 하지만 반응형까지 고려한 웹 페이지 디자
Bootstrap
❗ 스타일을 사용할 때 Bootstrap CSS 파일을 요구하는 경우 사이트에 있는 CSS 파일을 index.html 파일의 태그 안에 복붙❗ 컴포넌트를 상단에 import를 먼저 한다❗ src폴더 안에 있는 이미지들을 사용할 땐 언제나 ./ 이게 현
Rails에서 부트스트랩 사용 하기 1
이번 포스팅에서는 레일즈 프로젝트에서 부트스트랩을 사용하는 간단한 예제를 알아보자.Gemfile에 부트스트랩 잼을 추가 한다.파일을 저장 후 bundle install을 실행 한다.application.css 를 application.scss 로 리네임 해준다.아래 라
[bootstrap] CRA에서 bootstrap 추가하기
bootstrap을 React에 추가하는 방법bootstrap package를 설치한다.app.scss에서는 모든 scss들을 import하는 곳이다.리액트 최상위에서 모든 scss를 import하고 있는 app.scss를 import 한다.
[React] 평화로운 쇼핑몰 레이아웃 디자인 시간
이제 본격적으로 bootstrap을 활용해볼건데기존에 하던대로 코드를 그대로 가져오니 에러가 ..일명 component에 해당하는데 react-bootstrap 모듈에서 가져와야한다모두다 가져올수도 있지만 메모리 절약과 깔끔한 css 정리를 위해=> 그런데 이러면 cl
[TIL] 커밋메세지 변경, <b-col>, <b-form-checkbox>
참고 소스트리에서도 UI를 지원하지만, 그냥 터미널에서 아래 명령어 사용하여 변경 가능함참고위 코드처럼 <b-col cols="숫자">를 활용하면 조정 가능함
[React] 쇼핑몰 프로젝트 : 프로젝트 생성 & Bootstrap 설치
=> 어제 부트스트랩을 이용한 버튼을 만드려고 하는데 분명 부트스트랩이 이미 들어있다고 들었는데 => 평소처럼 부트스트랩 클래스를 넣는데 아무런 반응이 없다..=> 방금 알고 보니 리액트는 또 Bootstrap 활용 방법이 조금 달랐다. 해당 링크가 react boot
Tab 기능 구현하기!
부트스트랩에서 적당한 tab스타일을 가져온다.useState();를 이용해서 각 탭을 클릭시 각 탭의 고유 숫자를 가지게 해준다.하위 컴포넌트 TabContent에 if구문으로 각각의 경우 보여줄 html내용을 리턴해준다.