React props error 스타일 컴포넌트를 사용하는 와중에 처음 보는 에러가 발생했다. 전달되는 props에 따라 스타일을 변경해주려 하는데, props에 관한 에러였다. 이러한 에러가 발생한 곳에 대한 예제는 아래와 같다. // 타입 지정 type StackProps = { stack: boolean, ...

Backend Sql과 NoSql Sql과 NoSql은 관계형이냐 아니냐에 따라 나뉜다. 보통은 Spring으로 개발할 때는 MySql을, Node.js로 개발할 때는 MongoDB를 주로 사용한다고 한다. Node.js와 MongoDB는 둘 다 Javascript를 기반으로 한다. 그저 관계형 데이터...

TypeScript Redux 상태관리를 하기 위해 redux를 적용할 시 작성해야 하는 타입스크립트 적용법이다. actions 액션 타입을 선언함에 있어, as const를 붙여주어 일반 문자열이 아닌 counter/INCREASE로 추론될 수 있도록 해준다. 액션 타입을 일반적은 문자열로 추론해버릴 경우, 액션 객체들에 대한...

AWS 간혹 인스턴스나 ACM 인증서, 레코드 등등 데이터가 사라져 보이지 않을 때, 우측 상단에 접속 위치를 확인한다. 본인이 데이터를 생성했던 지역으로 설정되어 있는지 확인 ! https 옵션 허용에 대한 자료들은 많기 떄문에 간략하게만 적겠다. EC2 https 접근 허용을 위한 과정들 인스턴스의 기본적인 설명은 1장에서 마쳤...

AWS EC2 쉽게 생각해서 컴퓨터를 한 대 빌리고, 우리의 프로젝트를 npm run start 등으로 시작하듯 프로젝트를 열어놓는 것이다. 23.09.13 추가 기본 설치 인스턴스를 생성하였으면 연결해주고 curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.3/install...

React Eslint PS C:\Users\choigirang\Desktop\code-container> npm install @typescript-eslint/eslint-plugin npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` in...

React 매번 작성되어 있는 Eslint, Prettier를 사용하면서 막상 내가 적용하려고 하니 아무것도 못 하고 있는 나를 위한 정리글 둘 다 코드 컨벤션을 잡아주는 녀석이라고 알고 있었는데, 그냥 두 개 다 사용하면 되는 건 줄 알았던 차이점도 알아보는 글 eslint는 코드 퀄리티를 보장하도록 도와주고, prettier는 코드 ...

Next 2024-03-05 Next.js는 초기 SSR 방식으로 동작하며, 이후 사용자 측에서 CSR 방식으로 혼합되어 동작할 수 있다. 이러한 특성 때문에 페이지를 요청할 때, 해당 페이지를 렌더링하고 HTML을 클라이언트에게 전달하는데 이때 CSS가 포함한 스타일이 적용된 HTML이 생성된다. 서버에서 렌더링된 HTML에는 일반적...

Node 진짜 죽을 맛이었다…S3를 다 정리하고 넘어가려 했는데, 뭘 어디서부터 정리해야 할지 까마득하여 출처 블로그에 맡기고 그간의 삽질을 작성하겠다. Frontend 프론트는 Next를 쓰나 React를 쓰나 우선 구조부터 작성해본다. 이미지 전송을 위해서는 form 태그를 사용해야 한다. 여기에는 또 여러가지 사항을 지켜...

Node S3란 S3에 대한 모든 것은 이곳으로 사용자의 이미지 업로드 관리를 효율적으로 할 필요가 생겼다. 우선 EC2를 사용하여 관리할 수도 있지만, S3가 특별한 이유는 비용이 저렴하고 저장공간이 거의 무한대에 가깝다. 객체로 된 파일을 다루는 저장소인 객체 스토리지이다. EC2와는 달리 프로그램을 설치하거나 저장하는 기능은...