본문 바로가기

html24

[Web] Flask 서버구현 - ( week 4 ) 서버를 구현하기 위해 사용할 프레임워크이다. 이 프레임워크를 사용하는 데는 몇 가지 규칙이 있다. 파일구조 Flask 프레임워크를 사용하기 위해서는 다음과 같은 폴더의 계층 구조를 필요로 한다. prac 폴더 구조 - - - prac |— venv |— app.py (서버) |— templates |— index.html (클라이언트 파일) 파일이름 templates 폴더의 이름은 반드시 고정적으로 사용해야 한다. 일반적으로 앱을 실행시킬 때 가장 기본이 되는 파일의 이름은 app.py를 많이 사용한다. 프로젝트 세팅 우선 프로젝트를 생성할 폴더로 이동해서 VSCode로 열어준다. 그리고 app.py파일을 생성하고 가상환경을 설정해 준다. 가상환경 설정 python -m venv venv 해당 명령어의 .. 2023. 4. 24.
[Web] 데이터베이스 - ( week 3 ) Database 데이터베이스는 정보를 저장할 수 있는 공간이다. 중요한 것은 정보를 쌓아두는 것만이 아니라 이후에 다시 꺼내서 사용하기 위함이므로 정리해서 넣어 놓는 것이 중요하다. DB는 크게 두 가지로 분류된다. SQL RDB(Relational Database) 관계형 데이터베이스 행과 열의 생김새가 정해진 엑셀에 데이터를 저장하는 방식이다. 데이터가 많아질수록 도중에 데이터를 추가하는것은 어렵지만 정형화된 구조이기 때문에 데이터의 일관성이 유지되고 분석에 용이하다. 이러한 기능을 쉽게 접근하고 사용할 수 있도록 지원해 주는 프로그램을 RDBMS라고 한다. RDBMS : Relational Database Management System 흔히 알고있는 Oracle, MS-SQL, My-SQL 등이 .. 2023. 4. 20.
[Web] 복습 ( week - 3) API를 호출하고 데이터를 가공해 브라우저에 나타내본다. html은 저번에 만들었던 것을 사용한다. 사용할 API fetch("http://spartacodingclub.shop/web/api/movie").then(res => res.json()).then(data => { let rows = data['movies'] $('#cards').empty() rows.forEach((a) => { let comment = a['comment'] let desc = a['desc'] let image = a['image'] let star = a['star'] let title = a['title'] let temp_html = ` ${title} ${desc} ⭐⭐⭐ ${comment} ` $('#card.. 2023. 4. 19.
[Web] 과제) 서울 날씨 API 적용시키기 - ( week 2 ) 이전에 만든 html을 베이스로 서울 날씨 API를 불러와서 데이터를 브라우저에 나타내본다. 서울 날씨 API 준비 API를 열어서 데이터를 살펴본다. 여기서 temp 데이터를 가져다 쓰면 될 것 같다. 날씨 정보 같은 경우 클릭 이벤트가 발생할 때 html이 생성되는 게 아니라 브라우저가 열릴 때 자동으로 실행되어야 한다. 이 기능을 해주는 함수가 있다. $(document).ready(function () { }) 간단하게 temp 값을 가져다가 해당 태그에 값을 넣어주면 된다. $(document).ready(function () { fetch("http://spartacodingclub.shop/sparta_api/weather/seoul").then(res => res.json()).then(d.. 2023. 4. 19.