네이버 지도 API를 신청해서 http://localhost:5000/map 로 뜨도록 설정 @app.route('/map') def test_map(): return render_template("prac_map.html") 위 이미지처럼..만들기... 맛집 정보 DB에 저장하는 코드... from selenium import webdriver from bs4 import BeautifulSoup import time from selenium.common.exceptions import NoSuchElementException from pymongo import MongoClient import requests client = MongoClient('3.35.24.64', 27017, username=..

-request는 단순히 그냥 get 방식으로 요청하고, 돌아온 결과로 이런 저런 활동을 하지만 "셀레니움"은 브라우저를 직접 작동시키는 것(브라우저 제어 프로그램) -크롤링(웹스크래핑!) 복습하기 크롤링이란, 자동화하여 주기적으로 웹 상에서 페이지들을 돌아다니며 분류/색인하고 업데이트된 부분을 찾는 등의 일을 하는 것이고 우리가 하는 것은 웹 스크래핑! -프로젝트03 설정 착착착... 멜론 차트 스크래핑 하는 코드! import requests from bs4 import BeautifulSoup url = "https://www.melon.com/chart/day/index.htm" headers = { 'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x6..

{% for word in words %} {{ word.word }} {{ word.definition }} {% endfor %} 배경과 배너 등 디자인 요소가 겹치므로 CSS 파일을 분리하여 링크로 넣어주면 같은 CSS를 적용해줄 수 있음! static 폴더에 mystyle.css 파일을 만들고 공통 요소에 대한 CSS를 잘라내어 붙여넣는다 배너 이미지는 같은 폴더에 있으니 바꿔주깅 background-image: url('logo_red.png'); index, detail 두 html 파일안에 아래 코드를 넣는다. 의미는 진자 템플릿 언어를 이용해 static 폴더 안에 mystyle.css에 해당하는 url을 만들어줘! ㄹㅏ고 하는 url_for 사용 DB에 저장된 단어 찾아서 HTML에 나타..

@app.route('/detail/') #이 주소로 가면 def detail(keyword): # API에서 단어 뜻 찾아서 결과 보내기 return render_template("detail.html", word=keyword) #detail/ 뒤에 오는 단어를 word로 보냄 Ajax를 보내서 사전 API에서 데이터를 받아오고 HTML에 채워넣는 방법 let word = '{{ word }}' //워드로 들어온 문자열 끼워넣기 $(document).ready(function () { get_definitions() }) function get_definitions() { $.ajax({ type: "GET", url: `https://owlbot.info/api/v4/dictionary/${word..

if (gu_mise >= 40) { let html_temp = `${gu_name}: ${gu_mise}` $("#gu-list").append(html_temp) }​ #Ajax 요청 위해 jquery import 구 : 미세먼지 로 리스트 만들기 function get_list() { $.ajax({ type: "GET", url: "http://openapi.seoul.go.kr:8088/6d4d776b466c656533356a4b4b5872/json/RealtimeCityAir/1/99", data: {}, success: function (response) { let rows = response["RealtimeCityAir"]["row"]; console.log(rows) $("gu-lis..

동적 웹페이지의 종류 Client-side rendering (CSR) : 자바스크립트에 데이터를 포함해서 보낸 후, 클라이언트 쪽에서 HTML을 완성하는 방법 Server-side rendering (SSR) : 서버 쪽에서 템플릿 HTML에 데이터를 끼워넣어 완성된 형태의 HTML을 보내주는 방법 플라스크에서 SSR을 사용하는 방법 -> Jinja! '템플릿'이 되는 HTML 문서에 데이터가 들어갈 곳을 표시해놓는 역할 API 키 Open API라도 너무 많은 요청을 보내는 등의 악용을 방지하기 위해, API 키를 배부 받아 요청 시에 같이 보내줌 1) 플라스크 서버에서 API로 요청을 보낼 때, 2) 클라이언트에서 API로 요청을 보낼 때 페이지끼리 서로 연결하기 -index.html 메인 페이지 ..

사진 넣기 기능 라이브러리 아래에 안에 $(document).ready(function () { bsCustomFileInput.init() listing() }) 서버에 @app.route('/diary', methods=['POST']) def save_diary(): title_receive = request.form['title_give'] content_receive = request.form['content_give'] file = request.files["file_give"] save_to = 'static/mypicture.jpg' file.save(save_to) doc = { 'title': title_receive, 'content': content_receive } db.diary..

3일간의 연휴 끝에, 팀원 모두가 각자 생각해온 2차 프로젝트 기능 취합! 아래와 같다. 기능 1 - 초기화면 (국내/국외) - 검색(국가or지방(아이콘 표시) / 예산(볼륨) / 내용 검색) - 카드박스 위 : 예산안 통계 바 / 지출 비용 아래 : 제목/좋아요 개수/days - 구인 커뮤니티는 본인 인증 후 가능 - 로그인 모달창 - 메뉴 고정 - 해쉬태그 별 카드박스 -> 사진뭉텅이 슬라이드(속도 낮게) main.html -> -최상단 : 아이디(로그인/회원가입) / 설정 / 마이페이지 -상단 메뉴바 1) 사이트 소개/이용 방법/FAQ(자주 묻는 질문) 메뉴바 2) 정보 공유 메뉴바 3) 커뮤니티 - detail.html -> 왼쪽 상단 사진 위 : 게시글 작성 날짜 오른쪽 상단 메뉴바 1) Bud..