카일_

css in js

Programming/Library

Emotion

Emotion이란? Emotion – Introduction (Edit code to see changes) emotion.sh Emotion.js는 CSS-in-JS의 종류 중 하나로 JavaScript 안에서 스타일을 작성할 수 있게 해준다. emotion.js는 주로 프레임워크와 관련없이 사용하는 Framework Agnostic과 React 두 가지 방식으로 사용된다. emotion 설치 # Framework Agnostic $ npm install @emotion/css # React $ npm install @emotion/react import 하기 emotion.js를 사용해야 할 컴포넌트에 먼저 import를 해야한다. /** @jsxImportSource @emotion/react */..

Project/SENTENCE U

Day 5 | React Query/CSS-in-JS

React Query커스텀hook 추가 유저 로그인 상태 쿼리 키 관리하는 커스텀 훅 import { useQuery } from '@tanstack/react-query'; import axios from 'axios'; const useLoginStatus = () => { const { data, isLoading, error } = useQuery(['loginStatus'], async () => { return await axios .get('/api/users') .then((res) => { if (res.data.isAuth === false) return false; if (res.data._id) return true; }) .catch((error) => { console.log(e..