아무튼, 아무튼,

상황 어드민 페이지에서 이벤트를 등록하는 기능을 구현하는 중이었다. 사용하는 데이터는 문자열과, 파일(이미지) 였다. 파일을 서버로 보내기 위해서 FormData 형식을 사용해야 했다. 서버로 보내기 전에 데이터가 FormData에 잘 담기고 있는지 확인하기 위해 console.log()를 찍어보니까 안 나와!!!!!!!!!!!!!!!!!!!!!!!!!!!! 그럼 프론트에서만 안 찍히고 서버에는 제대로 가고 있을까? 하고 서버에서도 req.body를 찍어보니까 또 안 나와!!!!!!!!!!!!!!!!!!!!!!!!!!!! 1. 프론트에서 안 찍히는 이유 FormData는 한 번에 찍어볼 수 없습니다. why formdata.append not working? 이거 오지게 검색해 봄ㅎㅎ 타입스크립트에서는 ..

DB에 이미지를 직접 저장하지 않는다. DB는 비싸고, 용량이 큰 이미지를 저장하기 적합하지 않다. 이미지를 저장하는 공간을 확보하고 그 경로를 DB에 저장한다. 지금은 서버에 그냥 폴더를 만들어서 저장 (S3버켓을 사용해서 저장하는 방법으로 바꿀 예정) 클라이언트에서 이미지를 보내주면 서버에서 처리하는 건 의외로 간단하다. multer모듈을 사용해서 저장하면 된다. multer 모듈을 사용해서 npm install multer 서버 안의 폴더에 이미지 파일을 저장한다. const multer = require('multer'); const upload = multer({ dest: './upload' }); upload 폴더에 이미지를 저장 app.use('/image', express.static('..

메소드 맨날 까먹어서 쓸 때마다 어? 있었던 것 같은데 뭔지는 모르겠다. (검색) 무한 반복 다들 이렇게 사는 거지 hasOwnProperty() obj.hasOwnProperty(prop) 문법 간단~ obj => 객체 / prop => 확인하고자 하는 속성 있으면 true, 없으면 false를 반환 되게 간단한 메서드인데,, 설명을 읽다 보니까 "이 메소드는 객체가 특정 프로퍼티를 자기만의 직접적인 프로퍼티로서 소유하고 있는지를 판단하는데 사용된다. in연산과는 다르게, 이 메소드는 객체의 프로토타입 체인을 확인하지는 않는다." 이 부분을 보고 in이랑 차이점을 살펴봤다. in operator 속성 in 객체명 너무 간단해서 땀 난다. 프로토타입 체인을 알면 hasOwnProperty는 프로토타입 체..

EC2보안그룹 인바운드 규칙에서 연습용 서버 열려고 포트 5000을 추가해두고서버를 5000포트를 사용하도록 열어놨을 때는 문제없이서버가 돌아갔는데 다른 서버를 만들어서 3001 포트에서 열려니까 응답이 안오는 문제가 있었다ㅎ..내 EC2인스턴스가 3001포트에 대해 어떤 지정도 되어있지 않아서 그런 거 였는데한참 해결을 못해서 고생했다ㅋㅋㅋㅋㅋㅋㅋㅋㅋ 그 와중에 5000번으로 바꿔 볼 생각을 왜 못 했을까?포트만 다르고 다 똑같은데 왜 안되지..? 이러고 있었음보안규칙가서 열어주니까 바로 해결되었다!

[Postman 공식 문서] 사용중인 Os(운영체제) Ubuntu 18.04.3 LTS 원래 크롬 익스텐션이었는데 안 되는 듯 함,, 그래서 그냥 설치하고 사용 중 다들 편하다고 그랬는데 (설치하기 귀찮아서) 매번 클라이언트 만들어서 요청을 보냈다; 이게 더 귀찮은건데ㅋㅋㅋㅋㅋㅋ 서버 만들 때 엄청 유용하고 편하기 때문에 간단한 사용법을 정리하고자 한다. [설치방법 참고 블로그] 터미널에 다음 명령어를 입력하면 설치 완료 wget https://dl.pstmn.io/download/latest/linux64 -O postman.tar.gz sudo tar -xzf postman.tar.gz -C /opt sudo ln -s /opt/Postman/Postman /usr/bin/postman 실행하려면 터..

Introducing JSX const element = Hello, world! 👆 자바스크립트와 HTML이 마구 뒤섞여 있는 듯한 요상한 구문처럼 보이지만 이 놈은 JSX다. JSX는 JavaScript의 확장 문법이며 리액트의 UI를 묘사하는 데 사용된다. template language를 생각나게 하지만 JavaScript임 ※템플릿 언어란? JSX는 React "elements"를 만든다. JSX에 대해 좀 더 자세히 알아보자. Why JSX? 우선, JSX가 리액트를 사용하는 필수조건은 아니다. 리액트 이전에 클라이언트를 구성하는 방법 즉, HTML과 JavaScript를 따로 작성하고 태그로 연결하는 방법은 마크업(markup)과 로직을 서로 다른 파일에 작성하기 때문에 기술을 인위적으로 분..

HTTP통신의 특징은 stateless하다는 것이다.예를 들어 클라이언트가 로그인 요청을 보내고 서버가 그에 따른 응답을 했다고 하더라도다음에 요청을 보낼 때 서버는 이미 로그인한 클라이언트인지 알 길이 없다.이 경우, 권한이 필요한 모든 요청에 매번 인증절차를 거쳐야하는 번거로움이 생긴다.그래서 등장한 것이 쿠키🍪와 세션이다! 처음에 이해했을 때 쿠키는 클라이언트가 가진 정보, 세션은 서버가 가진 정보!이렇게 이해했더니 헷갈리는 부분이 많았다.왜냐하면 노드에서 express-session모듈을 사용해서 진행했는데분명 세션은 서버가 가진 정보라고 했는데 자꾸 req.session으로 클라이언트 요청에 세션이 붙어서 오는,,이게 뭐지? 뭔 소리지? 왜 이러지? 근데 쿠키는 또 req.session.cook..

JavaScript로 작성피보나치는 앞의 두 숫자의 합으로 이어진 수열이다. 첫번째는 0, 두번째는 1로 정해져 있고, 그 뒤부터 법칙에 따라 수열이 만들어짐0, 1, 1, 2, 3, 5, 8, 13, 21, ... 조건1. 매개변수로 n을 받고, 피보나치 수열의 n번째 숫자를 반환한다.2. 시간복잡도는 O(N)3. 재귀도 써 보고 반복도 써 봐라 (근데 재귀로 풀면 시간 복잡도는 못 맞추는 것 같다?) 피보나치 자주 풀었지만 풀 때마다 걍 새로 푸는 느낌,, 근데 코드 보면 맨날 똑같이 적었.. 소름 재귀 ver 반복 vervar nthFibonacci = function (n) { var array = [0, 1]; for(var i=2; i