히히후후

본 내용은 우아한테크러닝_3기에서 사용된 코드들을 바탕으로 작성했습니다. {name === '리액트' && 리액트입니다.} react를 다루다보면 이와 같은 조건부 연산자들을 많이 사용하게 된다. 하지만, 만약 이 구문이 JSX 코드 속 틈틈히 들어가게 된다면 JSX와 JS가 뒤섞이게 되고 이는 가독성을 떨어트리는 결과를 만든다. import * as React from "react"; //아마 이제는 * as 빼도 될듯..? interface IMaybeProps { test: boolean; children: React.ReactNode; } export const Maybe: React.FC = ({ test, children }) => ( {test ? children : null} ); type..

React 2020. 9. 23. 01:27

closure를 공부하다가 let f; { let o = { note: "Safe" }; f = function () { return o; }; } let oRef = f(); console.log(oRef); oRef.note = "not so safe"; console.log(oRef); 이와 같은 코드를 사용하게 되었다. 나는 당연히 console창에 note : "Safe"} 와 {note : "not so safe"} 가 찍힐 것이라고 예상 했지만 결과는 2개의 {note : "not so safe"} 였다. 왜 이렇게 되는지 이해가 되지 않아 찾아봤더니 객체를 로깅할 때는 객체의 내용 변경사항이 실시간으로 업데이트 된다고 한다. 내가 적은 코드의 경우에서도 객체이고, 이 객체의 내용이 변했기 ..

카테고리 없음 2020. 9. 19. 02:00

첫 1주는 Javascript에 집중한다. JS를 제대로 모르고 상태로 react와 node를 공부해봐야 기술부채만 쌓여간다. 항상 기본이 중요하다. 이 1주동안 javascript.info page와 러닝 자바스크립트 책을 정독하며 내가 몰랐던 부분과 중요하다고 생각이 드는 부분들을 이곳에 정리한다. (#FFFF00 형광색 색상 코드!!!) 1. Javascript에서 함수는 반드시 return 값을 가져야 한다. return을 쓰면 명시적으로 그 값을 반환 return을 쓰지 않는 다면 undefined가 반환(undefined 또한 하나의 값이다!) 함수 내부의 구문이 1줄일 경우 계산 후 결과값을 바로 return 하기 때문에 return 문을 쓰지 않아도 되지만 여러줄이면서 return해야 하는..

MOFE 스터디 2020. 9. 15. 01:40

input은 한 줄 짜리 입력창 textarea는 여러줄 짜리 입력창 webberstudy.com/html-css/html-3/form-2/ Form 요소 2 (textarea와 input) HTML form 요소인 textarea 태그와 input 태그의 다양한 타입(type)과 속성들을 살펴보며, 폼 예시 페이지를 제작해봅니다. webberstudy.com 굉장히 잘 설명이 되어 있다.

카테고리 없음 2020. 9. 6. 18:07

mongoosejs.com/docs/connections.html Mongoose v5.10.3: Connecting to MongoDB You can connect to MongoDB with the mongoose.connect() method. mongoose.connect('mongodb://localhost:27017/myapp', {useNewUrlParser: true}); This is the minimum needed to connect the myapp database running locally on the default port (27017). If connecting mongoosejs.com mongoosejs.com/docs/api.html#model_Model.findById..

nodejs 2020. 9. 6. 17:19

haeguri.github.io/2018/12/30/compare-response-json-send-func/ Express res.json과 res.send 비교 · Devlog 개인 프로젝트를 개발하면서 서버가 필요하게 되었는데 자바스크립트를 더 공부해보고 싶어서 서버를 Node.js, Express를 사용하여 개발하고 있다. 지금 작성된 모든 서버 API는 Express를 통해서 JSON � haeguri.github.io 먼저, 이 글을 참고했다. 인스타그램 클론코딩에서 사용한 router 3개를 통해 설명하겠다. router.post("/createpost", requireLogin, upload.single("image"), (req, res) => { const { title, body } ..

nodejs 2020. 9. 6. 16:59

일단 multer를 통해 이미지를 upload하면 upload folder 속에 이미지가 저장되는 상황이다. 백엔드에 5000번 포트를 할당했다 가정했을 경우 내가 봐왔던 영상들에서 항상 http://localhost:5000/uploads/이미지파일이름.확장자명 ex)http://localhost:5000/uploads/Lion.jpg 맨 앞에 http를 적지 않으면 이런 오류 메시지가 나올 수 있다. 와 같이 접근했었다. 하지만, 막상 내가 이런 식으로 접근하니 제대로 접근 되지 않았는데 이는 express의 middleware 중 하나인 static 함수를 쓰지 않았기 때문이다. express static 함수를 사용하면 css 이미지 javascript 파일과 같은 정적인 파일들에 접근 할 수 있..

nodejs 2020. 9. 3. 18:01

https://blog.naver.com/writer0713/221853596497 [Spring] Post 요청과 Content-Type의 관계 ​​실무에서 RestAPI를 만들면서 간혹 마주치는 이슈가 있었다.Client에서 POST 방식으로 요청을... blog.naver.com https://xn--xy1bk56a.run/axios/guide/ Axios | Axios 러닝 가이드 xn--xy1bk56a.run axios 공식문서 번역 RestAPIestAPI에서는 보통 json type으로 data를 전송하고 받는다. 이를 위해서 content-type 을 application/json 으로 명시해야하는 것이다. 공부를 하다 궁금했던 것이 fetch를 사용하는 경우에는 content type을 ..

React 2020. 8. 28. 17:30