테일윈드 설치가 안 되는 줄 알았는데?...

돼요...그거 아세요?테일윈드는 업데이트가 됐답니다... (나도 모르는 사이에)나 빼고 다 알고 있던 거면 머쓱상태로 일단 넘어가고나처럼 모르고 있었던 사람을 위한,,, 정보글이랄까요? 사실 테일윈드 업데이트 됐다고 주워듣고서 까먹고 또 원래대로 설치하고 있었음 ㅜ 하여튼난 평소처럼 설치했을 뿐인데? 왜 설치가 안댐?... 설치 방법이 바뀌었어요,,,npm install tailwindcss @tailwindcss/vite이렇게 설치하시고 import { defineConfig } from 'vite'import tailwindcss from '@tailwindcss/vite'export default defineConfig({ plugins: [ tailwindcss(), ],})vite.co..

  • format_list_bulleted TIL
  • · 2025. 1. 27.
  • textsms
리액트 설치가 안 돼요 or 안 열려요 해결 방법

리액트 설치가 안 돼요 or 안 열려요 해결 방법

$ npm create vite@latest my-project> npx> create-vite my-projectnpm error code ENOENTnpm error syscall spawn C:\Program Files\nodejs\node.exenpm error path C:\Users\hyol1\Desktop\testtestnpm error errno -4058npm error enoent spawn C:\Program Files\nodejs\node.exe ENOENTnpm error enoent This is related to npm not being able to find a file.npm error enoentnpm error A complete log of this run can b..

  • format_list_bulleted TIL
  • · 2025. 1. 24.
  • textsms

24. 08. 29 TIL

TypeScript 소개 - 정의: JavaScript의 상위집합 언어로, 정적 타입 시스템 추가 - 장점:    - 컴파일 시 타입 오류 발견 가능   - 대규모 프로젝트에 적합   - 향상된 개발 경험 (코드 완성, 타입 검사 등) TypeScript 동작 원리 - 컴파일 과정: TS 코드 분석 → JS 코드로 변환 → 타입 검사 - 주요 단계: 파일 로드, 코드 분석, 심볼 테이블 생성, JS 변환, 타입 검사 ## 요약 - TypeScript는 JavaScript에 타입 시스템을 추가한 언어 - 컴파일 시 타입 체크를 통해 안정성 향상 - React와 함께 사용 시, 컴포넌트 props에 타입 지정 가능 - Vite를 이용해 쉽게 React + TypeScript 프로젝트 설정 가능 타입 정의= ..

  • format_list_bulleted TIL
  • · 2024. 8. 29.
  • textsms

24. 08. 19 TIL

뿅 튀어나오는 거import React from 'react';import Scroll from '../Scroll';import Card from './Card';import { SiNaver } from 'react-icons/si';import { IoLogoGithub } from 'react-icons/io';import Link from 'next/link';const member = [ { imgSrc: ' icon: ( ), }, { imgSrc: '/', name: '', tasks: ' icon: ( ), }, { imgSrc: '', name: '', tasks: '', icon: ( )..

  • format_list_bulleted TIL
  • · 2024. 8. 19.
  • textsms

24. 08. 20 TIL

'use client';import { motion, useScroll, useSpring, useTransform, useMotionValue, useVelocity, useAnimationFrame,} from 'framer-motion';import { useRef } from 'react';import { wrap } from '@motionone/utils';interface ParallaxProps { children: string | React.ReactNode; baseVelocity: number;}function MainText({ children, baseVelocity = 100 }: ParallaxProps) { const baseX = useMotionValue..

  • format_list_bulleted TIL
  • · 2024. 8. 19.
  • textsms

24. 08. 16 TIL

클로저클로저는 그 함수가 끝난 후에도 그 함수 안에서 사용했던 변수들을 기억하고 계속 사용할 수 있게 해주는 기능입니다. 원래는 함수가 끝나면 변수들도 같이 사라지지만, 클로저를 사용하면 함수 밖에서도 그 변수를 계속 사용할 수 있게 됩니다. 이를 통해 데이터 은닉화가 가능하지만, 잘못 사용하면 메모리 누수가 발생할 수 있습니다. 프로미스자바스크립트에서 비동기 작업을 처리할 때 사용하는 객체입니다. 작업이 성공하면  then으로 결과를 받고 실패하면 catch로 에러를 처리합니다. 프로미스는 비동기 작업이 완료될 때까지 기다렸다가 결과를 한 번만 반환하는 약속이라 할 수 있습니다. next js를 사용하면 좋은 이유next js는 서버 사이드 렌더링과 정적 사이트 생성을 지원해 빠르고 seo 친화적인 웹..

  • format_list_bulleted TIL
  • · 2024. 8. 16.
  • textsms