https://www.youtube.com/watch?v=0LqxqB9cvUA&list=PLmv2d328i1Q4ZK_7XQYB5SeMqNA4q_Ptq&index=1&t=0s 해당 글은 위 영상을 토대로 내용을 정리하였습니다. 비전공자도 쉽게 이해할 수 있도록 다양한 예시와 함께 설명 되었으니 참고하시면 좋을 것 같습니다. 1. 클라우드 컴퓨팅이란 무엇인가? 클라우드 컴퓨팅은 네이버 클라우드, i Cloud 같이 나의 데이터를 내가 관리하는 것이 아닌 다른 곳에다가 관리하는 것을 말한다. 즉, 클라우드가 제공하는 IT 리소스가 존재하며, 이에는 CPU, RAM, 네트워크 등등이 있다. 우리가 그린카나 쏘카를 사용하면 필요한 만큼 차를 대여하여 사용할 수 있는데 클라우드 또한 비슷한 사업구조로 되어있다. 2..
1. 최종 완성 (2022.07.06 ~ 2022.07.24) 본문의 Value 표와 Nation 표를 Flexbox로 만든뒤 위치를 Center로 지정하여 좌우 공백을 주었다. 기존의 디자인은 화면이 꽉차서 불필요한 공백이 많았던 것에 비해 표의 데이터가 알맞게 들어가 있다. 입력한 숫자, 선택한 포지션(ALL,GK,DF,MF,FW)에 따라 헤더의 내용이 변경된다. (Flask의 Jinja 템플릿 사용) 2. 아쉬운 점 파이썬과 플라스크의 클론코딩 경험을 기반으로 진행해 본 첫 프로젝트였으나 많이 부족한 부분들이 많았다. 먼저 PC를 중점으로 개발을 하였기에 모바일 화면에서는 화면이 잘리거나 정렬이 안되는 문제가 발생하였다. 이후 진행할 프로젝트는 모바일 웹 앱을 기반으로 진행할 예정이어서 이 부분을 ..
1. 결과표 본문(헤더, 색상, 글꼴) 디자인 변경 해당 디자인은 https://www.futbin.com/ 사이트를 참고하여 디자인하였다. (축구 관련 컨셉에 맞는 깔끔한 디자인을 선호하였는데 이에 적합하였다고 판단) 글꼴 및 색상 또한 해당 사이트를 검사하여 사용하였다. 색상 코드 : #55cca2, 글꼴 : Poppins 헤더 css에 box-shadow 속성을 추가하여 헤더와 본문의 구분이 자연스럽도록 하였다. 2. 크롤링 파일 객체지향 코드로 변경 기존의 크롤링 파일은 객체지향 방식의 코드가 아니라 각각의 변수들을 관리하기가 어려웠다. 입력 숫자, 정렬 포지션, 정렬 타입을 멤버 변수로 하여 크롤링 객체의 여러 함수들이 접근할 수 있도록 하였다. 그 결과 함수들의 중복되거나 코드가 긴 부분들을 ..
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..
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..
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..