Tailwind CSS home page
Go back

새로운 Tailwind CSS + Framer Motion 템플릿과 Tailwind Jobs

Date

오늘은 여러분에게 출시한 멋진 것들과 곧 출시될 작업 중인 것들에 대한 업데이트를 전해드립니다!

6월에 Tailwind UI 사이트 템플릿과 올액세스를 출시한 이후로, 350개가 넘는 GitHub 이슈와 풀 리퀘스트를 처리하고, 출시한 모든 새로운 템플릿을 Next.js 12.2와 새로운 next/future/image 컴포넌트를 사용하도록 업데이트하는 등 유지 보수 작업에 집중해왔습니다.

그러나 그 와중에도 몇 가지 새로운 것을 출시할 시간을 찾았습니다!

Tailwind + Framer Motion = Pocket

약 일주일 전, 우리는 Next.js와 (당연히) Tailwind CSS로 만든 새로운 Tailwind UI 템플릿을 출시했습니다.

이 템플릿을 Pocket이라고 부르며, Framer Motion으로 구현된 다양한 애니메이션과 인터랙션이 가득한 모바일 앱 랜딩 페이지입니다. Framer Motion은 지금까지 만들어진 가장 멋진 라이브러리 중 하나라고 할 수 있습니다.

Pocket 템플릿 알아보기

라이브 프리뷰를 꼭 확인해 보세요. 스크린샷으로는 표현할 수 없는 멋진 부분들이 많습니다. 페이지 로드 시 그래프가 그려지는 효과, 기능 섹션의 애니메이션된 모바일 디바이스 UI, 그리고 Frogger에서 영감을 받은 고객 평가 애니메이션 등이 있습니다.

이 템플릿에 대한 재미있는 이야기가 있습니다. 처음 디자인하고 구축할 때는 애니메이션이나 인터랙션을 전혀 계획하지 않았습니다. Figma에서 정적인 디자인을 완성했고, 모두가 매우 만족스러워했죠. 그리고 약 3주 반 전에 출시할 계획으로 전체를 구축했습니다.

하지만 브라우저에서 완성된 템플릿을 보니 뭔가 딱딱하게 느껴졌습니다. Figma에서는 모든 것이 정적이고 움직이지 않을 것 같아 보였지만, 실제로 보니 스크린샷처럼 느껴졌습니다. 진짜 인터랙티브한 웹사이트 같지 않았죠.

이전 버전의 템플릿을 보면 제가 무슨 말을 하는지 이해할 수 있을 겁니다.

우리는 출시를 몇 주 연기하고, 템플릿에 생기를 불어넣을 수 있는 방법을 실험하기로 결정했습니다. 여러 아이디어를 시도한 끝에 현재의 결과물을 얻을 수 있었습니다.

이번 결과물에 대해 정말 만족스럽고, Framer Motion을 사용해 멋진 효과를 구현하는 방법을 배우고 싶다면 이 코드베이스가 흥미로운 사례 연구가 될 것 같습니다.

그리고 우리의 모든 템플릿과 마찬가지로, Tailwind UI 올액세스 라이선스를 가지고 있다면 추가 비용 없이 이 템플릿을 포함한 모든 컴포넌트와 템플릿을 사용할 수 있습니다.

Tailwind Jobs

우리는 약 2년 동안 Tailwind CSS 공식 채용 게시판을 만드는 아이디어를 고민해왔고, 지난 몇 주 동안 시도해보기로 결정했습니다.

여러분이 Tailwind를 사용하는 회사이고 프론트엔드 엔지니어를 찾고 있거나, Tailwind를 사용하는 회사에서 일하고 싶은 개발자라면 Tailwind Jobs를 확인해보세요.

Tailwind Jobs

우리는 7월 14일에 코드베이스를 시작했고, 8월 2일에 회사들에게 사이트를 공개했습니다. 이 사이트는 Laravel, Inertia, React, 그리고 물론 Tailwind CSS로 만들어졌습니다. 이런 도구들을 사용하면 단 20일 만에 얼마나 놀라운 것을 만들 수 있는지 보여주는 좋은 예입니다.

우리는 여전히 포지셔닝과 Tailwind를 사용하는 회사들이 프론트엔드 인재를 찾는 최고의 장소로 만들기 위해 무엇을 할 수 있는지 고민 중입니다. 만약 여러분이 회사에서 채용을 담당하고 있고 피드백이나 아이디어가 있다면, Peter에게 이메일을 보내주세요. 그는 이 프로젝트를 주도하고 있으며, 이에 대해 이야기할 사람을 찾고 있습니다.

예를 들어, 우리가 고민 중인 한 가지는 채용 공고가 반드시 “하루 종일 Tailwind CSS로 스타일링하는 것”일 필요가 없다는 점을 어떻게 명확히 전달할지입니다. 실제로 세상에는 그런 일자리가 많지 않습니다. 심지어 Tailwind CSS를 만드는 우리 회사에도 그런 일자리는 없습니다!

하지만 많은 사람들이 CSS와 씨름하는 것을 싫어합니다. 매일 CSS를 작성하지 않더라도 말이죠.

많은 개발자들이 스타일링을 해야 할 때 커스텀 CSS 스파게티 대신 Tailwind를 사용할 수 있다는 것을 알게 되면 매우 기뻐할 것입니다.

우리는 이 채용 게시판이 React 개발자, Vue 개발자, Laravel 개발자, Rails 개발자 등 누구든지 찾을 수 있는 장소가 되기를 원합니다. 스타일링을 할 때 Tailwind를 사용할 수 있다면, 그것은 Tailwind Jobs에 적합한 것입니다.

작업 중인 내용…

다음 몇 주 안에 출시될 멋진 것들이 준비 중입니다:

그러니 몇 주 후에 더 많은 소식이 담긴 업데이트를 기대해 주세요! 대형 템플릿/올액세스 출시를 마치고, 이제는 새로운 제품을 만드는 데서 벗어나 올해 남은 기간 동안 Tailwind CSS와 Headless UI를 더욱 개선하고, Tailwind UI에 멋진 기능들을 추가하는 데 집중할 예정입니다.