전체 글86 async-await function in useEffect useEffect는 일반적으로 리액트에서 데이터 가져오기가 일어나는 곳이다. 데이터 가져오기는 비동기 함수를 사용하는 것을 의미하고 useEffect를 사용하는 것은 생각만큼 간단하지 않을 수 있다. 잘못된 방법 useEffect에서 데이터 가져오기 수행하는 잘못된 방법 한가지: ... // ❌ 이렇게 하지 마세요 useEffect(async () => { const data = await fetchData(); }, [fetchData]) ...리턴하는 데이터가 소리를 지르는 코드가 될 것이다. 여기서 문제는 useEffect의 첫번째 인수가 아무것도 반환하지 않거나(정의되지 않음) 함수를 반환하는 함수여야 하는데, 비동기 함수는 함수로 호출할 수 없는 Promise를 반환한다. useEffect 후크.. 2022. 2. 22. 개발_일지 / 무한 스크롤 / Infinite Scroll / Intersection Observer API 들어가기 무한 스크롤의 일반적으로 알려진 해결방법(=스크롤 이벤트)은 신뢰성이 부족하고 브라우저나 사이트에 부하를 주기때문에 좋지 못한 사용자 경험을 낳는다. Intersection Observer API는 감시하고자 하는 요소가 다른 요소(viewport)에 들어가거나 나갈때 또는 요청한 부분만큼 두 요소의 교차부분이 변경될 때 마다 실행될 콜백 함수를 호출한다. 즉, 사이트는 요소의 교차를 지켜보기 위해 메인 스레드를 사용할 필요가 없어지고 브라우저는 원하는 대로 교차 영역 관리를 최적화 할 수 있다. 개발하기 IntersectionOberver VS IntersectionObserverEntry IntersectionObserverEntry의 인스턴스가 IntersectionOberver 콜백에 전.. 2022. 2. 14. [크롬 익스텐션] Clipboard 개발 일지 설계하기 textarea 생성 만든 textarea 안보이게 스타일링 body에 추가 getSelection()과 createRange()를 사용해 clipboard할 텍스트 선택 Document.execCommand() 명령어로 copy하기. getSelection 영역 초기화 놓쳤던 부분 textArea 엘리먼트에 자체 focus(), select()를 사용하였더니 크롬 확장자 개발 특성상 크롬 확장자와 기존 페이지의 input이 충돌하여 먹지 않아서 document.getSelection(), getSelection.createRange()를 이용해야 했음. 이전 소스: const textArea = document.createElement('textarea'); textArea.va.. 2022. 2. 14. gqg로 git commit 하기 gqg 설치 $ brew install gpg 사용할 이름과 이메일을 설정 $ gpg --gen-key gpg (GnuPG) 2.2.27; Copyright (C) 2021 Free Software Foundation, Inc. This is free software: you are free to change and redistribute it. There is NO WARRANTY, to the extent permitted by law. Note: Use "gpg --full-generate-key" for a full featured key generation dialog. GnuPG needs to construct a user ID to identify your key. Real name: gi.. 2022. 2. 8. Clipy 맥 유저 복사/붙여넣기 히스토리 관리 프로그램 Clipy 복사한 텍스트를 붙여넣기 하려다가 새로 복사한 내용때문에 사라진 경험이 있다? Clipy를 이용하면 복사했던 내용을 히스토리로 관리하고 골라서 불러올 수 있다. 아주 가벼우며 빠르게 동작합니다. 특징 복사 내용을 히스토리로 관리 할 개수 지정 가능 snippet 기능 포함 설치하기 공식홈페이지에서 다운로드 하세요. 사용법 ⇧(shift) + ⌘(command) + V 스크린샷 2022. 1. 31. VSCODE 자동 정렬 설정하기 - prettier 설치 - eslint 설치 - settings.json에 추가: "editor.codeActionsOnSave": { "source.fixAll.eslint": true } 2022. 1. 28. 사례로 알아보는 보는 웹3 (Feat. 토큰민주주의) WEB3? = 서드파티와 사용자의 권한이 더욱 높아질 수 있는 인터넷 환경 플랫폼 참여자들이 플랫폼 운영에 참여할 수 있도록 거버넌스를 민주화하고, 플랫폼 성장에 따른 경제적 이익을 플랫폼 참여자 사용자와 공유하는 것이다. 거버넌스(governance)는 일반적으로 '과거의 일방적인 정부 주도적 경향에서 벗어나 정부, 기업, 비정부기구 등 다양한 행위자가 공동의 관심사에 대한 네트워크를 구축하여 문제를 해결하는 새로운 국정운영의 방식'을 말한다. 그리고, 이러한 웹 생태계가 작동할 수 있도록 하는 핵심적 역할은 토큰이 해준다. 흠, 자세히 알아보고 싶어! 토큰이 웹3에서 하는 역할 WEB3의 일반적 정의 -> 블록체인을 기반으로 하는 탈중앙화된 생태계 예를 들어, 플랫폼을 통해 번 수익을 구글이나 애플(.. 2022. 1. 17. CTO님이 공유해주신 블록체인 계열 도메인 지식 영상, 읽을거리 - 스킨인더게임 (관련은 없고 리스크가 있어야 몰두하게 된다 이런 느낌의 말씀이셨음) - 안될과학 - 사이버콩즈 - 메타콩즈 - 미래채널 MYF - 장동선 궁금한 뇌 - 티타임즈 ( 웹3 생태계, 토큰민주주의) - 렐리.IO (= 크레이터 토큰으로 유명한 사이트) 현재 티타임즈 유튜브 채널에서 토큰 민주주의 관련 영상을 봤는데 모호한 개념으로 답답했던 마음이 뻥하고 뚫린 느낌! CTO님 공유 감사드림미댜❤ 2022. 1. 17. 이전 1 2 3 4 5 6 7 ··· 11 다음
