본문 바로가기 메뉴 바로가기

메로그

프로필사진
  • 글쓰기
  • 관리
  • 태그
  • 방명록
  • RSS

메로그

검색하기 폼
  • 분류 전체보기 (212)
    • 일상 메모.. (0)
    • 업무 메모.. (44)
    • SEO (14)
    • TM (10)
    • 개발.. (142)
      • Node (17)
      • Git (14)
      • Javascript (19)
      • React (29)
      • Nextjs (22)
      • Vue (14)
      • Nuxtjs (7)
      • Svelte (3)
      • Angular (3)
      • Sass(Scss) (7)
      • Webpack (6)
  • 방명록

styled-components (1)
리액트에서 styled components 를 사용해서 컴포넌트 만들기

우선 styled componets 를 알기 전에 CSS in JS 가 뭔지 알고 지나가야 합니다. CSS in JS css 파일을 사용하지 않고 JavaScript 로 작성된 컴포넌트에 바로 삽입하는 스타일 기법입니다. 이렇게 쓰면 별도의 css 파일을 관리하지 않기 때문에 관리 포인트가 줄어들 수도 있고 컴포넌트 기반의 개발시 좀 더 유용한 패턴이 될 수도 있습니다. (하지만, 사용하는 사람마다 다름!) 그 중에 가장 유명한 라이브러리가 styled components 다~~~ 라고 알고 있으면 됩니다. 설치 및 사용법 아래 명령어를 이용해 설치해줍니다. npm 쓰시는 분들은 yarn add 빼고 npm install 넣으시면 됩니다! yarn add styled-components 사용법은 아래와 ..

개발../React 2024. 4. 9. 16:37
이전 1 다음
이전 다음
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
TAG
  • 깃허브
  • Github Actions
  • vscode
  • nuxt2
  • 타입스크립트
  • nextjs14
  • NextJS
  • Vite
  • Zustand
  • 스벨트
  • svelte
  • dockerfile
  • ChatGPT
  • 티스토리챌린지
  • openAI
  • github
  • vue router
  • vue composition api
  • Git
  • React
  • seo
  • nextjs15
  • nextjs13
  • 네이버 서치 어드바이저
  • AWS
  • nodejs
  • cors
  • 오블완
  • 서버 to 서버
  • NUXT
more
«   2025/06   »
일 월 화 수 목 금 토
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30
글 보관함

Blog is powered by Tistory / Designed by Tistory

티스토리툴바