본문 바로가기
반응형

분류 전체보기97

7.3부터 영화 웹 서비스 [영화 웹 서비스 프로젝트] - 영화를 보여줌 - 영화들에 대한 정보 보여줌 + 링크 앱 안에서 페이지를 전환하는 방법 async-await useEffect (() => { fetch( `https://yts.mx/api/v2/list_movies.json?minimum_rating=9&sort_by=year` ) .then((response) => response.json()) .then((json) => { setMovies(json.data.movies); setLoading(false); }); }, []); const getMovies = async() => { const json = await ( await fetch( `https://yts.mx/api/v2/list_movies.json?.. 2022. 3. 28.
7.2 console > network fetch("url") 한 것이 잘 보임 https://api.coinpaprika.com/v1/tickers response로 부터 json을 추출 fetch("url").then((response) => response.json()) import { useEffect, useState } from "react"; import Button from "./Button"; function App() { const [loading, setLoading] = useState(true); const [coins, setCoins] = useState([]); useEffect (() => { fetch("https://api.coinpaprika.com/v1/tickers") ... 2022. 3. 27.
7.0부터 Todolist map() 사용법 - 배열 각각의 element를 바꾸고 싶을 때 배열.map(function) - map의 괄호 안에 function은 array의 모든 item에 대해 실행되는 함수 - 그 함수에서 return한 값이 새로운 array에 들어가 있다. map은 함수의 첫 번째 매개변수로 현재의 item을 가지고 올 수 있다. import { useEffect, useState } from "react"; import Button from "./Button"; function App() { const [toDo, setToDo] = useState(""); const [toDos, setToDos] = useState([]); const onChange = (event) => setTo.. 2022. 3. 27.
6.0부터 1. state 2. props 3. useEffect import { useState } from "react"; import Button from "./Button"; function App() { const [counter, setValue] = useState(0); const onClick = () => setValue((prev) => prev+1); return ( {counter} click me ); } export default App;​ component render되는 경우 - 처음으로 화면 refresh 할 때 - component의 state가 변화할 때 (state를 change하고, 그럴 때마다 모든 것이 다시 실행됨) 만약! component가 처음 render될 때만 코드.. 2022. 3. 24.
반응형