반응형 IT/React12 [React] axios로 API 호출 및 데이터 받아오기 Axios Axios는 현재 가장 많이 가용되고 있는 자바스크립트 HTTP 클라이언트이다. Axios 라이브러리의 특징은 HTTP 요청을 Promise 기반으로 처리하는 점이다. API 키 발급받기 newapi에서 제공하는 API를 사용하여 최신 뉴스를 불러오자. 먼저 https://newsapi.org/regitser 에 가입하여 api를 발급받는다. 발급받은 API 키는 추후 API 요청시 API 주소의 쿼리 파라미터로 넣어 사용할 수 있기 때문에 따로 기록해둔다. (기본적으로 api 주소에 본인에 해당하는 API 키가 들어있어 필수는 아니다) 한국 뉴스 API를 받기 위해 아래 사이트에 접속한다. https://newsapi.org/s/south-korea-news-api South Korea Ne.. 2021. 8. 15. [React] SPA React의 SPA에 대해 알아보자. SPA SPA란? Single Page Application(싱글 페이지 에플리케이션)의 약자 한 개의 페이지로 이루어진 애플리케이션을 의미 ↔️ 전통적 웹페이지는 여러 페이지로 구성됨 웹 페이지의 과거와 현재 과거 사용자가 다른 페이지로 이동 시 새 html을 받고, 페이지 로딩 마다 서버에서 리소스를 전달받아 해석한 뒤 화면에 출력 사용자에게 보이는 화면은 서버 츠깅 준비 * 사전에 html 파일을 만들어 제공 or 데이터 따라 유동적 html을 생성해주는 템플릿 엔진 사용 불필요한 로딩으로 인해 비효율적 현재 리액트 같은 라이브러리 혹은 프레임워크를 사용, 뷰 렌더링을 사용자의 브라우저가 담당 애플리케이션을 브라우저에 불러와서 실행 후 사용자와의 인터랙션 발생 .. 2021. 8. 8. [React] 컴포넌트 스타일링 자료의 출처는 '엘리스 AI 트랙 2기 (https://aitrack.elice.io/)' 'React 심화', 및 '리액트를 다루는 기술'입니다. React 스타일링 React 앱에서의 스타일링 좋은 앱이란 무엇인가 번들 사이즈에 대한 고려 => CSS 코드가 차지하는 사이즈는 무척 중요한 요소. 앱성능에대한고려 => animation, transition 등 유저와의 상호작용에서 스타일 코드의 성능이 중요 요소 사용자에게 유리한 UI/UX를 고려 => 스타일링에 대한 지식으로, 고급 테크닉을 적용하여 더 나은 UI/UX를 반영 자바스크립트를 이용한 다양한 스타일 기법 => UI 토글링, 애니메이션, 다크모드, 복잡한 UI 컴포넌트 등은 자바스크립트에 대한 지식만으로 구현하기 힘듦. 유지보수가 용이하고.. 2021. 8. 7. 이전 1 2 다음 728x90 반응형
