두부두목

🖥️ 공식 홈페이지 https://apexcharts.com/ ApexCharts.js - Open Source JavaScript Charts for your website ApexCharts is a a free and open-source modern charting library that helps developers to create beautiful and interactive visualizations for web pages. apexcharts.com 설치 💿 Installing via npm npm install --save react-apexcharts apexcharts Usage ✍️ import ApexCharts from 'apexcharts' return ( ) 그냥 컴포넌트..

javascript 에서 배열에 length 속성을 사용하면 배열의 데이터 개수(배열의 길이)를 반환하여 이를 확인할 수 있다. 해당 메서드를 사용하다보면 위와 같은 에러가 발생하기도 한다. 위와 같은 오류가 나타나는 대부분의 이유는 요소 개수를 반환할 배열이 없거나 잘못된 것이다. 따라서 length 속성을 사용하기 전에 해당 배열이 존재하는지 먼저 확인하면 된다. console.log 를 자주 찍어봐야 하는 이유이다.

오늘의집 클론코딩 프로젝트 하면서 완전히 반응형은 아니더라도 약간의 타블렛, 모바일 환경은 고려하고 싶었다. 그와 관련해서 scss 에서 변수와 믹스인이라는 것을 알게 되었다. 🔡 변수(Variables) 앞부분에 $ 를 붙이면 변수를 선언하여 사용할 수 있다. $black: #000000; $font-default: 1.2rem; 아래와 같이 사용하면 된다. body { font-size: #{$font-default}; } 📼 믹스인(Mixins) 믹스인은 CSS 를 묶어서 재사용할 수 있는 모듈로 만들어 준다. @mixin card-view { font-size: 22px; border: 1px solid grey; border-radius: 4px; } 사용은 아래처럼. div { @include..

기본적으로 HTML 의 성질을 알아보자. ✅ HTML 의 특징 파악하기 블록 요소와 인라인 요소 웹 브라우저의 공간 유무와 상관없이 사용할 때마다 줄 바꿈되는 태그가 있다. 이러한 태그로 작성한 코드를 블록 요소(block element) 라고 한다. 이와 반대로 공간이 부족할 때만 줄 바꿈되는 태그가 있는데, 이런 태그로 작성한 코드를 인라인 요소(inline element) 라고 한다. 블록 요소 - div (공간 분할 태그) 코드를 작성하다 보면 구조를 더 깔끔하게 작성하여 쉽게 레이아웃을 구성하기 위해 관련 있는 요소를 그룹으로 묶어야 하는 경우가 많다. HTML 에서는 이런 그룹 짓기 작업을 div 태그와 span 태그로 수행한다. div 태그는 주로 블록 요소와 인라인 요소를 그룹으로 묶을 때..