본문 바로가기

분류 전체보기

(122)
웹개발 종합반 4주차 개발일지1 4주차 목표 Flask 프레임워크를 사용해서 API를 만들 수 있다. 화성에 땅사기 API를 만들고 클라이언트에 연결한다. 스파르타피디아 API를 만들고 클아이언트와 연결한다. Flask를 시작해보자 - 서버 만들기 Flask란 무엇일까? 서버를 구동시켜주는 편한 코드 모음 패키지 서버를 구동하려면 필요한 복잡한 일들을 쉽게 사용할 수 있다 밀키트? 라고 생각하면 되겠다 Flask 패키지를 설치한다. app.py파일을 만들어서 코드를 작성한다. from flask import Flask app = Flask(__name__) @app.route('/') def home(): return 'This is Home!' if __name__ == '__main__': app.run('0.0.0.0',port=..
웹개발 종합반 3주차 개발일지3 3주차 목표 1. 파이썬 기초 문법을 안다. 2. 원하는 페이지를 크롤링 할 수 있다. 3. pymongo를 통해 mongoDB를 제어할 수 있다. 데이터베이스는 왜 쓸까? 2가지의 이유이다 잘 넣어두기 위해, 잘 찾기 위해 나는 잘 찾는게 더 중요하다고 생각한다 데이터베이스는 2가지가 있다 RDBMS(SQL) 행/열의 생김새가 정해진 엑셀에 데이터를 저장하는 것과 유사하다 많은양의 데이터에서 중간에 데이터를 더하기는 어렵지만 정형호가 되어있어 데이터의 일관성이나 분석에 좋다 No-SQL 딕셔너리 형태로 데이터를 저장해두는 DB 데이터 하나하나 마다 같은 값들을 가질 필요가 없다 자유롭게 데이터를 적재할때 유리하지만 일관성이 부족하다 서로 다른 장점을 가지고 있으니 뭐가 좋냐 보다는 필요에 따라 선택하자..
웹개발 종합반 3주차 개발일지2 3주차 목표 1. 파이썬 기초 문법을 안다. 2. 원하는 페이지를 크롤링 할 수 있다. 3. pymongo를 통해 mongoDB를 제어할 수 있다. 웹스크래핑(크롤링) 기초 bs4(beautifulsoup4)패키지를 사용해야한다 패키지를 설치하고 사용한다 크롤링 기본 세팅 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://m..
웹개발 종합반 3주차 개발일지1 이번 주차 목표 1. 파이썬 기초 문법을 안다. 2. 원하는 페이지를 크롤링 할 수 있다. 3. pymongo를 통해서 mongoDB를 제어할 수 있다. 파이썬 기초는 학습이 되어있어서 넘어간다 파이썬 패키지 설치하기 파이썬 패키지란 무엇일까? 패키지는 모듈(일종의 기능들 묶음)을 모아 놓은 단위 외부 라이브러리를 사용하기 위해 가상환경(virtual environment) 이란? 프로젝트별로 패키지들을 담을 그릇이라고 생각하면 됨 pip사용 gitbash에서 pip명령어를 이용해서 설치할 수 있지만 이번에는 파이참을 이용해 쉽게 설치를 해본다 파일 -> 설정을 누른다 손쉽게 필요한 패키지를 설치할 수 있다 패키지를 사용해보자 Requests 라이브러리 사용하기 import requests # reque..
웹개발 종합반 2주차 개발일지2 Ajax를 사용해보자 서버 -> 클라이언트 통신 이해하기 서울시 OpenAPI 접속해보기 http://openapi.seoul.go.kr:8088/6d4d776b466c656533356a4b4b5872/json/RealtimeCityAir/1/99 난잡하게 표시되어 있는 JSON을 크롬 익스텐션 JSONView를 이용해서 보기 쉽게 했다 https://chrome.google.com/webstore/detail/jsonview/chklaanhfefbnpoihckbnefhakgolnmc?hl=ko JSON은 key, Value로 이루고 있다 자료형 딕셔너리와 비슷하다 클라이언트 -> 서버 통신 이해하기 GET방식과 POST방식 2가지가 있다 * GET → 통상적으로! 데이터 조회(Read)를 요청할 때 예..
웹개발 종합반 2주차 개발일지1 2주차의 목표는 Javascript 문법 익숙해지기 jQuery로 HTML 간단하게 조작해보기 Ajax로 서버 API에 데이터를 주고, 결과를 받아본다 jQuery란 무엇인가? HTML의 요소들을 조작하는 Javascript를 미리 작성해 편리하게 사용할 수 있는 라이브러리 코드를 비교해보겠다 /*Javascript*/ document.getElementById("element").style.display = "none"; /*jQuery*/ $('#element').hide(); jQuery를 사용하려면? 헤드 태그 사이에 작성한다 jQuery를 사용해보기 input value값 가져오기 입력하기 영화URL // 크롬 개발자도구 콘솔창에서 쳐보기 // id 값이 url인 곳을 가리키고, val()로 값..
웹개발 종합반 1주차 개발일지3 부트스트랩과 Javascript 맛보기 부트스트랩이 뭘까? 개발일지1에서 CSS를 잘한다고 이쁘게 꾸밀 수 없다고 했다 꾸미는건 미적 감각의 영역이다 CSS를 잘 다루지만 미적 감각이 부족한 나에게는 좋은 기술이다 이쁘게 꾸며둔 템플릿을 가져다가 사용하는게 부트스트랩이다. 부트스트랩의 시작 템플릿이다. 이걸로 시작해보죠! 부트스트랩 컴포넌트 5.0 여기를 가면 필요한 기능별로 가져다 사용 가능하다 https://getbootstrap.com/docs/5.0/components/buttons/ 중앙 정렬의 꿀팁 4개는 함께 다니면서 flex-direction: row이면 가로로 나열하며 정렬한다 display: flex; flex-direction: column; align-items: center; ju..
웹개발 종합반 1주차 개발일지2 웹폰트 입히기, 주석, CSS의 파일을 분리해서 관리하는 법을 학습했다. 구글웹폰트: https://fonts.google.com/?subset=korean Google Fonts Making the web more beautiful, fast, and open through great typography fonts.google.com 마음에 드는 폰트를 선택하고 안내해주는 링크와 font-family를 아래처럼 적용한다. /* CSS에 이 부분을 추가하면 완성! */ * { font-family: 'Jua', sans-serif; } 주석을 왜 사용할까? 코드를 임시로 작동하지 못하게 하고 싶을 때 사용하고 사용하는 코드의 설명을 붙여 유지보수가 좋게 만들기 위해 사용한다. ctrl + /를 하면 주석..