👩🏻💻 문제 발생위와 같이 Building for production... 이 계속 떠 있으면서 계속 실행이 안되었다.✔️ 문제 해결내 경우에 여러 글을 봐도 해결이 안 되었다. 위의 문제점은 용량이 부족해서 생기는 문제였다.💡 AWS EC2 프리티어를 쓰는 경우 t2.micro를 사용하는데 이건 RAM이 1GB밖에 안 된다. 그래서 빌드 규모가 조금만 커져도 멈춰버린다. 해결책 1)sudo dd if=/dev/zero of=/mnt/swapfile bs=1M count=2048sudo mkswap /mnt/swapfilesudo swapon /mnt/swapfile메모리대신 스왑 메모리를 생성하여 디스크의 일부를 대신 사용하도록 설정한다. 위와 같이 명령어를 입력하면 스왑메모리가 생성된다. 1..
👩🏻💻 문제 발생사이트를 열었을 때 파비콘을 설정하고 싶은데 계속적으로 설정이 안되었다.✔️ 문제 해결맨 처음에 next.js가 13버전으로 업데이트하고 나서, metadata 파일을 따로 만들지 않아도 되었었다. layout.js파일에 들어가면 있는 metadata를 설정하면 됐다.export function generateMetadata(): Metadata { return { title: "포트폴리오", description: "포트폴리오 사이트 입니다.", icons: { icon: "/images/favicon.ico", }, };}위의 파일은 layout.js에서 metadata가 작성되어 있는 파일인데 여기서 icons옵션을 추가한다. 파비콘 파일을 ..
👩🏻💻 문제 발생vercel에 build할려고 보니 위와 같은 문제가 발생하였다.✔️ 문제 해결참고사이트를 찾아 위와 같이 eslint와 관련된 문제였기에, eslintrc.json파일에서 설정해주면 된다."rules": { "react/no-unescaped-entities": "off" }🔗 참고https://github.com/vercel/next.js/discussions/53972👩🏻💻 문제 발생vercel에 build할려고 보니 위와 같은 문제가 발생하였다.✔️ 문제 해결위와 같은 문제는 쉬운 문제였는데 gpt 컴포넌트에 대해 나는 문제였다. 위의 컴포넌트의 맨 앞의 문자를 대문자로 고치면 해결되는 문제였다.🔗 참고https://www.inflearn.com/community..
next로 만들어놨던 사이트가 Next.js가 업데이트를 하다보니, 성에 안 차서 이번 기회에 공부도 할 겸 업데이트를 하게 되었다. 업데이트하면서 얻은 지식을 공유하고자 글을 쓴다.1. Notion api 만들기notion api를 가지고 홈페이지를 생성했다. 이를 활용해서 페이지를 만들려면 아래와 같이 따라하면 된다.1) 데이터베이스 만들기노션을 만든 후에 빈 페이지를 만든다. 그리고나서 데이터베이스를 만든다. 여기서 말하는 데이터베이스는 표를 의미한다. 자신이 원하는 데이터를 데이터베이스에 작성하여 준다.2)notion api 사용하기💡 https://developers.notion.com/ 위의 사이트에 들어가면 오른쪽 상단에 View my integration이라는 버튼이 있다. 버튼을 클릭해..
계속적으로 react만 쓰다보니 오랜만에 Next.js 쓰다가 바뀐 점이 보여 이에 대해서 서술하고자 한다.1. 구성 요소 계층 변화경로에서layout.jstemplate.jserror.js :(React 오류 경계)loading.js : (리액트 서스펜스 경계)not-found.js : (React 오류 경계)page.js중첩된 경로에서 세그먼트의 구성 요소는 부모 세그먼트의 구성 요소 안에 중첩된다 .2. 공동 배치Next.js 12에서는 pages 디렉토리를 최상위 디렉토리로 가지고 있었다. 그 안에 파일들의 이름으로 url이 자동으로 라우팅되었다.지금은 Next.js에서 app 디렉토리를 최상위 디렉토리로 지정한다. 모든 파일들이 자동으로 라우팅되는 것이 아니라, 폴더 안에 page.js와 rou..
![]()
이 글은 docker로 react와 express를 구동하는 것에 대한 글입니다. 참고부탁드립니다!1. node.js 설치하기1) 본인 OS 버전 확인하기cat /etc/*release*본인의 OS 버전 정보를 확인해준다.만약 본인의 버전이 나와 같이 amazon linux 2023이라면 이 글을 따라해도 좋다.2) node.js 설치하기sudo yum update -y모든 소프트웨어 패키지가 최신 상태인지 확인하기 위해 패키지를 업데이트 시켜준다.curl -fsSL | sudo bash -NodeSource 저장소 설치 스크립트를 설치해준다. 여기서는 node의 버전을 18버전으로 설치한다.sudo yum install -y nodejs위와 같은 명령어를 작성해주면, node.js와 npm이 같이 설..
![]()
1. AWS Certified Cloud Practitioner이란?AWS 자격증은 크게 Foundational, Associate, Professional, Specialty로 나뉘어져있다. 그 중에서 Cloud Practitioner는 Foundational 영역에 해당하는 자격증으로, AWS 클라우드 플랫폼에 대한 기본적인 이해가 있는 사람을 대상으로 한다.2. 시험 정보시험의 정식 명칭은 AWS Certified Cloud Practitioner로, 시험 코드는 CLF-02이다. 시험 시간은 총 90분으로, 65개의 선다형(단수, 복수 응답) 문제로 구성되어 있다. 4지선다의 경우 1개의 정답을, 5지선다의 경우 2개의 정답을 고르면 되는 형식이다.65개의 문제 중에서 실제로 채점되는 문제는 50..
[풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14) 강의 | 로펀 - 인프런 [풀스택 완성] Supabase로 웹사이트 3개 클론하기 (Next.js 14) 강의 | 로펀 - 인프런로펀 | 풀스택 개발에 날개를 달아줄 Supabase! 3가지의 클론 프로젝트를 통해 Next.js 14와 Supabase로 실무 수준의 풀스택 개발을 하는 법을 속성으로 배우게 됩니다., 이 강의를 통해 여러분은[사진]Nexwww.inflearn.com 해당 강의를 듣고 좀 더 작성해서 쓰는 글입니다.react-query: react-query는 서버의 값을 클라이언트에 가져오거나, 캐싱, 값 업데이트, 에러핸들링 등 비동기 과정을 더욱 편하게 하는데 사용한다.하위개념 설명stale : 오래된 데..
