coding59 객체를 쿼리 스트링으로 인코딩하기 들어가기 객체를 Object.entries()와 map()을 사용해 쿼리 스트링으로 인코딩하기. let params = {lat: 45, lng: 6, alt: 1000}; let queryString = Object.entries(params).map(p => encodeURIComponent(p[0])) + '=' + encodeURIComponent(p[1])).join('&') //=> queryString is "lat=45&lng=6*alt=1000" params를 entries하면 키-값을 배열에 담는다. [['lat', 45], ['lng', 6], ['alt', 1000]] 그리고 map()을 통해 각 배열에 접근한다음 원하는 데이터로 가공함. 구조분해를 이용해서 이렇게 표현 할 수 있음.. 2021. 10. 17. BrowserRoute, Switch, Route의 역할 (react-route-dom) 들어가기 `react-route-dom`의 주요 컴포넌트를 자세히 알아보자! 리액트 라우터에는 3개 주요 컴포넌트가 있습니다.: 라우터 컴포넌트 라우트 일치 컴포넌트 네비게이션 컴포넌트 그리고 리액트 라우터를 시작하려면, 이 순서를 지켜주어야 합니다.: 라우트 컴포넌트(루트) > 라우트 일치 > 네비게이션 라우트 컴포넌트 라우트의 핵심구성 요소로 이랑 가 있는데, 차이점은 URL 방식과 서버를 통신하느냐의 차이입니다. BrowserRouter: 일반 URL 경로를 사용하며 해당 경로마다 서버를 올바르게 구성해줘야합니다. HashRouter: URL의 해시 부분에 현재위치를 저장합니다. 서버로 전송되지 않아서 서버 구성이 필요하지 않습니다. 라우터를 이용하려면 최상위 레벨(=루트)에서 최상위 요소를 래핑해.. 2021. 10. 17. 섭씨 온도를 화씨 온도 단위로 나타내기 let celsius = [-15, -5, 0, 10, 16, 20, 24,32]; let fahrenheit = celsius.map(c => c * 1.8 + 32); //=> fahrenheit is [5, 23, 32, 50, 60.8, 68, 75.2, 89.6] 2021. 10. 14. SWR로 로그인 처리해보기 들어가기 로그인이 성공되었다. 그럼 백엔드 서버에서 로그인한 유저의 정보를 프론트로 보내주는데, 프론트 입장에서는 이 정보를 담아야 하는데 전역적으로 어떻게 담을 것인가? 1. 리덕스 2. Context API 3. SWR (v) 4. 그래프큐엘 makeVar 등등... 오늘은 3번째 방법으로 로그인 처리를 간단하게 구현해보고, 컴포넌트를 넘나들며 전역적으로 상태관리를 해보는 방법을 알아보자. SWR? HTTP RFC 5861에 의해 알려진 HTTP 캐시 무효 전략인 stale-while-revaslidate에서 유래된 것으로 먼저 캐시로 부터 데이터를 반환한 후에 fetch 요청을 하고 최정적으로 최신화된 데이터를 가져오는 전략인 즉, 데이터를 가져오기 위한 react hooks. 그리고 다른 탭에서 .. 2021. 10. 7. 이전 1 ··· 5 6 7 8 9 10 11 ··· 15 다음
섭씨 온도를 화씨 온도 단위로 나타내기
let celsius = [-15, -5, 0, 10, 16, 20, 24,32]; let fahrenheit = celsius.map(c => c * 1.8 + 32); //=> fahrenheit is [5, 23, 32, 50, 60.8, 68, 75.2, 89.6]
2021. 10. 14.
