# emotion

58개의 포스트
post-thumbnail

Sass vs Less vs Emotion

회사에서 새 프로젝트가 진행되며 Sass vs Less vs Emotion 중 어떤 것을 쓸지 고민 했다.

어제
·
0개의 댓글
post-thumbnail

useContext + ContextAPI를 공부해보자..

리액트는 여러개의 컴포넌트로 이루어져있다. 최상위의 App컴포넌트에서 트리를 형성하는데, 리액트의 데이터 흐름은 위에서 아래로 즉, 부모컴포넌트에서 자식컴포넌트로 props를 통해 전달이 된다.Props를 사용 할 때는, 부모컴포넌트가 자식컴포넌트 태그에 일일히 pro

5일 전
·
0개의 댓글
post-thumbnail

🗣 <LUVOOK> 팀 프로젝트 회고

러북 팀 프로젝트에 대해 회고한 내용입니다. 오타나 오류가 있으면 댓글로 알려주세용!

2022년 6월 27일
·
2개의 댓글
post-thumbnail

[react] 회원가입 form 꾸미기 #1 - material Icon 을 Props 로 전달받기

본격 날것의 디자인에서 css 를 입히는 중이다. emotion 을 사용하고 material icon 을이용해 회원가입 폼을 꾸미려고 한다. material icon 또한 npm 을 이용해 설치를 해주었다. 아이콘은 컴포넌트 형태로 가져 올 수 있어 편했다. (따로 이

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

[react] 스플래시 화면 꾸미기 #1 - swiper 와 emotion 활용 with next.js

프롤로그 progresive웹 앱으로 기록 앱을 만들기로 한 [그리디브] 팀원들. 약 3주차에 걸쳐 나는 회원가입 폼을 완성해 내었다. 그리고 부여 받은 할일은 style 을 입히는 작업이다. 에이전시에서 퍼블리싱 작업을 하고 있는 나는 html, css, js, jq

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

📋 읽을 거리: react styling

리액트 스타일링

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

NextJS + Typescript Template

프로젝트 개발을 위해서 NextJS + Typescript + Emotion 기반 템플릿을 만들면서 이에 대한 설명을 다룬 내용들을 공유하기 위해 이 포스트를 올립니다.

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

FE.07 Day.07

state 리렌더 : state는 비동기적으로 작동하기 때문에 임시저장소에 모여있다가 한번에 렌더링이 일어난다. 새로운 props가 들어올때부모 컴포넌트가 렌더링 될 때.강제업데이트가 실행될 때.state가 변경될 때.위의 코드에서 버튼을 눌러도 setState의 비

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

Next.js Emotion css-prop 설정

Next js - Emotion css-prop 설정

2022년 5월 25일
·
0개의 댓글
post-thumbnail

RN 폰트 적용 오류

React-Native global default font-family 적용 방법

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

Week.01 JSX & emotion

React 라이브러리의 프레임워크이다. 어차피 무슨말인지도 잘 모르는 수준이므로 넘어가도록 하자.자바스크립트를 편하게 쓸 수있게 해준다던 react 를 사용한다면서 왜또 Nextjs가 추가 된걸까.. 라는 생각이들어 검색을 해봤다. 이해할 수 있는 수준으로 설명을 해보

2022년 5월 15일
·
0개의 댓글
post-thumbnail

FE.07 Day.01

코딩에 관심이 있는 사람이라면, 특히나 프론트엔드 쪽에 관심이 있다면 90% 이상의 사람들은 html, css, js(JavaScrip)을 떠올릴 것이다. 본인도 이 3가지 밖에 몰랐지만 첫 날부터 이 3가지언어를 좀더 편하게, 효율적으로 다루기 위해서 react라는

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

[Emotion] Theming

theme는 @emotion/react패키지에 포함되어 있습니다.ThemeProvider 앱의 최상위 수준에 추가하고 props.theme로 테마에 접근할 수 있는 기능을 제공합니다.

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

[Emotion] MediaQuery

Emotion에서 미디어 쿼리를 사용하는 것은 일반 css에서 사용하는 것과 같습니다.미디어 쿼리는 반응형 앱을 만드는 데 유용할 수 있지만 반복해서 작성해주면 각 스타일마다 다르게 적용될 수도 있고 비효율적입니다. 사용할 때마다 다시 작성하는 대신 상수로 옮겨 사용하

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

코드캠프 FE 1일차 - TIL(JSX,Emotion,Import/Export,React 기초)

React는 JSX 사용이 필수가 아니지만, 대부분의 사람은 JavaScript 코드 안에서 UI 관련 작업을 할 때 시각적으로 더 도움이 된다고 생각합니다. 또한 React가 더욱 도움이 되는 에러 및 경고 메시지를 표시할 수 있게 해줍니다.출처 https&#x3A;

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

emotion

작성중

2022년 4월 21일
·
0개의 댓글

Next/Image에 대해 얼만큼 알아?

글을 쓰게된 계기 최근 next.js를 공부하면서 직접 구현해보며 깊이 이해한 부분이 있어 글로 남겨보고자 합니다. 아무래도 이미지를 화면에 출력하게 되는데 next.js에서는 이미지를 최적화시켜 주어 따로 처리하지 않아도 되도록 해줍니다 (이런 편리한 기능이 많기 때

2022년 4월 16일
·
0개의 댓글

Emotion 으로 Dark Mode 설정하기

Emotion 으로 Dark Mode를 설정을 해보았다. TypeScript 에 아직 익숙치 않아서 Type 지정을 하는 데에 시간이 많이 소요된 것 같다, 문법 공부를 다시 해야할 것 같다. 우선은 이 part에서는 Dark Mode를 구현하는 것에 집중하기로 했다.

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

[Next + TypeScript] 넥스트 프로젝트에 Material UI + styled-components 적용하기 (emotion 씁시다)

나는 개인적으로 여러 UI 라이브러리 중에 Material UI (이하 MUI)를 선호하고 있다. 개인적으로 ant design 이나 부트스트랩보다 디자인이 깔끔하고 사용하기도 편한 것 같다그리고 MUI 와 함께 사용하는 것이 styled-components다.먼저 N

2022년 3월 29일
·
0개의 댓글

styled-components 를 emotion 으로 변환하기

지금까지는 CSS-in-JS 인, styled-components 를 사용해왔었다. 최근에 emotion 으로 사용하는 분들이 점점 늘어가는 추세인 것 같아서 나도 이번 기회에 emotion에 대하여 알아보려한다.styled-components와 매우 비슷하여 배움에

2022년 3월 28일
·
0개의 댓글