본문 바로가기
반응형
[JavaScript] Axios 사용하기(feat.CDN, Webpack) axios는 자바스크립트에서 사용하는 promise 기반 HTTP 클라이언트 라이브러리이다. 브라우저와 node.js 환경에서 모두 사용 가능하며, XMLHttpRequests와 node.js의 http 모듈을 사용하여 HTTP 요청을 처리한다. XHR 객체를 사용하기 때문에 브라우저 호환성이 좋고, 더 다양한 설정을 지원하기 때문에 요청에 대한 세밀한 제어가 가능하다. 다양한 HTTP 메서드(GET, POST, PUT, DELETE 등)뿐만 아니라 요청과 응답 데이터의 자동 직렬화와 역직렬화를 지원한다.(기본적으로 객체를 'JSON'으로 직렬화한다.) 이렇게 다양한 기능으로 인해 axios는 많은 프로젝트에서 HTTP 클라이언트 라이브러리로 사용된다. 그럼 이제 자바스크립트에서 axios를 어떻게 다운.. 2023. 4. 5.
Node.js에서 스크래핑을 해보자 웹 스크래핑(크롤링) 하기 원본 URL의 콘텐츠를 스크래핑(크롤링)해서 상세 페이지를 구현할 일이 생겼다. 구글링과 여러 삽질 끝에 결국 성공했다. 직접 코드를 작성 해보면서 테스트 하는 것도 빠르고 좋은 방법인 것 같다. 시작 하기전 원본 URL의 HTML을 가져올 때 사용하는 라이브러리와 그 결과로 원하는 콘텐츠를 뽑아서 사용할 라이브러리 설치가 필요하다. 나같은 경우 브라우저와 Node.js 환경에서 둘 다 사용이 가능한 axios와 비교적 예제도 많고 문법이 익숙한 cheerio를 선택했다. axios 외엔 request cheerio 외엔 puppeteer, playwright 등이 있다. 설치하기 npm i cheerio axios 가져올 콘텐츠 정하기 예시로 CSR과 SSR 이해하기 글의 콘.. 2021. 10. 29.
[React.js] 유튜브를 만들어 보자 리액트로 만든 BYTube 🧑🏻‍💻 👉 BYtube 사용한 기술들 🛠 React.js JavaScript HTML CSS Node.js Yarn PostCSS Postman Netlify BYTube 프로젝트는 💭 함수형 컴포넌트 사용 Hooks를 통해 렌더링 최적화, 동적인 페이지 구현 유튜브의 search, videos, channels API 사용 Postman을 통해 API 통신 테스트 및 fetch 코드 활용 API를 불러오는 통신(service)과 View 컴포넌트 분리 API Key를 숨기기 위해 .env 파일 사용 PostCSS로 CSS 스타일링 모듈화 링크 공유 시 지인을 안심 시키기 위한 썸네일 추가 검색 기능 PC 화면에 최적화 프로젝트를 진행하면서 배운 것들 💡 1. View 컴포넌.. 2021. 4. 30.
반응형