# Tailwind CSS

Tailwind CSS
Tailwind CSS는 flex, pt-4, text-center, rotate-90 등 과 같은 클래스로 구성된 Utility-First CSS 프레임워크로 마크업에서 직접 모든 디자인을 구축할 수 있도록 구성되어 있습니다.

Tailwind CSS - daisyUI
https://tailwindcss.com/docs https://daisyui.com/components

Tailwind CSS
Utility-First(미리 세팅된 유틸리티 클래스를 활용하여 HTML 코드 내에서 스타일링)를 지향하는 CSS 프레임워크이다.장점은 스타일 시트를 오가는 컨텍스트 스위칭도 없고, 클래스 이름을 시맨틱하게 정하기 위해 고민하는 시간도 없다. 유지보수 측면에서도 CSS

DJ-folio 시동 걸기
바야흐로 설연휴였다. 빡센 코딩은 하고 싶지 않았고 아무것도 하지 않고 보내기엔 귀한 시간이다. 뭘할지 고민하다가 최근 유행(?)처럼 번지는 포트폴리오 웹페이지 제작을 하기로 결심했다. 기존에 노션에 생성한 포트폴리오가 있음에도 자체 제작하려는 이유는?
[ Tailwind + Styled Component ] 0. 알아보기
Tailwind CSS는 HTML 태그에 유틸리티 클래스를 바로 작성하여 스타일링한다. 이 때문에 클래스명이 길어져 컴포넌트의 JSX코드가 지저분해진다.Styled-components를 사용하면 CSS-in-JS 문법 사용으로 컴포넌트를 깨끗하게 유지할 수 있다.Tai
[ Tailwind + Styled Component ] 1. 세팅하기 (CRA)
Tailwind CSS는 HTML 태그에 유틸리티 클래스를 바로 작성하여 스타일링한다. 이 때문에 클래스명이 길어져 컴포넌트의 JSX코드가 지저분해진다.Styled-components를 사용하면 CSS-in-JS 문법 사용으로 컴포넌트를 깨끗하게 유지할 수 있다.Tai

Next.js 프로젝트 만들기(with. Tailwind CSS)
🚪 들어가며 프로젝트를 시작하기 앞서 Next.js와 Tailwind CSS가 무엇인지 알고 시작하자! - Next.js는 React 프레임워크이다. - Tailwind CSS는 CSS 프레임워크이다.
[Tailwind CSS] twin.macro 설치 하기 with react / next
twin.macro npm 문서 twin.macro는 emotion 또는 styled-componet Lib에 대해 의존성을 가집니다. 그렇기 때문에 설치를 하기 위해선 다른 Lib를 설치할 필요가 있습니다. 또한, 약간의 babel 설정 추가가 필요합니다. 공식
[Tailwind CSS] TailwindCSS 기능 및 CSS in JS
TailwindCSS의 기능 공식문서 core-concepts 공식문서 Adding-Custom Styles 공식문서 flex 테일윈드에서 core-conepts로 소개하는것중 몇가지로, 반응형, 다크모드, Hover등의 state에 따른 style등을 사용하여 하
[Tailwind CSS] 소개 및 설치하기 with React
공식문서TailwindCSS는 CSS 프레임워크입니다.아래와 같은 사진을 보면, TailwindCSS는 다른 CSS 프레임 워크에 비해서 만족도와 사용량이 급속 성장하고 있다는것을 알 수 있습니다.이러한 결과를 바탕으로, 카카오등을 포함한 많은 기업들이 Tailwind
Notion Project_2
오늘 다크모드의 궁금증이 풀렸다 . 그 이유는 ThemeProvider 에 attribute를 빼먹었기 때문이다. 내가 분명 초기 세팅할때 > module.exports = { darkMode = "class", } 이렇게 설정해두고, 이렇게 작성하는게 맞는데 attribute="class" 이 부분을 다 빼먹고 있었다. 다크모드 자체는 동작했...
Tailwind CSS 사용해보기
요즘 핫한 CSS 프레임워크가 뭘까요? 라는 질문을 주시면 저는 당연히 Tailwind CSS라고 말씀드릴 것 같습니다.

8/1 32일차
처음 기획 단계에서 우리 팀은 css를 styled-component 를 사용하다가, 후에 tailwind 를 섞어서 쓰기로 했었다.배포 후 피드백 및 버그를 고친 후 전체적으로 tailwind css로 적용시키기로 했다.Tailwind 공식문서

CSS 프레임워크
CSS 전처리기는 우리(개발자)에겐 CSS보단 친화적이지만 브라우저가 해석하지 못하는 언어로 작성된 스크립트를 별도 플러그인과 프레임워크를 통해 우리가 아는 CSS로 변환하는데 사용한다. 기존 CSS의 단점인 유지보수의 불편함 등을 보완한다.Sass는 기본적으로 SAS
UI 구현을 쉽고 빠르게! Tailwind CSS
개발자들은 UI를 손쉽게 구현하기 위하여 CSS 프레임워크를 사용합니다. 그 중에 Tailwind CSS에 대해 이야기해보도록 하겠습니다!

[Tailwind CSS] vscode 플러그인
html 작성 시, 입력한 문자로 시작하는 클래스명들을 보여준다.vscode에서 tailwind 클래스명들을 속성별로 검색 확인할 수 있다.이와 비슷한 플러그인으로는 Tailwind Docs가 있는데, 이는 vscode에서의 바로 확인은 아니고, 검색한 클래스의 설명이