socket통신 이벤트 기획, 구현과정 중 경험했던 이슈와 해결방안에 대해 서술하고 결과 코드를 작성한 게시물입니다.
이 글은 react-draggable을 사용하며 플로팅 버튼을 Drag&Drop 구현 및 이슈 해결 방안을 작성한 글입니다.
💡 Cross-Origin Resource Sharing브라우저는 모든 요청 시 Origin 헤더를 포함한다.서버는 Origin 헤더를 보고, 해당 요청이 원하는 도메인에서부터 출발한 것인지를 판단다른 Origin 에서 온 요청은 서버에서 기본적으로 거부함그러나 보통
💡 (면접 질문 ver.) DOM과 가상 DOM이란?DOMHTML, XML 문서의 프로그래밍 인터페이스이다.HTML은 브라우저에서 실행될 수 있게끔 DOM Tree로 파싱되고, 이를 바탕으로 렌더링이 된다.Virtual DOM추상화된 DOM을 뜻한다. 기존 DOM을
1차 프로젝트를 진행하며 바닐라 자바스크립트로 웹페이지를 구현했어야 했다.우리의 웹페이지는 총 90개 정도의 데이터를 렌더링했어야했기에페이지네이션이 필수로 구현되어야만 했다.그전에 새로 알게된 함수에 대해 설명하도록 하겠다.javascript에서 url의 쿼리 파라미터
먼저 tailwind를 설치tailwind.config.js 파일을 생성한다.tailwind.config.js 파일에 Tailwind CSS를 사용할 템플릿들이 존재하는 경로를 적어준다.최상위 혹은 글로벌 css파일에 @tailwind 지시어들 추가터미널에서 npm r
REST API요청(fetch-then), async-await, 파일 따로 분리 리팩터링
useEffect를 사용하여 마운트(처음 나타났을 때)/언마운트(사라질 때)/업데이트시(특정 props가 바뀔 때) 할 작업
Udemy 문벅스 카페 에스프레소 메뉴판 여러개 만들기 - 로컬스토리지, 메뉴 상태 관리, 카테고리별 메뉴 추가, 수정, 삭제, 품절 상태 관리
Udemy 문벅스 카페 에스프레소 메뉴판 만들기 - 메뉴 추가, 메뉴 수정, 메뉴 삭제