Suyeon BLOG

출처: Do it! 클론 코딩 영화 평점 웹서비스 1. 구조 분해 할당을 하지 않았을 때 2. 구조 분해 할당을 했을 때 - 점 연산자 적용한 순서대로 하면 됩니다.

map() -1. 배열의 모든 원소마다 특정 작업을 하는 함수를 적용하고, 그 함수가 반환한 결과를 모아서 배열로 반환합니다. let lists = ['Hi', 'March', 'Blue', 'Love']; lists.map((current)=>{console.log(current); return 0;}) //console 창에 원소 값이 출력되고, 출력한 개수만큼 0으로 채워진 배열을 반환합니다. lists.map((current) => `${current}❤`) //['Hi❤', 'Margin❤', 'Red❤', 'Blue❤'] 2. React JS에서 map을 사용했을 때 - React 원소들은 유일해야 하는데 list에 들어가면서 유일함이 사라졌습니다. - 따라서 각 리스트에 key값이 주어져야 ..

출처 : 노마드코더 - React JS로 영화 웹 서비스 만들기 1. gh-pages 다운받기 - TERMINAL에 npm i gh-pages 입력해서 다운받습니다. - 결과물을 git hub에 올릴 수 있도록 도와줍니다. 2. 폴더에 packages.json이 있는지 확인합니다. - TERMINAL에 npm run build 하면 build라는 폴더가 생성됩니다. - 폴더 안에 여러 파일이 있는데 여기에는 우리가 사용했던 코드들이 있습니다. - build를 GitHub에 올려주면 되지만 작업을 다 한 후에 해야 합니다. 3. 올리기 전에 우선 packages.json에 작업해야할 것이 있습니다. //scripts에 작성 "scripts" : { "deploy" : "gh-pages -d build", ..

출처: 노마드코더 - React JS로 영화 웹 서비스 만들기 프로젝트 흐름 1. 처음 시작할 때 '로딩 메시지'가 화면에 출력됩니다. 2. '로딩 메시지'를 숨기고 코인 리스트를 나열합니다. - 암호화폐 리스트 출처 : https://api.coinpaprika.com/v1/tickers 주의할 점 1. useEffect로 API 한 번만 가져옵니다. 2. useState() 초기값을 안정해주면 undefined로 되고, undefined는 길이(length)를 가지고 있지 않습니다. import { useState, useEffect } from "react"; function App() { const [loading, setLoading] = useState(true); const [coins, s..

출처: 노마드코더 - React JS로 영화 웹 서비스 만들기 import { useState, useEffect } from "react"; function App() { const [toDo, setToDo] = useState(""); const [toDos, setToDos] = useState([]); const onChange = (event) => setToDo(event.target.value); const onSubmit = (event) => { event.preventDefault(); if (toDo === "") { return; } setToDos((currentArray) => [toDo, ...currentArray]); setToDo(""); }; console.log(to..

출처 : Do it! 자바스크립트 입문편 DOM 트리가 만들어지는 과정 실시간으로 확인 https://software.hixie.ch/utilities/js/live-dom-viewer/ Study DOM 공부하기 1. Markup test (웹 문서를 작성할 창) 2. DOM view (DOM 트리를 보여주는 창) 3. Rendered view (결과 화면을 보여주는 창)

const Food = ['tomato', 'potato']; const [FirFavFood, SecFavFood] = Food; //FirFavFood -> 'tomato' //SecFavFood -> 'potato'