일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- form
- HTML
- API
- Mongoose
- GRID
- frontend
- nodejs
- 자바스크립트
- ECMAScript
- 리액트
- graphQL
- express
- ES6
- DART
- pug
- Flutter
- JavaScript
- node.js
- Session
- react
- clonecoding
- MongoDB
- NextJs
- CSS
- Component
- heroku
- TypeScript
- javscript
- CLONE
- backend
- Today
- Total
목록JavaScript (192)
Enjoy Programming

몽고db를 사용을 위해 mongoose를 사용하던 중 업로드한 파일을 수정시 파일이 있는지 여부를 체크할때 기존 findById로 video객체를 전부 불러와 있는지 확인했다. 그런데~ 더 간단? 하게 확인 할 수 있는 방법이 있는데 바로 Model.exists()를 사용하면 된다. exists() function은 Promise를 return하는데 데이터베이스에 해당 필터와 일치하는 문서가 하나 이상이 있으면 true를 반환하고 아니라면 false를 반환한다. 여기서 filter는 object이다. callback함수도 필요하다고 doc에는 나와있으나 async await을 이용해 콜백없이 사용해본다. 기존 해당 비디오가 있는지 판단후 없다면 오류메세지를 반환하는 코드이다. exists를 사용해서 동일..

react에서 네비게이션을 만들어주는 패키지인 react-router-dom을 사용해보자 https://reactrouter.com/web/guides/quick-start React Router: Declarative Routing for React Learn once, Route Anywhere reactrouter.com HashRotuer -> Route path problem -> 라우터를 읽을때~ 읽어 들인 모든 " / " , " about " 까지 다 랜더링해서 /about 페이지에서도 다보임 이때 exact={true}를 사용함 Navigation 컴포넌트를 하나 만드는데 a href를 사용하면 html이기때문에 매번 Loading이 이루어짐 Link to를 사용 detail 페이지를 만들..

음.. 오랜만에 챌린지 기록을 해본다 그동안 계속 챌린지는 진행중이긴 한데 ~ 다른거 포스팅하고 공부하느라 이것 까진 못하겠다 싶었는데 오늘부터는 간단하게라도 기록해야겠다. 일단 오늘의 challenge내용은 영화정보가 담긴 fakeDB를 이용해서 간단한 웹을 제작하는 내용이다. 조건이 세가지 있는데 먼저 기본적으로 정의된 세가지 컨트롤러가 있는데 1. home should list all the movies 2. movieDetail should show a movie based on the :id 3. filterMovie should filter for a movies based on the rating or the year.~! 홈 컨트롤러는 모든 영화리스트를 보여줘야하고, 영화디테일 컨트롤러는 ..

지난 포스팅에 이어 영화를 랜더링해보겠다. api를 통해 얻어온 movies를 console.log해보면 이렇게 data를 확인 할 수 있다. 이번엔 movies.data.data.movies를 콘솔창에 띄워보자 이렇게 각 영화의 id~ url~ title~등등 정보를 확인 할 수 있다. 이제 render method에서 isLoading이 false로 바뀌면 ready를 리턴하도록 되어 있는데 movie data를 리턴하도록 바꿔보자. Movie.js파일을 하나만들고 역시 react와 Prop-types를 import 해주자. 그리고 movie component는 state가 필요없으므로 굳이 class component로 만들 필요가 없다 function component로 만들어보자. Movie 컴..

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/find Array.prototype.find() - JavaScript | MDN find() 메서드는 주어진 판별 함수를 만족하는 첫 번째 요소의 값을 반환합니다. 그런 요소가 없다면 undefined를 반환합니다. developer.mozilla.org 1. Array.find() 주어진 판별 함수를 만족하는 첫 번째 요소의 값을 반환한다. 그런 요소가 없으면 undefined를 반환. 자 예를 들어보자 frineds라는 배열이있고 find()함수를 통해 @gmail이 있는 요소를 찾으려고한다 argument에 @gmail이 있는지 includes메소..

array method에 대하여 알아보자. 1. Array.of() https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/of Array.of() - JavaScript | MDN Array.of() 메서드는 인자의 수나 유형에 관계없이 가변 인자를 갖는 새 Array 인스턴스를 만듭니다. developer.mozilla.org Array.of() 메서드는 인자의 수나 유형에 관계없이 가변 인자를 갖는 새Array 인스턴스를 만든다. 이러한 차이가 있다고 한다~~!~!~ 2. Array.from() https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference..