SimCoding

[CSS] Textarea 말줄임 표시, 줄수제한 안녕하세요. 오늘은 CSS를 활용해, Textarea의 줄수를 제한해서 보여주는 방법에 대해 알아 보겠습니다. "-webkit-line-clamp" 속성을 이용해서 보여지는 줄 수를 제한할 수 있습니다. 단, "-webkit-line-clamp" 속성이 실행되기 위해서는 "display: -webkit-box" , "-webkit-box-orient: vertical" 로 설정되어 있어야 합니다. 예시코드 display: -webkit-box; -webkit-line-clamp: 2; // 줄수, 2일경우 2줄 -webkit-box-orient: vertical; line-height: 1.8; overflow: hidden;

게더타운, 젭의 맵들을 체험해 볼 수 있는 커뮤니티 - 모두의 메타버스 안녕하세요. 이번 포스팅에서는 "모두의 메타버스" 라는 메타버스 공유 커뮤니티에 대해 소개해 드리려고 합니다. "모두의 메타버스" 는 자신이 만든 메타버스공간 (zep맵, 게더타운 맵등)의 공간을 공유 및 체험해 볼 수 있는 커뮤니티 사이트입니다. 현재는 베타로 서비스를 하고 있는 상태입니다. 게더타운, zep등의 맵을 제작해 본 경험이 있으시거나, 다양한 메타버스 공간을 체험해보고 싶으신 분들이 이용해 보면 좋을 것 같습니다. 모두의 메타버스에서 여러분들이 직접 만든 메타버스 공간을 마음껏 자랑해보세요 ! ▶ 모두의 메타버스 링크 https://www.modumeta.com/ 모두의 메타버스 - MoMe 메타버스 공유 플랫폼 모두의..

[React] DarkMode 새로고침시 화면 깜빡임문제 해결 - useLayoutEffect 안녕하세요. 이번 포스팅 에서는 useLayoutEffect Hook에 대해 간단히 소개하고, UseLayoutEffect Hook을 이용해, DarkMode에서 새로고침시 화면이 깜빡이는 문제를 해결하는 방법에 대해 알아보겠습니다. useLayoutEffect & useEffect useLayoutEffect는 기본적으로 useEffect와 형태가 동일합니다. useLayoutEffect(() => { effect(); return () => { cleanup(); }; }, [input]) useEffect와 useLayoutEffect의 차이점 useEffect는 DOM이 화면에 그려진 이후에 호출됩니다...

[JS] axios interceptors 를 이용해 token만료시 refreshToken 요청하기. 안녕하세요. 이번 포스팅에서는, token이 만료됐을 때 refreshToken을 자동으로 요청 하기 위한 axios interceptors 설정에 대해 알아보겠습니다. 과정 요청성공시 return 요청실패시 ( 토큰 만료로 인한 에러 발생시) 에러를 반환하기 전에 interceptor 해서, 서버에 token refresh를 요청합니다. token refresh요청을 통해 받은 새로운 accessToken을 ReduxStore등 본인이 이용하는 저장소에 저장합니다. 새로운 accessToken을 header에 담아, 재요청합니다. 코드 예시 axios.interceptors.response.use( ..

puppeteer access denied 해결 방법 - puppeteer-extra-plugin-stealth 안녕하세요. 이번 포스팅에서는 puppeteer access denied 에러를 해결하는 방법에 대해 알아보겠습니다. 저는 쿠팡 크롤링 과정에서 puppeteer access denied 에러가 발생해.. 아주 고생을 했습니다 ..! 다행히 열심히 구글링한 결과, 해결 방법을 찾을 수 있었습니다 ! 이 문제를 한번에 해결해주는 라이브러리가 있더라구요.. ! 'puppeteer-extra-plugin-stealth' 라이브러리를 이용하면 문제를 해결 할 수 있습니다. 설치하기 npm install puppeteer puppeteer-extra puppeteer-extra-plugin-stealt..

[JS] axios interceptor로 authorization header 설정하는 방법. 안녕하세요, 이번 포스팅에서는 axios interceptor를 활용해 authorization header의 default값을 설정하는 방법에 대해 알아보겠습니다. 토큰이 있을 경우 config.header.Authorization = `Bearer ${token}` 토큰이 없을 경우 config.header.Authorization = "" 예시 코드 axios.interceptors.request.use(function (config) { config.headers.Authorization = token ? `Bearer ${token}` : ""; return config; }); 이렇게 설정해주면, ..

axios interceptor 를 이용해서 요청,응답 커스터마이징 하는 방법 안녕하세요. 이번 포스팅에서는 axios의 interceptor를 이용해서 requset, response를 커스터마이징 하는 방법에 대해서 알아보겠습니다. 인터셉터 인터셉터 사용방법을 예시 코드를 통해 확인해보겠습니다. // 요청 인터셉터 추가 axios.interceptors.request.use( function (config) { // config에는 axios요청시 입력한 config가 들어있습니다. // config를 가공해서 요청하는 것이 가능합니다 ! // 요청을 보내기 전에 수행할 일 // ... return config; }, function (error) { // 오류 요청을 보내기전 수행할 일 // .....

[TS] Property 'name' does not exist on type 'EventTarget' > EvenTarget에 name 속성이 존재하지 않아서 발생하는 타입오류 > 해결 : TypeAssertion을 이용해 해결 할 수 있다.