[웹 개발] 3주차 : Python, 크롤링, mongoDB

hyeonbin·2023년 1월 25일

CSS JavaScript html mongodb python 웹 개발 프론트엔드

웹 개발

목록 보기

5/9

📢 시작 한마디

어느덧 중간까지 왔다!! 시작했으면 끝을 보자!!
노트북 붙잡고 강의 듣고 이것저것 하면 하루.. 아니? 일주일이 금방 간다...

나의 24/7 돌려죠오오오 🥲

✅ 3주차 진행 및 완료 사항

파이썬 기초 문법 알기
원하는 페이지 크롤링 하기
pymongo를 통해 mongoDB 제어 가능

✅ 필수 프로그램 설치

Python 3.8.6 버전 설치
→ 설치할 때 Add Python 3.8 to PATH 체크!
Git bash 다운로드 (윈도우만)

✅ 발생한 문제, 고민 또는 이를 해결한 과정

📌 문제 & 고민

python과 javascript 문법이 비슷한 것 같으면서도 조금 헷갈린다...

🔎 해결

계속 하다보면 익숙해지겠지...?

✅ 오늘 배운 내용

📍 2주차 리마인드

내 생애 최고의 영화들 → 만들어둔 OpenAPI로 포스팅 가져와서 API붙이기

→ 로딩 후 바로 listing() 함수 실행
→ 정의된 listing() 함수에 ajax 콜 넣기
→ API보면 movies를 row로 해서 도니까 rows잘 찍히는지 확인
→ 그 다음 for문으로 돌고, 잘 나오면 temp_html로 카드 붙이기

 $(document).ready(function () {
            listing();
        });

        function listing() {
            $.ajax({
                type: "GET",
                url: "http://spartacodingclub.shop/web/api/movie",
                data: {},
                success: function (response) {
                    let rows = response['movies']
                    for (let i = 0; i < rows.length; i++) {
                        let title = rows[i]['title']
                        let comment = rows[i]['comment']
                        let image = rows[i]['image']
                        let star = rows[i]['star']
                        let desc = rows[i]['desc']

                        let star_image = '⭐'.repeat(star)

                        let temp_html = `<div class="col">
                                            <div class="card">
                                                <img src="${image}"
                                                     class="card-img-top" alt="...">
                                                <div class="card-body">
                                                    <h5 class="card-title">${title}</h5>
                                                    <p class="card-text">${desc}</p>
                                                    <p>${star_image}</p>
                                                    <p class="mycomment">${comment}</p>
                                                </div>
                                            </div>
                                        </div>`
                        $('#cards-box').append(temp_html)
                    }
                }
            });
        }

📍 파이썬 패키지 설치하기

● 패키지? 라이브러리?

Python 에서 패키지는 모듈(일종의 기능들 묶음)을 모아 놓은 단위
이런 패키지의 묶음을 라이브러리 라고 볼 수 있음 
지금 여기서는 외부 라이브러리를 사용하기 위해서 패키지를 설치

즉, 여기서는 패키지 설치 = 외부 라이브러리 설치!

1) 가상환경(virtual environment)이란?
→ 프로젝트별로 패키지들을 담을 공구함 

📌 문제상황 :
회사에서 패키지 A, B, C를 설치해서 쓰고,
개인 프로젝트에서는 패키지 B, C, D, E를 설치해서 쓰고 있는데,
회사팀장님이 B를 이전 버전인 B'로 쓰자고 하면,
같은 컴퓨터에 깔려 있는 개인 프로젝트에서는 B'로 쓰면 코드를 바꿔야 함

🔎 해결책 :
다 담아둘 필요 없이 공구함을 2개 만들어서,
공구함1에 A, B', C를 담아두고,
공구함2에 B, C, D, E를 담아두고 쓰면 관리

그래서, 가상환경이라는 개념이 등장
즉, 프로젝트별 공구함!

📋 가상환경(virtual environment) :
같은 시스템에서 실행되는 다른 파이썬 응용 프로그램들의 동작에 영향을 주지 않기 위해, 
파이썬 배포 패키지들을 설치하거나 업그레이드하는 것을 가능하게 하는 격리된 실행 환경

출처 : 파이썬 공식 용어집- 가상환경

2) pip(python install package)사용
→ 앱을 설치할때 앱스토어/플레이스토어를 가듯, 
새로운 프로젝트의 라이브러리를 가상환경(공구함)에 설치하려면 pip를 이용

● requests 패키지 설치해보기 (윈도우)
파일 - 설정 - 프로젝트:파일명 - requests검색해서 패키지 설치

📍 패키지 사용해보기

Requests 라이브러리 사용해보기
→ 서울시 OpenAPI에서 미세먼지 값 가져오기

http://spartacodingclub.shop/sparta_api/seoulair

1) requests 써보기

import requests # requests 라이브러리 설치 필요

r = requests.get('http://spartacodingclub.shop/sparta_api/seoulair'<)
rjson = r.json()

2) 모든 구의 IDEX_MVL 값 찍어주기

import requests # requests 라이브러리 설치 필요

r = requests.get('http://spartacodingclub.shop/sparta_api/seoulair')
rjson = r.json()

rows = rjson['RealtimeCityAir']['row']

for row in rows:
	print(row['MSRSTE_NM'], row['IDEX_MVL'])

3) IDEX_MVL 값이 60미만인 '구'만 찍어주기

import requests # requests 라이브러리 설치 필요

r = requests.get('http://spartacodingclub.shop/sparta_api/seoulair')
rjson = r.json()

rows = rjson['RealtimeCityAir']['row']

for row in rows:
	if row['IDEX_MVL'] < 60:
		print (row['MSRSTE_NM'])

📍 웹 스크래핑(크롤링) 기초

웹 스크래핑 해보기 (영화 제목)

1) 네이버 영화 페이지

https://movie.naver.com/movie/sdb/rank/rmovie.naver?sel=pnt&date=20230121

2) 패키지 추가 설치하기

일단 크롤링을 하려면,

1) 위 주소에 요청해서 html을 가져오기 - requests
2) 그 안에서 정보를 쉽게 찾게 해주는 라이브러리 - beautifulsoup4 (bs4)

파일 - 설정 - 프로젝트:파일명 - 'bs4'검색해서 패키지 설치

3) 크롤링 기본 세팅

import requests
from bs4 import BeautifulSoup

# 타겟 URL을 읽어서 HTML을 받아오고,
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)

# HTML을 BeautifulSoup이라는 라이브러리를 활용해 검색하기 용이한 상태로 만듦
# soup이라는 변수에 "파싱 용이해진 html"이 담긴 상태가 됨
# 이제 코딩을 통해 필요한 부분을 추출하면 됨
soup = BeautifulSoup(data.text, 'html.parser')

# 코딩 시작

4) select / select_one 사용법 익히기

→ 영화 제목 가져와보기!

항상 정확하지는 않으나, 크롬 개발자도구를 참고할 수도 있음!

● 원하는 부분에서 마우스 오른쪽 클릭 - 검사
● 원하는 태그에서 마우스 오른쪽 클릭
● Copy - Copy selector로 선택자를 복사할 수 있음

→ 태그 안의 텍스트를 찍고 싶을 땐, 태그.text

→ 태그 안의 속성을 찍고 싶을 땐, 태그['속성']

→ 여러 개 select를 이용해서, tr들을 불러오기

movies = soup.select('#old_content > table > tbody > tr')

→ movies(tr들) 반복문 돌리기

for movie in movies:
  # movie 안에 a 가 있으면,
  a_tag = movie.select_one('td.title > div > a')
  if a_tag is not None:
      # a의 text를 찍어보기
      print (a_tag.text)

→ None 제외하고, 제목만 출력

→ beautifulsoup 내 select에 미리 정의된 다른 방법을 알아보자

# 선택자를 사용하는 방법 (copy selector)
soup.select('태그명')
soup.select('.클래스명')
soup.select('#아이디명')

soup.select('상위태그명 > 하위태그명 > 하위태그명')
soup.select('상위태그명.클래스명 > 하위태그명.클래스명')

# 태그와 속성값으로 찾는 방법
soup.select('태그명[속성="값"]')

# 한 개만 가져오고 싶은 경우
soup.select_one('위와 동일')

📍 Quiz_웹스크래핑(크롤링) 연습

순위, 제목, 별점 표시하기
→ 순위 표시

→ 별점 표시

→ 순위, 제목, 별점 표시

📍 DB개괄

DB를 쓰는 이유
- 사실 DB에는 index라는 순서로 데이터들이 정렬 되어 있음
  → 즉, DB 데이터 조회 성능 향상을 위해 사용

DB의 두 가지 종류

✔ RDBNS(SQL)

행/열의 생김새가 정해진 엑셀에 데이터를 저장하는 것과 유사
데이터 50만 개가 적재된 상태에서, 갑자기 중간에 열을 하나 더하기는 어려울 것 
그러나, 정형화되어 있는 만큼, 데이터의 일관성이나 / 분석에 용이

ex) MS-SQL, My-SQL 등

✔ No-SQL

딕셔너리 형태로 데이터를 저장해두는 DB
고로 데이터 하나 하나 마다 같은 값들을 가질 필요가 없음
자유로운 형태의 데이터 적재에 유리한 대신, 일관성이 부족할 수 있음

ex) MongoDB

DB의 실체
- 우리가 쓰는 프로그램과 같은 것
  → 즉, 게임이나 ppt 설치처럼 내 컴퓨터에도 DB를 설치할 수 있음
- 그러나 요새는 Cloud 형태로 제공해주는 곳들이 많음
  → 유저가 몰리거나 / DB를 백업해야 하거나 / 모니터링 하기가 아주 용이
  → 트렌드는 클라우드!
- 최신 클라우드 서비스인 mongoDB Atlas 사용해 볼 것
  → 클라우드 환경에서 mongoDB가 제공해주는 컴퓨터를 빌려다가 쓸 거!

📍 mongoDB 시작하기

mongoDB Atlas

1) mongoDB 사이트
```
https://account.mongodb.com/account/register
```
2) 구글 본인 아이디로 로그인

3) 아래와 같은 화면 나오기

4) 연결 준비하기

5) mongoDB 모든 IP 허용하기

→ 약간의 로딩 후 아래 화면과 같이 0.0.0.0/0이 활성화 되면 완료!

6) Database의 connect 클릭

→ Username, Password 입력
→ Create Database User 클릭

→ mongoDB에서 빌려주는 mongoDB Atlas 컴퓨터를 하나 배정받음
→ 그 컴퓨터에 접속할 수 있는 아이디, 패스워드까지 만듦

📍 mongoDB 연결하기

파이썬으로 DB에 접속하기

1) 패키지 설치하기
```
pymongo, dnspython
```
2) 다시 mongoDB Atlas 화면에서 Connect your application 클릭

3) pymongo로 조작하기
```
✔ pymongo 기본 코드

from pymongo import MongoClient
client = MongoClient('여기에 URL 입력')
db = client.dbsparta
```
4) 잘 연결됐는지 테스트

→ python 파일 하나 만들고, pymongo 기본 코드 붙여넣기
→ 복사한 URL 붙여넣기

→ Username, Password 부분 바꿔주기
→ 아래와 같이 입력

→ 다시 Cluster0의 Collections를 확인하면 데이터가 잘 들어온 것을 알 수 있음

📍 pymongo로 DB조작하기

DB연결하기 & 데이터 넣기
→ 'users'라는 collection에 아래의 내용을 넣기

→ 통상적으로 딕셔너리 하나 만들어주고 넣는 방법
결과 값 보기
→ 모든 데이터 뽑아보기 : find

→ 특정 결과 값 뽑아보기 : find_one
수정하기 : update_one
→ 조건 : 'name'이 'bobby'인 데이터를 찾아서 'age'를 19로 만들기
삭제하기 : delete_one
pymongo 사용법 & 코드요약

※ 저장하고, 찾고, 바꾸고, 지우고!! 4가지 기능 꼭 알기!! ※
 
 # 저장 - 예시
 doc = {'name':'bobby','age':21}
 db.users.insert_one(doc)
 
 # 한 개 찾기 - 예시
 user = db.users.find_one({'name':'bobby'})
 
 # 여러개 찾기 - 예시 ( _id 값은 제외하고 출력)
 all_users = list(db.users.find({},{'_id':False}))
 
 # 바꾸기 - 예시
 db.users.update_one({'name':'bobby'},{'$set':{'age':19}})
 
 # 지우기 - 예시
 db.users.delete_one({'name':'bobby'})