1주차 Day3. Flask를 활용한 웹개발 + Git&Github 사용법

이미지 삽입하기

static 폴더(폴더이름 반드시 static으로!)를 생성하고 그 안에 image 폴더 생성

이미지파일을 (드래그!) static\image 폴더에 담기

이미지 태그를 사용해 연결 <img src="{{ url_for('static', filename='이미지 경로') }}" alt="">

 

• 이미지 크기 조정

.클래스이름{
    height: 100px;
}

<img class="클래스이름" src="{{ url_for('static', filename='image/coinman.png') }}" alt="">

 

• 다른 경로로 접속하면 해당 페이지를 보여주도록 만들기

@app.route('/이름')
def movie():
    return render_template('이름.html')

 

• 검색기능 만들기

<form action="{{ url_for('movie') }}">
  <input type="text" name="query">
  <button type="submit">검색</button>
</form>

from flask import Flask, render_template, request


@app.route('/movie')
def movie():
    print(request.args.get('query'))
    return render_template('movie.html')
    
#form에서 보내준 검색어(데이터)를 받아온다

 

---

 

Git

: 코드 변경점을 기록하는 버전 관리 도구. (소프트웨어의 변경사항을 체계적으로 추적하고 통제하는 것.)

Git 필수명령어
• git init
: VisualstudioCode
• git add 파일명
: 저장할 파일 지정.
• git commit -m "메세지작성"
: 지정된 파일을 저장. 
* please tell me who you are 에러 발생 시
git config --global user.name"사용자이름" 또는 git config --global user.email"이메일" 작성하여 해결.

Github

: 백업과 공유가 가능한 온라인 코드 저장소. 협업 툴!

Github에 코드 백업하는 법
• github repository 생성
•업로드할 프로젝트 폴더를 VSCode로 열기
• github의 ...or push an existing repository ~ 아래의 코드 세줄을 복사하여 VSCode 터미널에 붙여넣기
•추가로 수정된 코드를 github에 반영하기 - git push

추가..
- git status : 저장여부 확인. 저장되지 않은 파일은 붉은색으로 표시.
- git add. : 현재 나의 경로의 모든 변경사항을 한번에 지정.
- git log : 저장 내역을 확인. (키보드 q로 빠져나오고 git diff로 코드변경을 확인. git reset으로 과거로 돌아가기.)