전체 글58 video 태그 정리 📌 video 태그 옵션 정리 0. loading="lazy" 사용자가 페이지를 스크롤할 때 필요한 이미지나 iframe만 로드되도록 하여 초기 로드 시간을 단축하여 검색 엔진 최적화에 중요한 요소 1. src: 비디오 파일의 URL을 지정합니다. 2. controls: 비디오 재생을 위한 기본 컨트롤(재생, 일시 정지, 볼륨 조절 등)을 표시합니다. 3. autoplay: 페이지가 로드될 때 비디오가 자동으로 재생되도록 설정합니다. (사용자가 소리를 듣지 못하도록 하기 위해 일반적으로 음소거와 함께 사용됩니다.) 4. loop: 비디오가 끝난 후 자동으로 다시 재생되도록 설정합니다. 5. muted: 비디오가 음소거 상태로 재생되도록 설정합니다.(autoplay와 함께 사용해야 합니다.) .. 2024. 11. 18. CSR과 SSR CSR = REACT / SSR = NEXT 1. 클라이언트 사이드 렌더링 (CSR)CSR은 웹 애플리케이션의 렌더링이 클라이언트(브라우저)에서 이루어지는 방식입니다. 사용자가 페이지를 요청하면, 서버는 빈 HTML 문서와 자바스크립트 파일을 전송합니다. 이후 브라우저에서 자바스크립트가 실행되어 필요한 데이터를 API를 통해 가져오고, 이 데이터를 기반으로 동적으로 HTML을 생성하여 화면에 표시합니다.장점:빠른 사용자 경험: 초기 로딩 후 페이지 전환이 빠르며, 사용자 상호작용에 대한 반응성이 좋습니다.서버 부하 감소: 서버는 HTML을 생성하는 대신 정적 파일을 제공하므로 서버의 부하가 줄어듭니다.SPA(싱글 페이지 애플리케이션) 구현 용이: CSR은 SPA 구조에 적합하여, 페이지 간 전환이 매끄럽.. 2024. 11. 14. 머지 리퀘스트(Merge Request) / 풀 리퀘스트(Pull Request) 📢 머지 리퀘스트(Merge Request)란? 머지 리퀘스트(Merge Request)는 GitLab에서 사용하는 용어로, 한 브랜치에서 다른 브랜치로 변경 사항을 병합하려는 요청을 의미한다.새로운 기능을 추가하거나 버그를 수정한 후, 이를 메인 브랜치에 병합하기 전에 팀원들의 리뷰와 승인을 받기 위해 사용하는 절차다. 📢 풀 리퀘스트(Pull Request)란? 풀 리퀘스트(Pull Request)는 GitHub에서 사용하는 용어로, 본질적으로 머지 리퀘스트와 동일한 기능을 수행 한다.브랜치에서 작업한 내용을 다른 브랜치에 반영하기 전에 검토와 승인을 받기 위한 요청이다. 📌 주요 특징:브랜치 통합: 기능 브랜치에서 메인 브랜치로 코드 변경 사항을 병합하는 절차리뷰와 승인: 팀원들의 코드 .. 2024. 7. 16. [React] 아코디언 토글 컴포넌트 * 토글 및 다른 항목이 열리면 현재 항목이 닫히는 아코디언 컴포넌트 React 컴포넌트const Collapse = () => { const [openIndex, setOpenIndex] = useState(null); // 어떤 항목이 열려 있는지(또는 열려 있지 않으면 null)를 추적하는 상태 const [heights, setHeights] = useState([]); // 각 항목의 높이를 저장하는 상태 const answerRef = useRef([]); // 각 항목의 콘텐츠에 대한 참조를 저장하는 ref // 항목 클릭 시 호출되는 함수 const handleClick = (index : number) => { setOpenIndex(index === op.. 2024. 6. 25. blank 1. 소프트웨어 구축 01 소프트웨어 공학Section 1. 소프트웨어 공학 1. 소프트웨어 공학의 3R역공학 (Reverse Engineering)재공학 (Re-Engineering)재사용 (Reuse)2. 애자일 방법론 종류(1) XP : 용기, 단순성, 의사소통, 피드백, 존중(2) 스크럼스프린트백로그 : 요구사항을 우선순위에 따라 나열한 목록번 다운 차트 : 시간의 진행에 따라 남은 작업 시간을 그래픽적으로 표현한 차트 02 프로젝트 계획 및 분석Section 1. 프로젝트 계획 1. 개발 비용 산정(1) 하향식 산정 기법 (Top-Down)전문가 판단 기법델파이 기법(2) 상향식 산정 기법 (Bottom-Up)원시 코드 라인 수 (LOC) : 낙관 + 중간 + 비관(3) 수학적 산정 기법C.. 2024. 4. 26. 프로그래밍언어 c언어소수점 2진수는 소수점영역X2int 자료형 위치 잘 보기 (지역변수..)%d 인지 %c인지 잘 보기switch문 break 위치 확인콤마연산자는 맨 오른쪽의 값 참조 (20, 30)int형변환 => 소수점 내림%.3f => 소수점 반올림~num => 비트 NOT 연산자는 1증가후 마이너스로 변환 [5 => -6]XOR 연산 은 두비트가 다를 때 1을 리턴unsigned 는 절대값 형태static 변수 = 함수내부와 전역에서 사용 가능fork() 함수 : 자식함수생성return 위치 확인.. for문안에 있으면 탈출함수명내용예ceil()올림함수1.5 -> 2.0floor()내림함수1.5 -> 1.0round()반올림함수1.5 -> 2.0.. 2024. 4. 23. 이전 1 2 3 4 ··· 10 다음
