부트스트랩
1.부트스트랩?
반응형이며 모바일 우선인 웹프로젝트 개발을 위한 가장 인기있는 HTML, CSS, JS 프레임워크
2.Bootstrap 5 시작하기
https://getbootstrap.kr/ 🌱 이 폴더 파일들을 앞으로 샘플 폴더로 복사해서 사용합니다.
3.유틸 - 타이포그래피(Typography)
베이직 폴더를 복사해서 BS5-Utility 폴더html 파일 만들기간단한 CSShttps://getbootstrap.kr/docs/5.1/content/typography/
4.유틸 - 색 color
테마 색
5.유틸 - 보더 border
https://getbootstrap.kr/docs/5.1/utilities/borders/
6.유틸 - 디스플레이 display
7.유틸 - flex
8.유틸 - 쉐도우
9.유틸 - 포지션
10.유틸 - 사이즈 (가로,세로)
11.유틸 - 스페이싱(마진&패딩)
12.레이아웃 - 컨테이너
13.레이아웃 - 컬럼
14.컴포넌트 - alerts
유저가 사용하는 시스템에 대한 조작장치, 독립된 기능의 모듈
15.컴포넌트 - 버튼
16.컴포넌트 - 어코디언
17.컴포넌트 - 캐로셀(이미지회전)
이미지 추가https://github.com/jbkim08/Bootstrap5css 없음
18.컴포넌트 - 카드 cards
19.컴포넌트 - 모달 창
20.컴포넌트 - 스피너
21.컴포넌트 - 네브바
22.컴포넌트 - 페이지네이션
23.컴포넌트 - 브레드크럼
24.컴포넌트 - 프로그래스바
25.포트폴리오 - 시작
26.포트폴리오 - 네브바
27.포트폴리오 - 홈 섹션
28.포트폴리오 - 어바웃 섹션
29.포트폴리오 - 포트폴리오 섹션
30.포트폴리오 - 블로그 섹션
31.포트폴리오 - 컨택트 섹션
32.포트폴리오 - 푸터 및 마무리
navbar 에 fixed-top 을 추가해서 항상 상단에 메뉴 위치active 클래스를 메뉴에 추가하면 = ? 스크롤스파이를 사용해 페이지 스크롤시 현재 섹션에 맞게 메뉴에 표시됨!
33.내 포폴 - 1
https://github.com/jbkim08/Portfolio-Website
34.내 포폴 - 2
35.내 포폴 - 3
36.내 포폴 - 4
37.내 포폴 - 6
38.내 포폴 - 7
39.내 포폴 - 8
40.내 포폴 - 9 (서버없이 이메일 보내기)
https://github.com/dwyl/learn-to-send-email-via-google-script-html-no-server부트스트랩 js 아래에 커스텀 js를 추가
41.내 포폴 - 10
https://www.netlify.com/ 배포하기
42.오로라 투어 - 시작 && 네브바
타이틀 및 페비콘 네브바
43.캐로셀
캐로셀과 이미지 높이, 필터 특수효과 가로 세로 버튼 캐로셀이너 아래에 인디케이터 캐로셀이너 위에 캐로셀 캡션 이미지밑에 (캐로셀아이템안) 두번째 세번째 이미지 캡션 넣기
44.모달창
https://getbootstrap.kr/docs/5.3/forms/overview/
45.오버뷰 섹션
부트스트랩 아이콘 CDN 추가하기 화면높이와 배경색 container 와 row col을 넣어서 수정하기 화면 lg 사이즈 이상에서 3열 이하에서 1열 아이콘 크기 살짝 크고 색상 정하기
46.패키지섹션 - 카드
https://velog.io/@drv98/%ED%8F%AC%ED%8A%B8%ED%8F%B4%EB%A6%AC%EC%98%A4-%EB%B8%94%EB%A1%9C%EA%B7%B8-%EC%84%B9%EC%85%98
47.FAQ섹션
48.푸터 섹션 && 마무리
