React
-
Data 가져오기 (useSWR)React 2023. 1. 23. 10:53
data 가져오기 (fetch, useState) import useSWR from "swr"; function Profile() { const { data, error, isLoading } = useSWR("/api/user", fetcher, options); if (error) return failed to load; if (!data) return loading...; return data is {data}; } fetcher는 데이터를 반환하는 어떠한 비동기 함수도 될 수 있다. 네이티브 fetch 또는 Axios와 같은 도구를 사용할 수 있다. const fetcher = (...args) => fetch(...args).then(res => res.json()); const axios1 =..
-
Data 가져오기 (fetch, useState, useEffect)React 2023. 1. 23. 10:43
json 등의 data 가져오기 Data 가져오기 (useSWR) import { useState, useEffect } from 'react' function Profile() { const [data, setData] = useState(null) const [isLoading, setLoading] = useState(false) useEffect(() => { setLoading(true) fetch('/api/profile-data') .then((res) => res.json()) .then((data) => { setData(data) setLoading(false) }) }, []) if (isLoading) return Loading... if (!data) return No profil..
-
react-iconsReact 2022. 12. 23. 19:37
사용할 아이콘 찾기 https://react-icons.github.io/react-icons/search?q=gomail React Icons 🔍 SearchPlease enter at least 3 characters to search... react-icons.github.io react-icons설치 npm install react-icons 사용예제 import {GoMail} from "react-icons/go" export default function App1() { return ( hello world h1 asdf ); }
-
React 에서 서버와 연동React 2022. 11. 25. 13:22
https://create-react-app.dev/docs/proxying-api-requests-in-development/ Proxying API Requests in Development | Create React App Note: this feature is available with react-scripts@0.2.3 and higher. create-react-app.dev AJAX and APIs https://reactjs.org/docs/faq-ajax.html fetch("https://api.example.com/items") .then(res => res.json()) .then( (result) => { this.setState({ isLoaded: true, items: res..