Dev
-
[Next.js] Next-auth + Amplify 노트Dev 2022. 3. 21. 23:54
[...nextauth].ts import NextAuth, { Account, Profile, User } from 'next-auth'; import Providers from 'next-auth/providers'; import { NextApiRequest, NextApiResponse } from 'next-auth/internals/utils'; import api from '@lib/api'; import dayjs from 'dayjs'; import Cookies from 'cookies'; // 사용할 oauth provider const providers = [ Providers.Naver({ clientId: process.env.NEXT_PUBLIC_NAVER_CLIENT_ID, ..
-
http와 httpsDev 2022. 3. 18. 17:53
💡 http와 https가 뭐가 다른지 궁금해졌다. HTTP http는 일반적으로 알고있다시피 클라이언트와 서버가 자원을 주고받을 때 사용하는 통신 규약(protocol)이다. http에 대해 찾아보니 보안 문제로 보안이 강화된 https가 등장했다고 한다.그렇다면 http의 어떤 부분에서 보안이 좋지 않다고 한 것인지 궁금해졌다.조사해보니 http로 정보를 요청하고 받을때의 형태는 text 형태라고 한다. 그냥 text를 주고 받는 것이다. 그렇기 때문에 보면 그냥 읽을 수 있다.만약 이런 http를 이용하여 결제 정보나 개인 정보를 처리하는 사이트에서 해커가 네트워크 패킷 감청을 하면 유저의 정보를 그대로 볼 수 있고 읽을 수 있다. 이렇게 된다면 이것은 큰 보안 문제이다. 이런 http의 보안 문제..
-
[Next.js] Amplify 찍먹 배포 해보기Dev 2022. 3. 18. 03:57
1. Amplify 호스팅 할 앱 생성 https://ap-northeast-2.console.aws.amazon.com/amplify/home?region=ap-northeast-2&code=3d6edd4336b9ce08098d#/home https://ap-northeast-2.console.aws.amazon.com/amplify/home?region=ap-northeast-2&code=3d6edd4336b9ce08098d#/home ap-northeast-2.console.aws.amazon.com # Amplify Hosting 선택하여 시작 # 호스팅할 소스코드 선택 # (Github 경우) 레포지토리 및 브랜치 추가 깃허브를 이용하여 호스팅 하는 경우 배포할 레포지토리 선택, 이때 레포지토리..
-
React Uncaught ReferenceError: process is not definedDev 2022. 3. 8. 16:58
갑자기 콘솔창에 Uncaught ReferenceError: process is not defined 에러가 뜨면서 hot reload는 되지만 ui가 얼어버린 것처럼 눌러도 상호작용이 되지 않는 문제가 발생했다. 검색해보니 유사한 사례가 좀 있었으며, 증상도 동일했다. (관련 토론) v5 Regression react-error-overlay build - Uncaught ReferenceError: process is not defined · Issue #11771 · facebook/create-rea I use following command to start: npm run start Then, whenever I save a file, I get the following "Uncaught Ref..
-
상대경로 og:image는 외않되?Dev 2022. 3. 7. 16:25
보통 img 태그의 src 넣어주는 것처럼 상대경로로 이미지를 넣어줬더니, 링크를 공유해도 썸네일로 설정한 이미지가 보이지 않는다. 검색해보니 상대경로로 지정된 경우는 작동하지 않고, 절대경로로 지정된 경우만 읽을 수 있는 것 같다. 또한 설사 상대경로로 지정하여 이미지가 보여지더라도, 페이스북에서 og:image를 설정할때에는 " A string of Unicode characters forming a valid URL having the HTTP or HTTPS scheme. " 즉 HTTP 또는 HTTPS로 이루어진 유효한 URL 유니코드 문자열로 og:image의 content를 설정하도록 가이드하고 있기 때문에 content 값을 보여주고 싶은 이미지의 절대경로로 설정해주는 것이 좋고, 그래야하..
-
[React] github Pages 배포 빈 화면 에러 처리하기Dev 2022. 3. 7. 15:45
react app을 github Pages를 이용해서 배포를 했는데 빈 화면만 나왔다. 그런대 웹 페이지 로고가 잘 나오는 것을 보니 배포는 잘 된 것 같다. 그럼 뭐가 문제인 것일까? 한국어로는 아무리 검색해도 유용한 결과가 나오지 않았다. 배포를 처음부터 다시 해보고, 예전 브렌치로 돌아가서 다시 해보고 삽질을 하다가 영어로 이상하게라도 검색을 해보았다. “react deploy github pages but blank page” 이렇게 이상하게 때려넣어서 검색했는데 해결방법이 바로 나왔다… 이래서 영어로 구글링을 해야하는구나 뼈저리게 느꼈다. 결론적으로 문제는 react-router를 사용해서 설정한 route 경로 때문이었다. github Pages를 이용해서 배포를 하게되면 기본적으로 아래와 같..