이 글을 지난 9월 18일부터 10월 6일까지 진행된 미니 프로젝트의 과정을 아카이빙하기 위해 작성되었습니다.이번 프로젝트의 목표는 제시된 여러 사이트 가운데 하나를 선택해 클론 코딩을 하는 것이었습니다.단순하게 웹 사이트를 구현하는 것이 아니라, PET(Product
이 글을 지난 9월 11일부터 15일까지 진행된 미니 프로젝트의 과정을 아카이빙하기 위해 작성되었습니다.SNS 쓰레드 서비스와 유사한 UI의 Wereads라는 가상의 서비스를 개발하는 것이 1차 프로젝트의 목표였습니다.필수 구현 사항은 회원 가입과 로그인으로 이어지는
국문학과를 전공했습니다. 단지 신화가 흥미롭다는 이유만으로 진학을 선택한 치기 어린 결정이었습니다. 그렇게 학부와 대학원까지 잇따라 읽고 배운 신화는 퍽 흥미로운 학문이었습니다. 신들의 이야기라고는 하지만, 인간 중심에서 사고하고, 인간을 닮은 신들의 행태를 그리고 있
반복적인 UI를 하드코딩하지 않고 데이터를 만들어놓고 Array.map() 메서드를 이용하여 UI를 표현백엔드 API가 완전하지 않아도 프론트엔드 개발은 가능그것을 가능케 하는 것인 Mock Data, 즉 모조 데이터이 데이터는 실제 서버에서 주는 데이터의 형식과 동일
Clean Up Effect: setInterval과 그것을 초기화하는 ClearInterval까지 이해한 상태 (20230909)예를 들어, 단순하게 input 받아 output 내는 함수는 Side Effect가 없는 순수 함수라고 함그러나 외부의 값을 읽어오거나
JavaScript에서 객체와 배열은 사용 빈도가 높은 자료 구조객체와 배열에 저장된 데이터를 전체가 아닌 부분만 추출하여 사용하고자 할 때의 번거로움을 줄이고자 구조 분해 할당을 사용구조 분해 할당은 객체와 배열을 '변수'로 분해할 수 있음
상태(state)와 라이프 사이클(lifecycle) 관리 기능을 함수 컴포넌트에서도 사용할 수 있도록 해주는 함수사용 규칙 \- 함수 컴포넌트 내부에서 호출 \- 커스텀 훅 내부에서 호출 \- 최상위에서 호출종류: useState, useEffect, useC
Syntactically Awesome Style SheetsLess, Stylus와 같은 CSS 전처리기(CSS Preprocessor)의 일종네스팅, 변수 사용, 조건문 등 다양한 기능 내장Sass 3.0을 Scss라고 부름
해당 자료는 2021년 콘텐츠웨이브 사내 스터디 그룹에서 진행했던 웹 퍼블리싱 스터디 자료입니다. 모든 저작권은 스터디 그룹장이자 발표자인 저에게 있습니다.user agent stylesheet를 초기화하기 위해 reset, base, initialize 등으로 명명된
해당 자료는 2021년 콘텐츠웨이브 사내 스터디 그룹에서 진행했던 웹 퍼블리싱 스터디 자료입니다. 모든 저작권은 스터디 그룹장이자 발표자인 저에게 있습니다.flex: 1은 실무에서 빈번하게 사용합니다.적응형 웹과 반응형 웹의 차이는 뚜렷합니다.반응형 웹의 3요소는 뷰포
해당 자료는 2021년 콘텐츠웨이브 사내 스터디 그룹에서 진행했던 웹 퍼블리싱 스터디 자료입니다. 모든 저작권은 스터디 그룹장이자 발표자인 저에게 있습니다.flex는 부모 요소인 flex container에게 주는 속성과 자식 요소인 flex item에게 주는 속성을
해당 자료는 2021년 콘텐츠웨이브 사내 스터디 그룹에서 진행했던 웹 퍼블리싱 스터디 자료입니다. 모든 저작권은 스터디 그룹장이자 발표자인 저에게 있습니다.
해당 자료는 2021년 콘텐츠웨이브 사내 스터디 그룹에서 진행했던 웹 퍼블리싱 스터디 자료입니다. 모든 저작권은 스터디 그룹장이자 발표자인 저에게 있습니다.요소 중앙 정렬의 두 번째 방법은 position과 transform을 이용하는 것입니다. 첫 번째 방법(posi
해당 자료는 2021년 콘텐츠웨이브 사내 스터디 그룹에서 진행했던 웹 퍼블리싱 스터디 자료입니다. 모든 저작권은 스터디 그룹장이자 발표자인 저에게 있습니다.HTML 태그도 CSS 선택자와 속성, 값도 웹 표준이 되기 위한 과정이 존재합니다.벤더 프리픽스(vendor p
해당 자료는 2021년 콘텐츠웨이브 사내 스터디 그룹에서 진행했던 웹 퍼블리싱 스터디 자료입니다. 모든 저작권은 스터디 그룹장이자 발표자인 저에게 있습니다.
해당 자료는 2021년 콘텐츠웨이브 사내 스터디 그룹에서 진행했던 웹 퍼블리싱 스터디 자료입니다. 모든 저작권은 스터디 그룹장이자 발표자인 저에게 있습니다.CSS 속성 중에서 margin, padding, border-radius 등은 value를 축약(shorthan
해당 자료는 2021년 콘텐츠웨이브 사내 스터디 그룹에서 진행했던 웹 퍼블리싱 스터디 자료입니다. 모든 저작권은 스터디 그룹장이자 발표자인 저에게 있습니다.웹 폰트 사용 시에 폴백 폰트를 함께 선언해야 합니다. 폴백 폰트는 주로 OS에서 설치된 시스템 폰트를 선언하는
해당 자료는 2021년 콘텐츠웨이브 사내 스터디 그룹에서 진행했던 웹 퍼블리싱 스터디 자료입니다. 모든 저작권은 스터디 그룹장이자 발표자인 저에게 있습니다.CSS 상속(inherit)은 부모 요소에서 자식 요소로 속성값이 전달됨을 의미합니다.폰트 관련된 속성값(font