Frontend

[React-Hooks] React Hooks - useInput

* useInput useInput은 기본적으로 input을 업데이트 한다. useInput은 initialValue(초기값)를 parameter로 받는다. const useInput = (initialValue) => { const [value, setValue] = useState(initialValue); } * useInput을 이용하여 값 지정 하기 const useInput = (initialValue) => { const [value, setValue] = useState(initialValue); return { value }; } const App = () => { const name = useInput("Hyeonwoo"); return ( Hello ); }; useInput은 ini..

[HTML] Web 클론코딩 (style-box)

* 사용한 기술 HTML SCSS * https://paint-box.com/ 해당사이트를 참고하여서 의류 쇼핑물 사이트를 만들 예정이다. * 해당사이트의 웹구성은 언제든지 바뀔수도 있으니 참고 * HTML과 SCSS를 이용하여 레이아웃과 스타일만 적용 예정 * HTML, SCSS연습에 목적을 두고있다. [사진출처] * https://unsplash.com/ [font] https://fonts.google.com/specimen/Montserrat https://fonts.google.com/specimen/Caladea * header 구성 * index.html Nail Studios Shop Polish Journal * _titles.scss %miniTitle { font-family: 'Mo..

[JavaScript] JavaScript를 이용한 Web crawling

JavaScript를 이용하여서 멜론 TOP100 리스트 Crawling하기 * 개발환경셋팅 vscode node * node package셋팅해주기 npm install --save axiox CDN을 이용하여도 된다. npm install cheerio * package에 대한 간략한 설명 axiox : http request를 조금 더 쉽게 보낼 수 있게 도와주는 패키지 cheerio : 가져온 html을 조금 더 쉽게 가공할 수 있게 해주는 패키지 // 모듈 가져오기 const axios = require('axios'); const cheerio = require('cheerio'); axios, cheerio모듈을 가져와준다. function melonCrawler() { const URL =..