테일윈드 CSS

온개발팀 지음

온노트 2024년 05월 30일 출간

작품소개

책소개

강력한 유틸리티 우선의 CSS 프레임워크를 마스터하기 위한 종합 가이드인 "Tailwind CSS"에 오신 것을 환영합니다. 이 책에서는 기본 개념부터 고급 기법까지, 최신 반응형 웹 디자인을 효율적으로 제작할 수 있는 Tailwind CSS에 대해 알아야 할 모든 것을 살펴봅니다.

1장, '테일윈드 CSS 소개'에서는 테일윈드 CSS가 무엇이고 웹 개발에 사용할 때 어떤 이점이 있는지 간략하게 설명합니다. 또한 Tailwind CSS를 설치하는 과정을 안내하여 기능을 더 자세히 살펴볼 수 있도록 준비합니다.

2장, '기본 개념'에서는 Tailwind CSS의 기본 개념을 다룹니다. 프레임워크에서 사용할 수 있는 반응형 디자인 원칙, 색상 및 타이포그래피 옵션과 함께 Tailwind CSS의 핵심 철학인 유틸리티 우선 접근 방식에 대해 살펴봅니다.

3장, '테일윈드 CSS 레이아웃'에서는 테일윈드 CSS로 레이아웃을 구축하는 방법을 살펴봅니다. 컨테이너, 상자 크기 조정, 디스플레이 속성, 플렉스 레이아웃과 같은 필수 레이아웃 유틸리티를 다루며 유연하고 반응이 빠른 웹 레이아웃을 쉽게 만들 수 있도록 지원합니다.

4장, '테일윈드 CSS로 스타일링하기'에서는 테일윈드 CSS의 스타일링 기능에 중점을 둡니다. 배경, 테두리, 효과, 필터, 전환 및 애니메이션을 위한 유틸리티를 살펴보고 웹 프로젝트에 시각적 향상을 효율적으로 추가할 수 있습니다.

5장, '고급 개념'에서는 Tailwind CSS 기술을 한 단계 업그레이드합니다. 프로젝트의 필요에 맞게 Tailwind CSS를 사용자 정의하고, 추가 유틸리티로 프레임워크를 확장하고, 사용하지 않는 CSS를 제거하여 성능을 최적화하고, @apply 지시문을 사용하여 컴포넌트를 만드는 방법에 대해 설명합니다.

6장, '테일윈드 CSS로 프로젝트 구축하기'에서는 실제 프로젝트에서 테일윈드 CSS를 적용하는 실무적인 접근 방식을 제공합니다. 프로젝트 계획, Tailwind CSS용 HTML 구조화, 프레임워크 구현, 프로젝트 완성 및 테스트 과정을 안내합니다.

이 책을 다 읽고 나면 Tailwind CSS와 그 기능을 완전히 이해하여 반응성이 뛰어나고 시각적으로 멋진 최신 웹 디자인을 효율적으로 제작할 수 있게 될 것입니다. 이 여정을 함께 시작하여 웹 개발 프로젝트에서 Tailwind CSS의 잠재력을 최대한 발휘해 보세요!

목차

1장 : Tailwind CSS 소개
___1. 테일윈드 CSS란?
___2. Tailwind CSS 사용의 장점
___3. 테일윈드 CSS 설치하기
2장 : 기본 개념
___1. 유틸리티 퍼스트 이해하기
___2. 테일윈드 CSS를 사용한 반응형 디자인
___3. 테일윈드 CSS 색상 살펴보기
___4. 타이포그래피와 테일윈드 CSS
3장 : 테일윈드 CSS 레이아웃
___1. 테일윈드 CSS로 레이아웃 구축하기
___2. 컨테이너 유틸리티
___3. 테일윈드에서 상자 크기 조정
___4. 디스플레이 속성
___5. 플렉스 레이아웃
4장 : 테일윈드 CSS로 스타일링하기
___1. 배경
___2. 테두리
___3. 효과
___4. 필터
___5. 전환 및 애니메이션
5장 : 고급 개념
___1. 테일윈드 CSS 사용자 정의
___2. 테일윈드 CSS 확장하기
___3. 사용하지 않는 CSS 제거하기
___4. @apply로 컴포넌트 만들기
6장 : Tailwind CSS로 프로젝트 빌드하기
___1. 프로젝트 계획하기
___2. Tailwind CSS용 HTML 구조화하기
___3. Tailwind CSS 구현하기
___4. 프로젝트 마무리 및 테스트

작가정보

저자(글) 온개발팀

세상에 필요한 솔루션을 개발하기 위해 다양한 프로그래밍을 활용하고 있습니다.