어제까지 한일
- 역할 분담
1) 프론트엔드 ->2명(나 포함🤠)
2) 백엔드 - 시큐리티 및 틀 만들기(패키지 및 엔티티, 레파지토리, 엔티티 생성까지) -> 2명
3) 멜론 DB 크롤링(곡명, 가수명, 앨범 자켓) -> 1명
- ERD 및 API 명세서 수정
- 팀 레파지토리 만들기
오늘 한일
프로필 화면 만들기
사실상 처음부터 만들었다기보다는 구글링해서 찾은 코드들을 짜집기하여 만들었다.
프론트 할때 쓸만한 사이트 및 참고한 블로그들
1. 레이아웃을 코드로 만들어줌
https://www.layoutit.com/build
Bootstrap 4 Interface Builder | LayoutIt!
LayoutIt! is a interface builder for CSS Grid and Bootstrap that wants to be the kick-off for your front-end developments.
www.layoutit.com
2. html에서 css 및 js 분리하기
https://salix97.tistory.com/158
HTML 에서 CSS 와 JavaScript 분리하기
1. HTML 문서 내에서 2. HTML 문서 내에서 3. 하지만, (1) 코드가 길어지는 경우 (2) 동일한 스타일이나 자바스크립트를 다른 HTML 파일에도 적용하고 싶은 경우 이와 같은 경우에는 태그의 속성 (1) href :
salix97.tistory.com
- CSS는 Head 안에 아래 코드 추가
<link rel="stylesheet" type="text/css" href="css/header.css"/>
- JS는 Body 안쪽에 아래 코드 추가 (head 에 넣어도 되는데 오류가 발생할 수도 있다함)
<script src="myscript.js"></script>
3. 무료 아이콘 사이트(1)
https://www.flaticon.com/kr/authors/google
Google 아티스트가 디자인한 무료 아이콘
SVG, PSD, PNG, EPS 포맷 또는 웹폰트로 제공되는 멋진 이 아이콘을 다운로드받으세요. 최대의 무료 아이콘 데이터베이스 - Flaticon
www.flaticon.com
4. 무료 아이콘 사이트 (2)
Ionicons: The premium icon pack for Ionic Framework
Ionicons is an open-sourced and MIT licensed icon pack.
ionic.io
5. 반응형 사이드바 만들기
https://blogpack.tistory.com/1018
CSS로 반응형 사이드바 메뉴 만들기
자바스크립트 없이 반응형으로 메뉴 크기가 늘어났다 줄어드는 사이드바 메뉴를 만듭니다. 자바스크립트 도움 없이 메뉴를 펼쳤다 닫을 수 있으며, 반응형으로 웹 브라우저 너비에 따라 메뉴의
blogpack.tistory.com
- 이건 적용하려고 하다가 생각했던 방향으로 수정하는 게 어려워서 포기하고 고정된 크기의 사이드바로 변경.
'개발 일지 > [스파르타] 내일배움캠프 4기' 카테고리의 다른 글
| [WIL/내배캠] 15주차 - 2023.02.10(금) - 최프 1주차 (0) | 2023.02.14 |
|---|---|
| [TIL/내배캠] 73일차 - 2023.02.10(금) - 최프 5일차 (0) | 2023.02.14 |
| [TIL/내배캠] 71일차 - 2023.02.08(수) - 최프 3일차 (0) | 2023.02.08 |
| [TIL/내배캠] 70일차 - 2023.02.07 - 최프 2일차 (0) | 2023.02.08 |
| [TIL/내배캠] 69일차 - 2023.02.06(월) (0) | 2023.02.07 |