초보개발자_기록

1. 라우터 V5 -> V6로 업데이트되면서 생긴 문제점. 라우터부분 강의를 들으면서 다음과같이 강의 내용대로 코드를 작성하고 실행하였는데 에러가 발생하였음. 저장하고 실행하였더니 다음과같은 에러가 나왔음. 강의내용과 다른부분이 있는지 재차 확인해보았지만 내용은 정확했음. 구글링해보니 버젼이 5에서 6로 업데이트되면서 많은 부분이 변경되었다고 함. 여기서 방법은 두가지임. 에러문구대로 안에 를 작성하여 업데이트 내용대로 따르거나 낮은 버전으로 다운그레이드 해서 하거나. 일단 다운그레이드 하려면 다음과 같이 터미널에 작성. yarn add react-router-dom@5.3.0 버전은 낮은버전 조사해서 작성. 위 명령어를 입력하면 6버전에서 다운그레이드됨. 그리고 정상 작동됨. 혹은 6버전대로 하려면 다..

리액트 2022. 2. 2. 21:58

프로젝트 경로 내에 styled components 설치. 터미넬에 yarn add styled-components 프로젝트 안에 설치해야 dependencies 안에 설치가 됨 설치가 완료되면, js파일에 import 를 해줌. 그리고 styled components 객체를 만들어줌. 난 클래스 밖에 만들어 보았음. 주의점! 반드시 변수명 첫글자는 대문자로! styled.HTML태그`` 백틱 안에 css 코드를 작성할거임. MyStyled라고 만든 객체를 마치 HTML태그처럼 사용. 그리고 매개변수를 넘겨줄 수도 있음. bg_color 라는 변수면에 false라는 값을 넘겨주면, 이런식으로 코드를 작성하는 것도 가능. 주의할 점은 ${(props) => { }} 중괄호를 쓰는 것이 아니라 ${(prop..

리액트 2022. 1. 26. 15:35

html page 나의 첫 웹페이지 GET버튼 POST버튼 app.py from flask import Flask, render_template, request,jsonify app = Flask(__name__) @app.route('/') def home(): return render_template('index.html') @app.route('/test', methods=['GET']) def test_get(): title_receive = request.args.get('title_give') print("get : "+title_receive) return jsonify({'result':'success', 'msg': '이 요청은 GET!'}) @app.route('/test', metho..

파이썬 2022. 1. 25. 18:46

새프로젝트 클릭 '위치'탭에서 제일 오른쪽 폴더모양 누르고 프로젝트 만들고 싶은 위치 선택 후 확인 위치 선택 후, ~~\venv 있는거 확인. main.py 웰컴 스트립트 생성 체크박스 해제 후 [생성]클릭. 프로젝트 생성 후, 파일 -> 설정 클릭 이제 Flask(서버를 만들 수 있는 프레임워크) 패키지 설치해야함. [+] 버튼 클릭 후 Flask 검색 후 설치 패키지 설치 후, 프로젝트에 'app.py' 파이썬파일 생성(통상적으로 app.py 라고 이름 정함). 그리고 다음과 같이 작성. (render_template, request, jsonify 는 ajax로 데이터 주고받으려고 미리 작성한거) 저장하고 실행. 그리고 웹브라우저 실행시켜서 'localhost:5000' 이라 치고 엔터치면 첫 서..

파이썬 2022. 1. 25. 18:13

지니차트에서 랭킹, 음악 타이틀, 가수명 을 크롤링해서 출력하려는 예제 #body-content > div.newest-list ... > tr 까지가 공통이구 이후가 분기점이되어서 나뉘게 됨. 긁어온 데이터는 'allMusic'에 담고 for문을 돌리려고함. 하지만 여기서 문제가 발생. 랭크 숫자만 나오는게 아니라 랭크가 몇단계 상승,하락했다는 문구도 같이 나오게됨. 여기서 이용할 수 있는 것이 [num:num] 이다. 범위를 정해서 글자를 긁어올 수 있는 기능이다. 첫번째 num은 시작index이고 두번째 num은 끝나는 index이다. 랭크가 99위까지 있어서 나는 두글자만 가져오면 되어서 [0:2]로 하였다. 결과는 랭크만 나오는 것은 성공하였으나 1자릿수는 뭔가 공백이 있는지 간격이 넓다. 여기..

파이썬 2022. 1. 25. 15:18

App.js 의 생성자에서 만든 this.state={list:["영화관가기","매일 책읽기","여행가기"]} 를 'BucketList.js' 에 매개변수로 넘겨주고 있다. 그리고 매개변수를 받는 'BucketList.js' 이다 여기서 중요한건 App.js 에서 매개변수를 넘겨줄 때 여기서 'list'라는 이름으로 넘겨주면 받는 쪽에서도 꼭 명칭이 같아야함. 만약에 라고 하면 이 이름에 맞춰줘야함. 그리고 props 가 아니라 다음과 같이도 가능함. 하지만 반드시 중괄호 '{}' 안에 써야함. 그리고 역시 App.js에서 로 보내면 이름을 맞춰줘야함. 그리고 마지막부분에서 div 에 key 값을 넣어주는 부분이 이해가 안갔는데, 배열을 map으로 렌더링하면서 리스트항목에 'key'를 넣지않으면 경고가 ..

리액트 2022. 1. 25. 00:44

리액트 클래스형 컴포넌트를 이용해서 todo 리스트를 만들어 보았다. 우선 [App.js] 파일 코드이다. 다음은 [LifecycleExam.js] 파일이다. css 파일은 생략하고, 이번에 만들어보면서 깨닫게 된 점들을 정리해보겠다. yarn start로 실행을 시키면 제일 상단의 최초화면이 뜨고, 개발자 도구를 열어서 콘솔창을 확인해보면 다음과 같은 순서로 실행된 것을 확인할 수 있다. 컴포넌트 별로 console.log 를 작성하여 흐름을 파악 할 수 있게 하였다. 우선 [생성자]를 먼저 거치고 다음 가장 아래에 작성한 [render]에서 렌더링을 하고 무사히 마운트가 되면 [componentDidMount]까지 오게되며, 여기까지가 리액트 실행시키고 최초의 페이지가 나올때 까지의 흐름이다. 그리고..

리액트 2022. 1. 24. 17:45

지난번에 크롤링을 하면서 영화 제목을 긁어와서 출력했는데, 이번에는 랭킹과 평점도 같이 표시하도록 해보려고함. import requests from bs4 import BeautifulSoup headers = {'User-Agent' : 'Mozilla/5.0 (Windows NT 10.0; Win64; x64)AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.86 Safari/537.36'} data = requests.get('https://movie.naver.com/movie/sdb/rank/rmovie.naver?sel=pnt&date=20210829',headers=headers) soup = BeautifulSoup(data.text, 'h..

파이썬 2022. 1. 22. 17:37