본문 바로가기

Next5

next14) use server에서 use client 컴포넌트를 import해서 사용하는 방법 비디오 동영상 불러오는 것을 client모드로 가져왔음. 서버모드 컴포넌트'use server'// MUI Importsimport Card from '@mui/material/Card'import CardContent from '@mui/material/CardContent'import Chip from '@mui/material/Chip'import Divider from '@mui/material/Divider'import List from '@mui/material/List'import ListItem from '@mui/material/ListItem'import Typography from '@mui/material/Typography'import useMediaQuery from '@mui/.. 2024. 8. 18.
NextJS로 tailwind시작하기 1. yarn add -D tailwindcss@latest postcss@latest autoprefixer@latest 2. yarn tailwindcss init -p tailwind.config.js 파일이 생김. 3. 아래 붙여넣음. /** @type {import('tailwindcss').Config} */ module.exports = { purge: ['./pages/**/*.{js,ts,jsx,tsx}', './components/**/*.{js,ts,jsx,tsx}'], content: [], theme: { extend: {}, }, plugins: [], }; 이렇게 하면 최종 프로덕션 빌드에서 모든 사용하지 않는 스타일을 효과적으로 제거하여 파일 크기를 크게 줄일 수 있다고함. .. 2023. 12. 13.
저장 시 prettier 작동하도록 설정하는 법 (format on save) 2023. 10. 18.
useCallback과 useMemo에 대해 완벽하게 이해해보기. 1. useCallback : useCallback()은 함수를 메모이제이션(memoization)하기 위해서 사용되는 hook 함수입니다. 첫번째 인자로 넘어온 함수를, 두번째 인자로 넘어온 배열 내의 값이 변경될 때까지 저장해놓고 재사용할 수 있게 해줍니다. 아래 코드에서는 컴포넌트의 랜더링이 일어날때마다 onSave라는 함수를 생성해서 자식에게 넘겨준다 import { useState } from 'react'; import TestTwo from './frag/test-two'; const TestPage = () => { const [name, setName] = useState(''); const onSave = () => { console.log('hello.'); }; return ( se.. 2023. 8. 17.
javascript 요일 알아내기 .getDay() 월요일이 1 화요일이 2 ... 일요일은 0이라고함. 사용방법 const today = new Date(); const day = today.getDay(); 오늘이 월요일이면 1 화요일이면 2 나옴. 2023. 8. 15.

티스토리툴바