본문 바로가기

전체 글13

ES6의 Template Liteal 문법 맛보기 ES6의 Template Liteal 문법 맛보기 이렇게 Template Liteal 문법을 사용하면 더 간단하게 변수가 포함된 문자열을 생성할 수 있어요. Template Liteal 을 사용하는 이유는 특정 상태에 따라 다른 스타일을 적용하기 위해서입니다. style-components의 또 다른 장점입니다. 예를 들어 flag 라는 변수에 true가 들어 있으면 배경색이 흰색이고, false가 들어가 있으면 배경색이 파란색인 것과 같이 말입니다. * style-components는 styled.태그명을 통해 스타일링 된 컴포넌트를 생성합니다. 2021. 6. 17.
SASS 라이브러리 설치, SASS 공식사이트 SASS 공식사이트 공부는 언제나 공식사이트에서 하는 것이 제일 좋습니다. Sass: Documentation Sass is a stylesheet language that’s compiled to CSS. It allows you to use variables, nested rules, mixins, functions, and more, all with a fully CSS-compatible syntax. Sass helps keep large stylesheets well-organized and makes it easy to share design wi sass-lang.com SASS 라이브러리 설치방법 터미널에 yarn add node-sass 를 입력해주세요 폴더설정을 따로 해야한다면 cd .. 2021. 6. 17.
React 개발환경 세팅, SASS 라이브러리 설치 React 프로젝트 생성방법 VScode 터미널창에 입력해주세요. create-react-app [프로젝트명] 좌측을 보시면 생성된 파일 내에 세팅이 된 것이 보이시죠? 원래 HTML Elemet에 Clss명을 설정하기 위해서는 Class 속성을 사용해야합니다. React에서는 Class가 아닌 clssName 이라는 속성을 사용하여 클래스명을 지정합니다. class 속성을 사용하여 클래스명을 지정하면 프로젝트 실행시, console에 이와 관련된 오류가 출력되니 올바르게 지정해주세요. 2021. 6. 17.
Yarn 오류 발생시 해결방법 제가 Yarn 다운하면서 오류로 인해 여러번 여러가지 시도를 해보았는데 30분동안 부여잡고 하다가 성공해서 적어두려고 합니다! 레지스트리 타입에는 총 4가지가 있습니다. 모든 스크립트를 막는 타입은 바로 'Restricted' 입니다. 이 타입하나로 정말 애먹었답니다,, 저와 같은 이유로 애먹고 계시다면 바로 아래를 따라해주세요 ! 바로 이 부분인데 여러분이 따라해주실 부분을 차근차근 적어드릴게요 ! 1. Powersheell 을 입력해주세요. 윈도우 파워쉘을 열어도 되지만 저는 VS code 터미널에 입력했습니다. 2. ExecutionPolicy 를 입력해주세요. 아래에 나오는 Restricted는 현재 레지스트리 형식이에요 . 저와 같은 단어가 보이신다면 계속 이어서 따라해주세요. 3. Set-Ex.. 2021. 6. 17.