스크롤이 가능한 리스팅 페이지 만들기 전체 페이지 데스크탑-모바일 반응형 페이지로 개발 프로필 페이지 (상세 페이지) 만들기 데이터 및 사진을 등록, 수정, 삭제가 가능하게 만들기 로딩 애니메이션 넣기 검색 기능 넣기 무한 스크롤 넣기 LocalStorage 사용하기 CSS : 상대수치(rem, em) 사용, 애니메이션 구현 DOM event 조작 유저플로우 제작하기 기술 스택 : HTML, CSS, JavaScript, Firebase, .env, Vercel, Git 그리고 결과물은 아래와 같다. 나는 디즈니 캐릭터 관리 페이지를 만들었다. https://disney-character-teal.vercel.app/ 디즈니 캐릭터 리스트 disney-character-teal.vercel.app 아쉬움..

이번에 HTML/CSS 와 약간의 JS 을 사용하여 사이트를 클론하여 패캠 부트캠프 과제를 제출하였다. 사실 처음 해보는거라 시작은 굉장히 조심스러웠지만 곧 그럴 시간이 없다는걸 깨닫고(-_-) 어떻게든 해나갔다. 먼저 내가 고른 사이트는 모나미 http://www.monami.com/index.php MONAMI 어쩌면 삶은 인생이라는 종이 위에 써 내려가는 펜의 기록 같습니다. 그중에서도 지우고 싶지 않은 기록이 있습니다. 모나미는 언제나 당신의 행복한 기록과 함께 합니다. www.monami.com 일단 깔끔해서 좋았고, 온라인 강의때 배운 내용을 활용할 수 있는 점도 맘에 들었다. 클론이라는 이름답게 정말 최대한 최대한 똑같이 만드려고 노력했다. 결과물 사이트 (Netlify를 통해 배포 URL ..

인라인 요소란? 글자를 만들기 위한 요소들 인라인 요소의 특징은 아래와 같다. 요소가 수평으로 쌓인다. 요소에 가로세로 너비를 지정할수 없다. 이것의 의미는 width나 height을 지정해줘도 소용이 없다는 뜻이다. 요소의 외부 여백인 margin이나 내부여백인 padding을 지정해도 위아래에는 정상적으로 적용되지 않는다. 인라인 요소에는 블럭 요소를 넣을수 없다. 대표적인 인라인 요소인으로 위의 특징들을 하나하나 살펴보자. inline 요소 위를 codepen에서 실행해보면 위와 같이 출력 되는 것을 볼수 있다. 이는 인라인 요소가 글자 요소로서 수평으로 요소가 쌓이기 때문에 옆으로 표시되는 것이다. 두번째 특징인 가로 세로 여백이 적용되지 않는 특징을 알아보자. 인라인 요소 마찬가지로 위 소스코드..
- Total
- Today
- Yesterday
- 싱글톤패턴
- 바닐라JS
- 의존성주입
- 국비지원교육
- KDT
- 인라인요소
- CSS
- 컴싸
- 사이트클론
- 팩토리패턴
- 부트캠프
- inline
- 내일배움카드
- PDU
- 디자인패턴
- 프론트엔드 부트캠프
- HTML
- 코드펜
- 옵저버패턴
- 프론트엔드
- 프로젝트시작하기
- PDU란
- 패스트캠퍼스
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |