축구선수 몸값 분석 웹 크롤링 (12) - 최종 완성본

1. 최종 완성 (2022.07.06 ~ 2022.07.24) 본문의 Value 표와 Nation 표를 Flexbox로 만든뒤 위치를 Center로 지정하여 좌우 공백을 주었다. 기존의 디자인은 화면이 꽉차서 불필요한 공백이 많았던 것에 비해 표의 데이터가 알맞게 들어가 있다. 입력한 숫자, 선택한 포지션(ALL,GK,DF,MF,FW)에 따라 헤더의 내용이 변경된다. (Flask의 Jinja 템플릿 사용) 2. 아쉬운 점 파이썬과 플라스크의 클론코딩 경험을 기반으로 진행해 본 첫 프로젝트였으나 많이 부족한 부분들이 많았다. 먼저 PC를 중점으로 개발을 하였기에 모바일 화면에서는 화면이 잘리거나 정렬이 안되는 문제가 발생하였다. 이후 진행할 프로젝트는 모바일 웹 앱을 기반으로 진행할 예정이어서 이 부분을 ..

• format_list_bulleted 사이드 프로젝트/축구선수 몸값 웹 크롤링
• · 2022. 7. 24.
• textsms

축구선수 몸값 분석 웹 크롤링 (11) - 헤더 및 디자인 꾸미기, 객체지향 코드로 변경

1. 결과표 본문(헤더, 색상, 글꼴) 디자인 변경 해당 디자인은 https://www.futbin.com/ 사이트를 참고하여 디자인하였다. (축구 관련 컨셉에 맞는 깔끔한 디자인을 선호하였는데 이에 적합하였다고 판단) 글꼴 및 색상 또한 해당 사이트를 검사하여 사용하였다. 색상 코드 : #55cca2, 글꼴 : Poppins 헤더 css에 box-shadow 속성을 추가하여 헤더와 본문의 구분이 자연스럽도록 하였다. 2. 크롤링 파일 객체지향 코드로 변경 기존의 크롤링 파일은 객체지향 방식의 코드가 아니라 각각의 변수들을 관리하기가 어려웠다. 입력 숫자, 정렬 포지션, 정렬 타입을 멤버 변수로 하여 크롤링 객체의 여러 함수들이 접근할 수 있도록 하였다. 그 결과 함수들의 중복되거나 코드가 긴 부분들을 ..

• format_list_bulleted 사이드 프로젝트/축구선수 몸값 웹 크롤링
• · 2022. 7. 21.
• textsms

축구선수 몸값 분석 웹 크롤링 (10) - 나이순 정렬 기능, 알림 창(JS) 추가

1. 나이 순 정렬 기능 추가 나이 순 정렬 기준(Sort) 항목을 추가하여 입력 값을 추가로 받게 되었다. 기본 값은 가격 순으로 정렬되며, 나이를 기준으로 내림차순, 오름차순 정렬을 추가하였다. 입력 받은 문자열을 오름차순, 내림차순 조건에 맞는 함수를 사용해서 데이터 프레임을 정렬하였다. Sort Value Age ↓(descending) Age ↑(ascending) 2. List Number 입력 안 할 시에 알림 창 띄우기 function required(){ var empt = document.forms["Form"]["listNum"].value; if (empt == "") { alert("Please input number"); return false; } return true; } S..

• format_list_bulleted 사이드 프로젝트/축구선수 몸값 웹 크롤링
• · 2022. 7. 19.
• textsms

축구선수 몸값 분석 웹 크롤링 (9) - 결과표 html 템플릿 만들기

1. HTML 템플릿 추가 기존의 크롤링 결과를 단순이 표만 달랑 보여주는 것이 아니라 실제 하나의 페이지처럼 보이게 해야 했다. 즉, 크롤링 결과를 html의 정해진 구역안에만 표시되게끔 할 방법이 필요했다. 이를 위해 Flask에서 지원하는 Jinja 템플릿을 사용하면 백엔드의 데이터를 가져올 수 있다. Transfermarkt Player List {{ df_html | safe }} {{ nf_html | safe }} from flask import Flask, render_template, request import pandas as pd import transfermarkt app = Flask(__name__, static_url_path='/static') @app.route('/') d..

• format_list_bulleted 사이드 프로젝트/축구선수 몸값 웹 크롤링
• · 2022. 7. 18.
• textsms

축구선수 몸값 분석 웹 크롤링 (8) - 선택 항목 추가 및 실행시간 단축

1. 실행시간 단축 기존의 크롤링 파일에서 입력한 만큼 선수 리스트를 작성하는 데 있어서 불필요하게 시간을 잡아먹는 부분이 있었다. 페이지 당 25명의 선수를 보여주므로 68명의 선수를 보고 싶을 땐 3페이지까지 총 75명의 선수를 크롤링 했었다. 이 때 75명의 모든 정보를 크롤링한 뒤 가공하고 슬라이싱을 거쳤는데, 그 전에 슬라이싱하는 방법을 선택했다. r = requests.get(url, headers=headers) soup = BeautifulSoup(r.text, 'html.parser') player_info = soup.find_all('tr', class_ = ['odd','even']) for info in player_info: player = info.find_all("td") n..

• format_list_bulleted 사이드 프로젝트/축구선수 몸값 웹 크롤링
• · 2022. 7. 14.
• textsms

축구선수 몸값 분석 웹 크롤링 (7) - 선수 국적 정보 출력

1. index 배경화면 변경 CSS 사진 경로 설정 주의 CSS의 background-size 속성을 cover로 하면 화면 비율에 꽉 차고 반응형에 적합하다. 2. 판다스 Groupby 데이터 출력 from tokenize import group from bs4 import BeautifulSoup import requests import pandas as pd import time from math import ceil def show_valueList(list_num, typeList): list_num = int(list_num) url = "https://www.transfermarkt.com/" headers = {'User-Agent' : "Mozilla/5.0 (Windows NT 10...

• format_list_bulleted 사이드 프로젝트/축구선수 몸값 웹 크롤링
• · 2022. 7. 13.
• textsms