목록혼자하기 (21)
오래 못 할 짓 하지 않기

https://cloud.google.com/free/?utm_source=google&utm_medium=cpc&utm_campaign=japac-KR-all-en-dr-BKWS-all-core-trial-EXA-dr-1605216&utm_content=text-ad-none-none-DEV_c-CRE_668690472449-ADGP_Hybrid+ 이 주소에 가서 API 권한을 받고 그에 대한 access id랑 비밀번호를 받는다. 이 형태에 맞게 넣어두자. 코드 ▼ 더보기 #registration spring.security.oauth2.client.registration.google.client-name=google spring.security.oauth2.client.registration.goo..

https://developers.naver.com/main/ 여기에서 API를 신청해서 access id와 password를 받는다. 받은 뒤에는 properties 파일에서 수정해준다. 2번 줄 : 가져올 서비스 이름 3,4번 줄 : 가져올 때 사용하는 id와 비밀번호 5번 줄 : 응답을 받을 url 6번 줄 : 응답을 받을 형태 7번 줄 : 응답 받을 내용 (아래는 추가 사항) 코드▼ 더보기 #registration spring.security.oauth2.client.registration.naver.client-name=naver spring.security.oauth2.client.registration.naver.client-id= 받은 id spring.security.oauth2.clie..
이제 객체지향 느낌이 남 각 기능별로 쪼개서 그 Property들을 갖다 쓴다. 예를 들어 하나의 함수에 button을 만들어 여러 스타일을 입혀줬다. 또 다른 버튼을 만드는 함수를 만들어서 비슷한 스타일을 넣으려면 하나하나 다 복사해야한다. 만약에 text만 다른데 그렇게 여러 함수를 만들면 오히려 복잡해지므로, button만드는 함수를 만든 뒤에 각각 parameter에 쓸 text를 넣어서 그걸 띄우자. function Btn(props){ // props 말고 {banana}라고 쓰면 바로 그걸 가져옴 console.log(props); return( {props.banana} //그럼 여기에 {banana}만 해도 됨 ) } 이거를 이제 밑에서 각각 띄울 때는 function App() { re..
이전 정리에서 배운 것으로 하면, 우리가 count값을 바꿀 때마다 render를 새로 해주어야한다. 왜냐하면 변수의 값은 변했지만 그 변한 값을 화면에 띄워주진 않았으니 실제로 변한 것을 감지할 수가 없다.(콘솔 열지 않는 이상) 물론, 이벤트가 감지되면 실행되는 함수에 render를 넣으면 되긴하지만, 귀찮다. 따라서 여기에 쓸 수 있는 기능이 있다. const [a, setA] = React.useState(); 이 기능만 설명하면 어떻게 쓰는지는 쉽게 알 수 있을 것 같다. 먼저 React.useState()는 두 개의 값을 배열로 넘겨준다. [ a라는 데이터 ] + [ (setA) a 값을 변화시키기 위한 함수 ] 저 () 가운데에는 a의 초기값을 쓸 수 있다. ● 사용법 띄우고 싶은 A의 값을..
리액트는 HTML을 굳이 생성할 필요없이 [ JS 작성 → HTML이 생성됨 ] 이런 구조이다. 자바 스크립트에서 시작해서, HTML로 끝낸다. 방법 1 자바 스크립트로 HTML들을 생성할 수 있다. = 굳이 HTML 태그들을 하나하나 끄적이면서 만들 필요가 없다. 그러나 위에 id = root 인 div하나 만들어놨음 const root = document.getElementById("root"); const abc = React.createElement("span" ,{ id:"scrub", onMouseEnter: () => console.log("leave me alone") },"hello i'm span"); const btn = React.createElement("button",{ onCl..

Total clicks: 0 click here span = 줄바꿈이 되지 않는 div 이렇게 만들었을 떄 나오는 페이지는 이런 모양이고 버튼을 클릭해도 큰 차이는 없다. 그럼 body태그 뒤, html태그가 끝나는 그 사이에 태그를 추가해서 각각의 요소들에 대한 이벤트 설정을 해주자 // 변수 설정 let counter=0; const button = document.getElementById("btn"); const abc = document.querySelector("span"); // 감지 시에 실행할 함수 function handleClick(){ counter=counter+1; abc.innerText = 'Total clikcs : ' + counter; } // 이벤트 감지 button...

우선 화면에 띄우기 위해서는 2가지가 필요하다. ● DB에 있는 정보를 HTML 과 연동할 수 있는 그릇 ● HTML로 그 그릇을 가져와 쓸 곳 첫 번째 : 연동할 그릇 DB에 넣은 건 저번에 다 끝냈다. 이제 그걸 가져올건데, 그건 Jpa 내장 함수인 findall() 를 사용하면 된다. "(newsService 클래스)" public List newsList(){ return newsRepository.findAll(); } 이렇게 service에 함수를 만들어준 다음 Controller에서 호출하여 사용하는데 @PostMapping("news/result") public String resultOfNews(Model model) throws Exception{ newsService.addContTo..

완성한 항목 : 크롤링 + 원하는 데이터들 뽑아서 가져오기 + 10개만 출력하기 ( + DB에 추가는 아직 못 했음 이따 할 예정 ) public void addContToDB(News news) throws Exception{ String URL = "https://www.yna.co.kr/economy/all?site=navi_economy_depth02"; Document doc = Jsoup.connect(URL).get(); Elements elem = doc.select("div[class=\"news-con\"]"); int i=1; for(Element e:elem.select("div[class=\"news-con\"]")){ System.out.print(i+" 제목: " + e.sel..
크롤링 난 여태껏 크롤링이 진짜 엄청 어려운 거라고 생각했는데 막상 해보니 아주 간단함. 코드가 아닌 원리만 이해하는 방식으로는 레고 전시회라고 생각해보자. ' 레고 전시회에서 A위치에 있는 작품에서 빨간 블록 하나만 빼온다 ' 고 이해하면 편할 것 같다. 현재 내가 이해한 바로는 크롤링은 해당 URL(주소)에서 HTML기반으로 데이터를 가져오는 걸 뜻한다. URL = 위치 A / 데이터 = 빨간 블록 우선 newsService에서 데이터를 다루어야 하니까 content를 가져오는 class를 하나 만들었다. 그리고 jsoup을 디펜던시에 추가하고, import를 했다. 필요한 재료 어느 사이트 URL을 사용할지. public void addContToDB(News news) throws Exceptio..

Entity : DB와 연결하는 클래스 데이터베이스의 테이블에 존재하는 컬럼들을 필드로 가지는 객체 즉, DB에 있는 데이터들을 가져올 수 있음. Entity 파일은 DB에 있는 항목들을 가공할 수 있는 변수로 만들어 역할을 한다. @GeneratedValue(strategy = GenerationType.IDENTITY) 해당 어노테이션은 아래 DB 와 연결해준다. server.port=8091 spring.datasource.driver-class-name=org.mariadb.jdbc.Driver spring.datasource.username=root spring.datasource.password=******* spring.datasource.url=jdbc:mariadb://localhost:..