Oxygen Cherry - Pencil
본문 바로가기

공부, 연구/개발

1021 부트스트랩 사용 공부

728x90

부트스트랩이라는 프론트 템플릿을 그냥 복사붙여넣기 해서 사용할줄 알게 되는 연습이다. 

 

왜 하냐면!! 만들고 싶은 것들 제약 없이 만들고 싶어서!! 

노코드도 다음에 배울까 싶다! 아니면 프론트!! 둘다 좋아! 

 

어렵다.....ㅋㅋ 

그래도 백엔드 개발보다는 낫다. 그냥 위치 찾아서 복붙하는 것 뿐이니까. 틀 잡혀가는 걸 확인할 수 있으니까 나름 재밌기도 하다.  

동작을 넣어주는 건 자바 스크립트의 영역인 거 같은데, 그것까지 할 수 있으려면 얼만큼 가야 할까? 

 

 

방법!! 

  1. vs 코드를 설치한다! 
  2. 다운받은 부트스트랩 파일과 새 파일을 동시에 연다 
  3. 찾고 싶은 소스를 컴포넌트랑 도큐멘테이션에서 찾아서 복사하고 적절한 위치에 넣는다. 
  4. 모르겠는 건 부트스트랩 사용 설명서를 찾아본다. 

여기서 컴포넌트랑 문서 어쩌고를 보고 잘 카피하면 되는 모양인데 

나머지는 뭔지 모르겠다. 내공 부족함 ㅠㅠ

 

부트스트랩 사용법 같은 거 더 열심히 찾아봐야지, 능수능란하게 사용하려면. 

 

 

https://getbootstrap.com/docs/5.0/layout/utilities/?#margin-and-padding 

 

Utilities for layout

For faster mobile-friendly and responsive development, Bootstrap includes dozens of utility classes for showing, hiding, aligning, and spacing content.

getbootstrap.com

내가 사용한 거 공식 설명서.
구글에 부트스트랩 5 검색해도 된다고 한다. 

부트스트랩 5란? 기술적으로 최신 버전임 윈도우 10 같은 느낌. 

 

 

 

https://preview.keenthemes.com/good/apps/file-manager/folders.html 

 

Good – Bootstrap 5 Admin Dashboard Template - Bootstrap Themes

Good– this Admin Template was designed by the best minds in the dashboard world to help others organize and fine-tune information panels, layouts, and UI elements. The GOOD template has a warm feel to it. Application of it makes the reskin of a current d

themes.getbootstrap.com

 

 

 

 


단어장 만들자~ 

 

오늘까지 한 부분. 

 

사이드바 깔끔하게 정리해야 하고, 

음 그리고 

페이지네이션 우측으로 치울 순 없을까? 

 

올 옆의 체크박스 누르면 전체 선택되게 하는 건 내 수준으로는 어려운가? 

체크박스 안누른 상태에선 너무 눈에 안띈다. 어떻게 디자인을 바꿀 수 있지? 

간격 조정은 어떻게 해야 돼???????? 

 

일단 저 위에 대시보드랑 사이드바 좀 정리를 해서, 

이 파일을 복붙하고 다른 페이지도 만들어볼 예정이다. 

 

다른 페이지 만드려면 매번 파일 만들어야 돼?? 연결 시키는 방법 없어? 

 

웹 세계는 넓고도 깊고 

나는 아직 발만 담군 뉴비구나~ 

 

728x90