전체 글76 Tailwind CSS V4 animation Keyframes 정의하기 tailwindCSS V4에서는 tailwind.config.js 가 아니라 app.css 파일, @import tailwindcss 가 포함되어 있는 파일에서 animation keyframes 를 정의한다. - V3// tailwind.config.jsmodule.exports = { theme: { extend: { animation: { 'spin-slow': 'spin 3s linear infinite', } } }} - V4// app.css@import "tailwindcss";@theme { --animate-fade-in-scale: fade-in-scale 0.3s ease-out; @keyframes fade-in-scale { .. 2025. 3. 9. [2024.07 ~ 2025.02] 체카 회고 체카는 자동차 상품화 플랫폼 서비스를 제공하는 회사이다.상품화 서비스가 주력이고 중고차 도/소매, 소화기 판매 등 온갖 사업을 다 한다.엔카의 홈서비스를 신청하고 취소하면 상품화 비용이 청구되는데 그 비용을 들여 하는 작업이 여기에서 이루어진다 보면 될 것 같다.스토리체카 입사자동차 관련 도메인 개발에 참여해보고 싶었다. 자가정비를 하기도 하는 나는 자동차 관련 일을 할 것에 기대가 컸다.하드웨어에 종속적인(?) 일을 하는 이전 프린터 회사와는 다르게 상품화 과정을 이해하고 서비스화 하는 일에 참여하게 되어 좋았다.가장 초기 멤버로 입사해서 레거시들을 새롭게 만들기도 하며 한 달 정도 앞선 기획에 맞춰 개발을 시작했다.기존 서버는 그대로 둔 채로 새로운 프론트엔드만 접목해서 개발을 시작했다.딜러용 앱 개.. 2025. 2. 27. React: flushSync 활용 beforeprint, afterprint 이벤트 처리 회사에서 jquery 를 사용한 프로젝트를 React 로 포팅하는 도중 beforeprint, afterprint 이벤트를 처리하는 함수를 마주했습니다. window.print() 를 호출하기 전, 화면의 특정 요소를 숨기고(.hide())사용자가 print 화면을 닫게 되면 다시 화면의 특정 요소를 보여주는(.show()) 로직이었습니다. printing이라는 상태를 통해 요소를 숨기고 보여주는 코드를 아래와 같이 작성했습니다.import { useState, useEffect } from "react";const printingExample = () => { const [isPrinting, setIsPrinting] = useState(false); const handleBeforeprint =.. 2024. 8. 1. cannot use jsx unless the '--jsx' flag is provided 국문으로는 --jsx가 설정되지 않았습니다 오류다. VS Code 의 타입스크립트 버전과 PC에 global 설치 된 Typescript 버전이 달라서 발생하는 오류로VS Code의 [setting 메뉴]에서 [settings.json 으로 설정하기] 를 눌러 json 내 아래와 같은 값을 입력해 주면 된다. { "typescript.tsdk": "$GLOBAL_NPM_PATH/typescript/lib"} 2024. 7. 12. scroll-behavior 브라우저가 유저의 페이지 스크롤을 어떻게 동작시킬지 명시한다. value 타입- smooth : 부드러운 스크롤. - auto(or instant) : 부드러운 효과 없이 즉시 스크롤. default 값. https://developer.mozilla.org/ko/docs/Web/CSS/scroll-behavior 스크롤 동작 - CSS: Cascading Style Sheets | MDNscroll-behavior CSS 속성은 문서 탐색 또는 CSSOM 스크롤 API에 의하여 스크롤이 트리거될 때 스크롤을 포함하는 박스의 동작을 설정합니다.developer.mozilla.org 2024. 7. 8. 브라우저 기본 CSS 스타일 초기화 : Reset CSS https://meyerweb.com/eric/tools/css/reset/ CSS Tools: Reset CSSCSS Tools: Reset CSS The goal of a reset stylesheet is to reduce browser inconsistencies in things like default line heights, margins and font sizes of headings, and so on. The general reasoning behind this was discussed in a May 2007 post, if you're intermeyerweb.com 브라우저별로 기본 CSS 설정이 다른 부분을 해주는 소스 2024. 7. 7. 이전 1 2 3 4 5 ··· 13 다음
