본문 바로가기
반응형

Archive188

node에서 S3 업로드하기 S3 환경변수 .env 반드시 아래의 이름으로 설정해야하고, aws-sdk 는 따로 명시하지 않아도 자동으로 credetial을 환경변수에서 참조하기 때문에 env에 작성해두고, S3객체 생성시 config를 별도로 명시해줄 필요가 없다. 반드시 아래의 환경변수 이름이어야한다. 또 필요한 환경변수가 있다면 공식문서에 나와있으니 찾아보고 사용해야한다. Javascript SDK 구성 AWS_ACCESS_KEY_ID= AWS_SECRET_ACCESS_KEY= AWS_REGION= index.html index.js // ES Module 시스템에서 dirname, filename 이 사라짐 import { fileURLToPath } from "url"; import { dirname } from "path.. 2022. 7. 2.
Javascript 언어의 특성 느슨한 타입(loosely typed)의 동적(dynamic)언어 자바스크립트는 변수를 선언할 때 var, let ,const 를 사용한다. 다른언어에서 볼 수 있는 "타입"을 함께 선언하지 않는다. 이유는 자바스크립트에서 변수는 특정 타입에 결속되지 않고, 어떤 타입이든 할당할 수 있기 때문이다. 이점은 장점이자 동시에 단점으로 작용할 수 있다. 프로젝트의 규모가 커지게 된다면 각 변수들이 여기저기서 import, export 될 수 있다. 그렇게된다면 협업을 할때도, 혼자 개발을 할때도 항상 선언부를 찾아가서 의도를 파악하거나, 전체 코드를 읽어야 할 수있다. 또 만약 의도치 않은 타입을 잘못입력했다면, 그 에러는 런타임에서 발생하고, 개발자의 실수를 막아주지 못한다. 그래서 정적언어로서 이단점을 개.. 2022. 7. 1.
React 공식문서에서는 왜 querySelector()를 권장하지 않을까? react로 개발하다보면 특정 element를 집어서 조작해야하는 경우가 있다. 예를들면 input에 focus 를 주는 행위 VanillaJS라면 querySelector()와 같은 메서드를 사용하겠지만, React 에서는 Ref hook을 권장하고 있다. 왜일까? React의 동작원리를 다시 생각해보아야 한다. Browser의 DOM을 직접 조작하는 것이 아니라 VirtualDOM을 만들어 실제 DOM과 비교하면서 화면을 재구성해나간다. 이때 element를 만들때 html태그를 바로 붙이는 것이 아니라, React.element 객체를 만들어 생성한다. 여기가 포인트이다. React에서 제공해주는 Ref 를 사용할 경우에는 VirtualDOM에 확실하게 있는, 즉 신뢰할 만한 값을 return 받을.. 2022. 7. 1.
React 함수 컴포넌트와 클래스 컴포넌트 간단정리 과거의 React는 클래스 컴포넌트는 state를 가질 수 있었고, 함수 컴포넌트는 state를 가질 수 없었습니다. 즉 상태를 가지느냐 아니냐 에 따라서 그 용도가 정해져 있었습니다. class컴포넌트를 사용할 경우 lifeCycle 또한 사용할 수 있었지만 함수는 아니었습니다. 반면 단점으로는 메서드를 항상 this를 바인딩해야하는 문제와 메서드와 state에 접근할 때 마다 this 키워드를 붙여야하는 등 함수형 컴포넌트보다 문법적으로 복잡하고 길었습니다 그래서 함수 컴포넌트에 없는 state와 lifeCyle를 부여하기 위해서 hook 이나왔습니다. hook은 재사용가능한 단위로 묶어내면서 state를 컴포넌트마다 관리할 수 있고, lifeCyle또한 구현이 가능하게 해주었습니다. 이제는.. 2022. 7. 1.
Array-like Object (유사배열) 유사배열(Array-like object)은 말그대로 배열같은 객체입니다. 그럼 배열과 같은 특성을 가지고 있어야되는데, 유사배열이라고 인정하는 기준은 1. key값이 0 부터 순차적으로 올라가며, 연속되어야한다. 2. length property를 가져야한다. 입니다. 그럼 왜 유사배열을 사용하는지 알아야합니다. 배열처럼 관리하고싶지만 배열의 prototype을 상속받고 싶지 않을때, 즉 메서드를 사용하지 못하게하여 사용자 실수를 방지하고 싶을때 사용합니다. 유사배열은 언제든 배열로 취급하여 사용할 수 있는데, call, apply, bind 를 호출하여 this를 바꾸거나, spread 연산자를 이용하거나, Array.from(유사배열) 을통해 배열로 만들어서 사용할 수 있습니다. 유사배열의 대표적인.. 2022. 7. 1.
express 에서 nestJS로 갈아타면서 느낀점 들 새로운 API 서버 개발 외주를 받았다. 기존에 express 로 서버개발을 하면서 느꼈던 불편한 점들이 있었기에 NestJS를 공부하면서 개발해봤다 우선 기존의 express 의 문제점으로는 1. 너무나 자유로운 구조로인해 좀처럼 잡히지 않는 구조 2. 일반적으로 적용되야하는 미들웨어, 설정 등을 일일이 직접해줘야 한다는 점 정도를 느꼈다. 그나마 해소해 보고자 Typescript, Sequelize 를 도입해보았지만, 디비다루는 일 말고는 크게 달라진 점이없고, 여전히 뭔가 내손안에서 자유롭게 변하는 구조가 찜찜했다. 그래서 NestJS가 node 서버 프레임워크라는 것을 알고있었기에 딱 이번이 필요성을 느낀 시점이어서, 공식문서부터, 여러 블로그 글들까지 읽고, 이것저것 만져보고 익혀보았다. 흔히 .. 2022. 6. 30.
반응형