태그를 통해 문서에 비디오를 다음과 같이 삽입할 수 있다.  video 태그에서 사용 할 수 있는 속성autoplay : 비디오가 실행될 준비가 끝나는 대로 자동으로 실행됨controls : 플레이 버튼이나 정지 버튼과 같이 비디오의 실행을 제어할 수 있는 제어기가 표시됨width : 비디오의 너비를 픽셀(pixel) 단위로 명시함height : 비디오의 높이를 픽셀(pixel) 단위로 명시함loop : 비디오의 재생이 끝나면 자동으로 또다시 재생됨muted : 비디오의 음성 출력이 음소거 됨poster : 브라우저나 인터넷 문제등으로 영상을 재생할 수 없을 경우 표시preload : 페이지가 로드될 때 오디오 파일이 같이 로드되어야 하는지 여부src : 비디오 파일의 URL See the Pen v..

날짜 선택하는 캘린더 라이브러리 중 react-datepicker를 자주 사용한다. React Datepicker 공식 웹사이트 React Datepicker crafted by HackerOne reactdatepicker.com  React Datepicker 설치 npm install react-datepicker --save//oryarn add react-datepicker  React Datepicker 사용법기본 사용import DatePicker from "react-datepicker";import "react-datepicker/dist/react-datepicker.css"; // 달력 cssexport default function Home() { const [startDate, s..

현재 개인 블로그를 만들면서 다크모드를 next-themes 라는 라이브러리를 사용해서 적용해보았다.개인 블로그 css를 tailwind로 적용했기 때문에 tailwind 방식으로 진행했다.tailwind.config.js 수정config중 darkMode를 ”class” 로 바꾼다.“class”로 수정해야 수동으로 어두운 모드 전환할 수 있다.기본형은 “media” 로 운영 체제 기본 설정에 의존한다.import type { Config } from "tailwindcss";const config: Config = { content: [ "./src/pages/**/*.{js,ts,jsx,tsx,mdx}", "./src/components/**/*.{js,ts,jsx,tsx,mdx}", ..