# mixin

32개의 포스트
post-thumbnail

[SCSS] SCSS 문법5 - @mixin & @include

이번 포스트에서는 SCSS(SASS)의 또 다른 강력한 문법인 @Mixin과 @include(보통 둘이 합쳐 Mixins이라고 부르는 사람들도 있습니다.)에 대해서 알아보도록 하겠습니다.Mixins은 스타일시트에서 재사용이 가능한 스타일을 정의할 수 있도록 하는 문법이

2022년 5월 6일
·
0개의 댓글

vue3 composition api mixin

name duplication, implicit dependency

2022년 4월 18일
·
0개의 댓글
post-thumbnail

Pug, Template #02(Iteration, Mixin)

videoController.js이런식으로 나온다. 수정 가능 하다.videos안에 video가 있으니 video는 title이 있다.home.pug으로 가서 video.title이라 적는다.숫자일 필요도 없고 객체여도 된다. mixin이라는 걸 이용해 볼거다.mi

2022년 3월 22일
·
0개의 댓글
post-thumbnail

[모르고리즘 2] Mixin

기출 문제에 Mixin을 설명해라라는 것이 있는데,......?다중상속이라는 것은 알겠고, 대표적인 것이 DRF의 추상화인 것을 알고 있는데, 설명이 안 될 것 같아 찾아본 믹스인상속의 한 종류이지만, 사용에 있어 약간의 차이가 있다.상속은 핵심 기능

2022년 2월 17일
·
0개의 댓글

scss 반복문

scss로 깔끔한 코드를 만들어보자

2022년 2월 14일
·
0개의 댓글

리액트-SASS 사용방법

SASS는 CSS가 너무 길어졌을 때 변수, 함수, 반복문 등을 사용해서 보다 간결하게 코드를 작성할 수 있다. 변수사용, @import, nesting(셀렉터 안에 셀렉터 작성), extends문법, @mixin / @include문법 등이 있다.

2022년 1월 27일
·
0개의 댓글
post-thumbnail

[React] 다크모드(Dark Mode)

요즘 대부분 웹 페이지에 있는 다크모드를 적용해보고 싶었다작업한지 1달은 넘은것 같아서 잘 기억이 나지 않음styled component를 활용해서 global Theme를 설정Dark Mode의 커스텀 Hook을 만들어서 각각의 스크립트마다 적용styled compo

2022년 1월 26일
·
0개의 댓글

mixins 상속을 통한 APIView 로직 재사용

generics의 APIView들은 mixin의 로직을 재사용해서 정의되었다. 이와 같이 필요에 따라 다양한 믹스인을 조합해서 뷰를 구현할 수 있고 믹스인 또한 정의해서 사용이 가능하다.

2022년 1월 14일
·
0개의 댓글
post-thumbnail

Vue.js Vuex와 Mixin 마지막 정리

뷰엑스란? 내가 이해한 바로 의하면 컴포넌트간의 처리 저장 공간을 대체해주는 라이브러리이다.결국 vuex를 사용하면 기존 props와 emit을 더 편하게 이용할 수 있다는 장점이있습니다.라이브러리이기에 꼭 설치해야합니다. 설치 후엔 store라는 store.js 파일

2022년 1월 13일
·
0개의 댓글
post-thumbnail

SCSS 문법 더 알아보기

MIXIN를 이번에 배워보자. MIXIN는 함수와 모양과 기능이 비슷하다. 그리고 IF/ELSE 와 같은 조건문도 넣을 수 있다. 역시나 html 을 먼저 만들어주자. 홀수번째 google 은 파란색 짝수번째에 있는 google은 빨간색으로 설정해주려 한다.그리고 \_

2022년 1월 6일
·
0개의 댓글
post-thumbnail

node.JS PUG #3

PUG에서는 조건, 반복을 사용하여 HTML block을 제어할수 있다.가상의 유저를 생성했다.이 유저의 로그인 상태에 따라 페이지를 다르게 보여준다.보통의 경우라면 <script> 태그 안에 조건문을 사용하여 html을 제어했을 것이다.하지만 PUG에서는 아래와

2021년 12월 30일
·
0개의 댓글
post-thumbnail

[SCSS] mixin 그리고 function(함수)

SCSS, SASS와 같은 CSS 전처리기에서는 mixin과 function을 사용할 수 있다. 차이점과 사용법에 대해 알아보자.자바스크립트에서 함수를 사용하는 이유와 같다. 한 번 만들어두고 재사용 하기 위함이다.@mixin은 지정한 스타일을 반환하고, @functi

2021년 12월 26일
·
0개의 댓글
post-thumbnail

mixin

mixin에 대하여

2021년 12월 20일
·
0개의 댓글
post-thumbnail

React - SASS

SASS 🎨 > sass는 css 전 처리기 입니다. sass 문법이 css로 변환해주는 것! nesting, mixin, 변수 를 이용해 스타일시트의 유지보수와 가독성을 좋게 만들어 줍니다. 설치방법 --save 를 적는이유는 package.json 설치된 패키

2021년 12월 1일
·
0개의 댓글

SCSS 문법 정리

mixin소스코드의 중복을 막기 위해 사용 extend, %placeholder연관성 있는 반복의 경우 사용 속성 중첩같은 네임스페이스로 묶인 속성을 중첩하여 작성 @content선언된 mixin에 @content가 포함되어 있다면 해당 부분에 원하는 스타일블록 전달

2021년 11월 18일
·
0개의 댓글
post-thumbnail

mixin이 뭔가요?

Dart에서 사용되는 mixin에 대해 공부해봤습니다.

2021년 9월 25일
·
0개의 댓글

Nuxt에서 SASS/SCSS 사용 하기

Nuxt에서 SASS/SCSS 사용 하기 Sass는 신텍스 어섬 스타일 시트의 약자로 CSS작성시 여러가지 개발 편의성을 제공 한다.(변수 이용, 계산식 사용 가능 등) 만약 nuxt프로젝트에 이를 도입 하고 싶다면 어떻게 하면 되는지 알아보자.

2021년 9월 4일
·
0개의 댓글

Rails Mixin: ActiveRecord::Concern

어떤 모듈을 include 하거나 extend하는 것을 믹스인 이라고 했다. 믹스인은 다른 클래스에 추가하는 코드의 세트 이고, 모듈은 메서드와 상수의 모음이다.dry한 코드를 만들때 보통 공통 로직을 모듈로 빼고, 필요한 클래스에서 그 모듈을 포함시켜 사용한다. 모듈

2021년 7월 24일
·
0개의 댓글

Mixin iN RUBY

Mixin이란? 간단히 말하자면 특정 코드를 다른 클래스에 포함 시킬 수 있도록 하는 개념이다. 믹스인은 상속과는 달리 엄격한 단일 상속관계를 만들지 않고, 원하는 기능만 하위로 전달할 수 있다. (개념상)하위 클래스는 믹스인한 부모 모듈의 모든 기능을 사용할 수있지

2021년 6월 26일
·
0개의 댓글

styled component에 mixin 사용하기

Sass에서 가장 유용한 기능 중에 하나는 @mixin 과 @import을 통해 변수화된 스타일링 속성을 재사용임styled-component 공식 문서에는 의외로 이에 대한 구체적인 설명이 없었음themeProvider로 전역 변수로 사용되는 theme 내부에 자주

2021년 5월 6일
·
0개의 댓글