[React] Timer 만들기 - flat() 사용하여 DB내용 불러오기
·
Project/Timer Project
결과 [ Timer 화면 ] 아래에 Send 버튼을 누르면 saveTime(00:00:01)과 text (send 누르면 보내기)가 DB에 저장된다. [ Contents 화면 ] [DB 저장 화면] 묶음의 전체 id값인 creatorId는 Contents에서 내가 올린 글을 삭제할때 쓸 용도이다. DB에 저장된 saveTime과 text값을 Contents 페이지에 불러와서 출력해주면 된다. 오류 [ DB에서 불러온 data의 구조 ] DB에서 불러온 내용이 아래와 같이 array 안에 object안에 array안에 object의 구조이기 때문에 Object의 key값으로 불러올 수 없는 문제가 있었다. -> array의 [0] 배열값을 주면 불러올 수는 있었지만, 글이 여러 개일 때 처리 문제를 생각해..
[JavaScript] ...에 대한 Spread 와 Rest
·
JavaScript
Spread . . . 으로 나타낸다. Array, Object들 안에 있는 요소(element)를 개별적으로 뽑아낼 수 있다. 뽑아낸 요소들로 새로운 Array, Object 만들기가 용이하다. Spread는 변수를 가져가서 풀어 헤친다(Unpack) [Array] const number = [1, 2, 3] //배열을 풀어 헤쳐서 개별 값들을 출력해줌 console.log(...number) //1 2 3 console.log(number) //[1, 2, 3] const english = ['a', 'b'] //새 배열로 만들어 사용하기 편함 const newArr = [...number, ...english] console.log(newArr) //[1, 2, 3, 'a', 'b'] [Object..
[JavaScript] arrow function(화살표 함수) 이란 무엇인가?
·
JavaScript
Arrow function ES6 문법 중 하나 this, arguments, super 또는 new.target을 바인딩하지 않음 항상 익명 메소드 함수가 아닌 곳에 적합 - 생성자로 사용할 수 없음. Arrow function 선언 // 함수 표현식 function() { ... } // 화살표 함수 표현식 () => { ... }​ // 매개변수 지정 방법 () => { ... } // 매개변수가 없을 때 num => { ... } // 매개변수가 하나일 때, 소괄호 생략 가능 // implicit return → 함수와 return 식이 한줄이면, 중괄호{}를 생략하고 암묵적으로 return 된다. num => { return num++ } num => num++ // 위 표현과 동일 () => ..
[Nomad coder/Momentom 클론코딩 1일차] Vanilla JS 와 JS 기본 Concept (#1.0~#1.10)
·
Clone Coding/Momentum [JavaScript]
사용 가능한 JavaScript는 배워본 적이 없는 것 같다. 학교에서 배웠던 것은 Js를 통해 CSS를 변경하는 내용이나, alert 명령어를 사용해서 수학적인 계산을 해보는... 그런 것들을 배웠고 금방 끝났었다. 그 당시 JS에 대한 큰 매력을 느끼지 못하였는데 현재로써는 Web 뿐만 아니라 많은 분야로 펼쳐져 있다고 생각한다. 이런 무궁무진한 발전 가능성과 수많은 분야에서 사용 가능하기 때문에 나의 첫 programing language를 JaveScript로 선택을 하게 되었다. 배웠던 Java, Python 모두 재미있었고, 그 덕에 Javascript를 배우는데 처음 배우는 분들보다는 약간에 이점이 있다고 생각을 하며 시작하게 되었다. Vanilla JS Library(라이브러리)나 Fram..