Playground project 포트폴리오 개발하면서 구현했던 효과 중 아카이빙 할만한 것 추려서 정리하는 중 마우스로 폴더 페이지 넘기기 효과 마우스 포인터에 글로우 효과가 가미된 Bento box Leetcode Top Interview 150 Graph General 후반부 33% + Graph BFS 그래프 문제 풀 땐 잔 실수가 너무 많다. 집중 또 집중! 푼 문제 리스트 Course Schedule Course Schedule II Snakes and Ladders Minimum Genetic Mutation Word Ladder 모든 개발자를 위한 HTTP 웹 기본 지식 섹션8 HTTP 헤더1 - 일반 헤더 수강 REST의 Representative의 의미에 대해 확실히 알게 되었다. 메세..
Playground project 재밌어보이는 효과 만들어 보기 & 아카이빙 용도 우선 포트폴리오 개발하면서 구현했던 효과 중 아카이빙 할만한 것 추려서 정리하는 중 혜성 효과 추가 그 후 첫 번째로는 인터렉티브 로그인 UI 구상 중 Leetcode Top Interview 150 Binary Search Tree & Graph General 66% 변수가 undefined인지 체크하려고 'if (!var)' 식으로 하면 var === 0 일 때 잘못 체크된다. 항상 이런 경우 습관적으로 틀리고 디버깅하기도 힘드니 코테 볼 땐 조심하자. 푼 문제 리스트 Minimum Absolute Difference in BST Kth Smallest Element in a BST Validate Binary Sear..
Highlight 오늘부터 하루 하루 어떤 일을 했는지 블로그에 글로 남기기로 하였다. Leetcode Top Interview 150 Binary Tree General 뒤쪽 문제 + Binary Tree BFS 평이한 문제들로 특이사항은 없었다. 푼 문제 리스트 173. Binary Search Tree Iterator 222. Count Complete Tree Nodes 236. Lowest Common Ancestor of a Binary Tree 199. Binary Tree Right Side View 637. Average of Levels in Binary Tree 102. Binary Tree Level Order Traversal 103. Binary Tree Zigzag Level ..
생각보다 비디오 관련 문제가 컸기에 따로 글로 정리한다. # 비디오 자동재생 조건 이번에 겪은 상황 별 비디오가 자동재생 되는 조건은 다음과 같다. 1 에 필요한 prop 데스크탑 / 안드로이드 크롬: muted iOS 모바일 사파리 & 크롬: autoplay, muted, playsInline 2. iOS 크롬 추가 사항 js에서 video.play()를 실행할 것 3. 모바일 공통 추가 사항 저전력 모드가 아닐 것 따라서 저전력 모드를 제외한 모든 경우를 커버할 수 있는 코드는 다음과 같다. # 저전력 모드 처리 모바일 저전력 모드에서는 동영상을 재생할 수 있는 방법이 없어보인다. 따라서 저전력 모드일 때를 대비한 fallback을 보여줘야만 한다. 하지만 아쉽게도 브라우저에서 저전력 모드인지를 직접..
끝인줄 알았지? 하면서 나타나는 버그들..... (ㅂㄷㅂㄷ) 웹에서 나타나는 버그들은 이미 거의 다 해결해서 자잘한 오류 수정 정도야 있을 수 있겠다 생각했지만, 역시 오산이었다. 실제 핸드폰으로 웹 사이트를 열어보니 홈 화면부터 안나온다... # 홈 화면 비디오 재생 에러 가장 심각한 문제부터 해결해보자. 근데 신기한 것은 갤럭시에선 또 이문제가 발생하지 않는다. 오직 아이폰에서만 발생한다. 원인은 비디오의 autoplay guide가 OS 별로 다른 것 때문으로 유추된다. 데스크탑 크롬이나 안드로이드에서는 비디오가 muted 설정만 되어있어도 문제가 없지만 ios는 그렇지 않다. 일단 autoplay 속성이 없으면 로드조차 하지 않고, playsInline 속성이 없으면 js에서 play() meth..
어느 새 두 번째 글을 쓴 지 한 달이 되었다. 한달 동안 미국 여행을 하며 틈틈히 이것 저것 만든 결과 드디어 두 번째 버전의 포트폴리오가 완성되었다. https://portfolio-dev-wann.vercel.app/ Seungwan Cho's Portfolio portfolio-dev-wann.vercel.app 확실히 첫 번째 포트폴리오 페이지에서보단 기본 틀을 잡아놓고 진행해서 그런지 완성도가 높게 나온 것 같다. 포트폴리오 페이지 구성 포트폴리오 페이지는 크게 Home, About, Project, Contact 네 파트로 구성되며 추가로 Resume 페이지가 있다. - Home 직접 찍은 타이핑 영상에 react-type-animation을 사용해 애니메이션을 구현하였다. 단순히 영상을 재..