# Sass

57개의 포스트

웹 지식 기초 내용 정리 #1

브라우저 작동원리, URI vs URL, HTTP, HTML, CSS, SASS&SCSS, JavaScript 기초

2020년 10월 10일
·
0개의 댓글

TIL 30 day React 개념 두번째

React를 잘 사용하기 위한 third-party library인 Routing과 sass를 배웠습니다.

2020년 10월 7일
·
0개의 댓글
post-thumbnail

TIL 60 | Styled Components

css-in-js는 2018년 이후 폭발적으로 성장하고 있다. 그 중 Styled-Components는 npm 다운로드 수 기준으로 현재 가장 인기있는 css-in-js 라이브러리이다.

2020년 10월 2일
·
0개의 댓글
post-thumbnail

CSS / SCSS / SASS

CSS / SCSS / SASS 에 대한 개념과 정의에 대해서 알아보자.

2020년 9월 27일
·
0개의 댓글
post-thumbnail

나의 첫 React 팀 프로젝트, Westagram

CRA를 사용하여 팀원이 함께 초기 셋팅을 진행공동으로 public 폴더와 scss를 사용하고 관리git을 사용한 첫 번째 협업 프로젝트

2020년 9월 11일
·
6개의 댓글
post-thumbnail

TIL DAY.20 React Router, Sass

SPA:페이지가 1개인 어플리케이션이란 뜻입니다. 전통적인 웹어플리케이션의 구조는, 여러 페이지로 구성이 되어서 유저가 새로운 페이지를 요청 할 때 마다 페이지가 새로고침되고 로딩할 때 마다 서버로부터 리소스를 전달받아 해석 후 렌더링을 하는 방식입니다.

2020년 9월 7일
·
0개의 댓글
post-thumbnail

리액트에서 css사용하기

.css파일 작은 프로젝트서 사용시간편 그러나 속성 클래스 이름 겹칠때 오류 발생중복 방지를 위해 컴포넌트명-클래스 방식 이름이나 css선택자 활용ex ) .App-header/ .App-link (컴포넌트-클래스명)filename.module.csssassnpm i

2020년 9월 5일
·
0개의 댓글
post-thumbnail

React스터디_컴포넌트 스타일링

일반적으로 우리가 흔히 알고 있는 css를 이용하여 스타일링하는 방법입니다.

2020년 9월 5일
·
0개의 댓글

SCSS (each)

list 반복 CSS 변환결과 Map 데이터 반복 CSS 변환결과

2020년 9월 5일
·
0개의 댓글

SCSS (for... through/ to)

through 숫자까지 반복to 숫자 바로 앞의 숫자까지 반복

2020년 9월 5일
·
0개의 댓글
post-thumbnail

SCSS (mixin, if, or, or not ...)

SCSS CSS 변환결과

2020년 9월 5일
·
0개의 댓글
post-thumbnail

TIL no.30

Airbnb 3일차

2020년 9월 2일
·
1개의 댓글
post-thumbnail

TIL 47 | React Router, Sass

라우팅(Routing)이란 다른 경로(주소)에 따라 다른 화면(View)을 보여주는 것이다. 리액트 자체에는 이러한 기능이 내장되어있지 않다. 따라서 리액트의 라우팅 기능을 위해 React-router라는 라이브러리를 사용한다. (Third-party Library)C

2020년 9월 1일
·
0개의 댓글
post-thumbnail

css & sass는 무엇이며, 차이점은 ?

프론트엔드라면 어느정도 css도 사용할 줄 알아야 한다고 생각한다. 일을 하면 어느정도 css를 만들거나 수정을 해야 할 일이 생기기 때문이다.^^.... css(Cascading Style Sheets) 는 무엇인가 ? html이 문서 파일이며, css는 style

2020년 8월 23일
·
0개의 댓글
post-thumbnail

[React] Style Component

1️⃣ Sass Install Use dynamic class name classnames library * How to use * ...Rest Props When you wanted to further hand off these items (i.e., thin

2020년 8월 21일
·
0개의 댓글
post-thumbnail

justify-content

flex 라는 display 속성: css 의 flex 는 엘리먼트들의 크기나 위치를 쉽게 잡아주는 도구이다.flex 를 사용하기 위해서는 컨테이너 태그에 display: flex 속성을 부여해야한다.(flex-direction: row; 을 사용하여 정렬방법을 세로로

2020년 8월 10일
·
0개의 댓글
post-thumbnail

Sass

문법적으로 매우 멋진 스타일시트CSS 전처리기로 복잡한 작업을 쉽게 할 수 있도록 해 주고, 스타일 코드의 재활용성을 높여 줄 뿐만 아니라 코드의 가독성을 높여서 유지 보수를 더욱 쉽게 해준다. Sass에서는 두 가지 확장자 .scss와 .sass를 지원한다. 이 두가

2020년 8월 10일
·
0개의 댓글

컴포넌트 스타일링

일반 CSS : component를 스타일하는 가장 기본적인 방식Sass : 자주 사용되는 css 전처리기 중 하나로 확장된 css 문법을 사용하여 css 코드를 더욱 쉽게 작성할 수 있게 해준다.CSS module : 스타일을 작성할 때 CSS클래스가 다른 CSS 클

2020년 8월 6일
·
0개의 댓글

[TIL] Sass, React-router

CSS Pre-processorCSS에 변수, Nesting, 연산자 등 CSS에서 기본적으로 제공되지 않는 문법들을 사용해서 CSS를 편리하게 작성하게 해줄 수 있게 해주는 툴작성 후 최종적으로 Sass 패키지에 의해서 CSS로 컴파일되어서 실행 됨반복되는 작성을 최

2020년 8월 5일
·
0개의 댓글

TIL. Sass, Router, Git 초기세팅 - 8/5

Sass는 css의 상위에 있는 메타언어로, 자바스크립트처럼 특정 속성의 값을 변수로 선언하여 필요한 곳에 선언된 변수를 적용할 수도 있고, 반복되는 코드를 한 번의 선언으로 여러 곳에서 재사용할 수 있도록 도와주는 일종의 CSS 전처리기(pre-processor)이다

2020년 8월 5일
·
0개의 댓글