지식을 남기고 쌓는 곳

GD프로젝트 리액트 기초 프론트엔드의 꽃, 리액트 2주 차가 시작되었다. 요번 2주차에 있었던 일을 바로 기술해보겠다. 목차 1. 새롭게 배운 내용(SCSS, Styled Component, 가상 DOM) 2. 결과물 1. 새롭게 배운 내용 1 - 1 SCSS 더보기 SCSS는 SASS의 세 번째 이름이다. 그럼 SASS는 무엇이냐면은 Sass : Syntactically Awesome Style Sheets : 문법적으로 편하게 css를 작성하는 언어 근데 이 SASS는 CSS와 호환이 잘 안되어서 생긴 것이 SCSS이다. SCSS의 장점은 CSS를 편하고 더욱 가독성 있게 작성하기 위한 것이다. SCSS를 사용했다 해서 CSS보다 더욱 아름답고 화려한 이펙트가 생기는 것이 아니다. 그럼 이제 SCSS..

요번 글에선 DOM요소를 DOM요소에 이어 붙이는 것을 설명하려 합니다. 일단 제가 옷을 살 때 자주 사용하는 웹페이지에 들어가봅시다. 무신사스토어 : https://store.musinsa.com/app/?gclid=Cj0KCQiA4NTxBRDxARIsAHyp6gDF6UTxQmna2A77XMA9JeSNZtczLL7Xaev-bSWiaxPChywmTTXoclAaApHOEALw_wcB 무신사 스토어 숏패딩,코트,스웻셔츠,스니커,반스,아디다스,커버낫,내셔널지오그래픽,인사일런스,라퍼지스토어 store.musinsa.com 여기서 스크롤을 밑으로 내려가보면 이렇게 스페셜 쇼케이스에 관한 문단이 나올 것입니다. 제가 요번 글에서 하고자 하는 건 DOM요소를 사용해서 이 스페셜 기간이 끝났다는걸 사진 속에 있는 "단..

CSS에는 선택자(id,class,tag) 개념이 있습니다. HTML 요소의 스타일을 선택하여 수정할 때 이 선택자를 이용해서 자신이 원하는 위치, 범위를 설정할 수 있습니다. 자바스크립트로 DOM(Document Object Model) 요소에 접근할 때도 주로 선택자를 사용합니다. DOM 요소를 id 선택자로 접근하는 함수 - getElementById() nice to meet you id 속성 값은 한 문서 안에서 유일하기 때문에 자주 사용한다. 우리가 css를 코딩할 때는 #hi 를 통해서 nice to meet you 텍스트를 수정했다. 자바스크립트에선 getElementById()을 통해 DOM 요소에 접근할 수 가 있다. document.getElementById("hi").onclick ..