TIL#07 생활코딩 Python 18~22강 글목록 구현,form,수정,삭제

 

 

 

 

18강 (활용)- 반복문을 이용해 글목록 구현

 

 

변경사항

 

 

os.listdir(path)

os라고 하는 것은 모듈이라는 것이다.
listdir이라고 하는 함수에 path값을 주면
주어진 path에 해당되는 디렉토리 안에 있는 목록의 이름들을 담은 리스트(list)를 리턴한다.

import cgi, os #임포트 뒤에 os라고 하는 명령어들이 묶여 있는 모듈을 쓰겠다고 한 것이다.

files = os.listdir('data')
print(files) # [ 'CSS','HTML','JavaScript'] #현재 data 디렉토리에 있는 파일 목록이 들어가 있다.

 

 

 

 

files = os.listdir('data')
listStr = ''
for item in files:
    listStr = listStr + item #기존의 값 + item
    
print(listStr) # CSSHTMLJavaScript

print(listStr) # CSSHTMLJavaScript 반복문에 의해서 첫번째엔 비어있는 문자열에 CSS가 더해지고 
                                            그 다음에 CSS에 HTML이 더해지고 마지막에 JavaScript가 더해지는 것.

 

 

 

 

files = os.listdir('data')
listStr = ''
for item in files:
    listStr = listStr + '<li><a href="index.py?id={name}">{name}</a></li>'.format(name=item)

print(listStr)

·CSS
·HTML
·JavaScript

 

 

 

 

files = os.listdir('data')
listStr = ''
for item in files:
    listStr = listStr + '<li><a href="index.py?id={name}">{name}</a></li>'.format(name=item)

form = cgi.FieldStorage()
if 'id' in form:
    pageId = form["id"].value
    description = open('data/'+pageId, 'r').read()
else:
    pageId = 'Welcome'
    description = 'Hello, web'
.
.
.
    {listStr}
  </ol>
  <h2>{title}</h2>
  <p>{desc}</p>
</body>
</html>
'''.format(title=pageId, desc=description, listStr=listStr))

이렇게 되면 이제 파이썬에 대한 컨텐츠를 만들 때

더 이상 index.py라는 파이썬 프로그램을 수정할 필요없이 

그냥 data 디렉토리 안에다가 파일을 만들고 그 안에 내용을 추가한 다음에 
웹페이지를 새로고침하면 프로그래밍적으로 리스트가 만들어지고 내용도 정상적으로 표시되는걸
확인 할 수 있다.

 

이제 우리는 index.py파일 하나로 모든 웹페이지의 포맷을 컨트롤 할 수 있게 되었고 
단지 파일을 추가하는 걸 통해서 컨텐츠를 추가할 수 있게 되었다.

 

 

 

 

 

 

 

19강 (활용)- Form

 

 

변경사항

 

 

지금까지 우리의 웹 어플리케이션은 컨텐츠를 그 사이트의 소유자가 데이터라는 디렉토리에
파일을 추가하는 것을 통해서 컨텐츠를 생산했다.

이렇게 되면 어떤 한계가 있냐면 컨텐츠 소유자만이 컨텐츠를 만들 수 있다.

이걸 해결하기 위해서는 사용자들이 직접 자신의 컨텐츠를 생산할 수 있게 하는 것이다.

지금부터 그걸 하기 위한 여정을 시작하자.

첫번째는 사용자로부터 정보를 입력받는 양식 영어로 폼(Form)이라고 하는 것을
만드는 방법과 폼이 무엇인가를 이해하는 것이다.

 

 

 

Create.py

  <a href="create.py">create</a>
  <p><input type="text" name="title" placeholder="title"></p>

input태그는 사용자가 텍스트를 입력하는 것이다.
placeholder는 내가 무언가를 입력하기 전에 텍스트 칸 안에 표시되었다가 무언가를 입력하면 사라지는 것이다.

 

 

  <a href="create.py">create</a>
  <p><input type="text" name="title" placeholder="title"></p>
  <p><textarea rows"4"></textarea></p>

본문은 여러줄 이기 때문에 textarea태그를 쓰면 여러줄을 입력할 수 있는 ui가 나온다.
row"4"는 4줄 입력가능

 

 

  <a href="create.py">create</a>
  <p><input type="text" name="title" placeholder="title"></p>
  <p><textarea rows"4"></textarea> placeholder="description"</p>
  <p><input type="submit"></p>

전송버튼은 인풋이다. 전송이라는 행위를 시스템한테 인풋해야하기 때문에 type을 submit(제출)으로 한다.

 

 

 

 <a href="create.py">create</a> 
      <p><input type="text" name="title" placeholder="title"></p>
      <p><textarea rows="4" name="description" placeholder="description"></textarea></p>
      <p><input type="submit"></p>

 

제목부분에 입력했던 정보를 서버로 전송할 때 title이라는 이름으로 전송하고 싶으면 name:"title"이라고 적으면
된다.  본문에 적은 내용은 description으로 전송하고 싶으니 name="description"

 

 

 

 <a href="create.py">create</a>
  <form action="process_create.py">
      <p><input type="text" name="title" placeholder="title"></p>
      <p><textarea rows="4" name="description" placeholder="description"></textarea></p>
      <p><input type="submit"></p>
  </form>

다음엔 타이틀에 입력한 값과 디스크립션에 입력한 값을 submit했을 때

어떤 특정한 파이썬 애플리케이션으로 전송하고 싶다면 Form과 관련된 정보를 <form> 태그로 감싸주면 된다.

 

action태그는 어디로 보낼것인가를 말한다.

 

 

//////////////////////////////////////////////////////////////////////////////////////////

 

 

폼(Form)이라고 하는 것은 url쿼리스트링을 만들어주는 url쿼리스트링 생성자이다.

url 쿼리스트링은 웹 애플레케이션에서 process_create.py 프로그램의 title이라는 값과 descripton이라는
값을 입력해 주는 역할을 하는것이다.

 

우리가 어떤 페이지에 접속할 때는 이런 쿼리스트링을 쓰면 된다.

하지만 글을 쓰거나 할 때 쿼리스트링을 사용하게 되면 나중에 누군가가 이런 주소를
페이스북이나 트위터같은 곳에 공유하면 방문자들이 그걸 클릭해서 들어오면
아직 우리가 구현을 하지 않았는데 글이 써져버리는 문제가 생길 수 있다. 
심각하게는 데이터가 삭제될 수도 있다.

즉 웹사이트가 있으면 

그 웹사이트에 있는 정보를 사용자가 가져오는 경우가 있고
사용자가 정보를 입력하거나 수정하거나 삭제하는 경우가 있다.

가져오는 경우 get하는 경우에는 url의 쿼리 스트링을 이용하는게 맞다.
그래야지만 저 쿼리스트링까지 포함해서 공유해야지만 방문자들도 이 페이지에 정확하게 올 수 있을거다.

하지만 사용자가 정보를 서버 쪽으로 전송하거나 삭제하는 것과 같은 작업을 할 때는 
url쿼리스트링을 쓰면 안된다.

 

 

get방식이 아닌 'post방식'을 써야한다.

 

 <a href="create.py">create</a>
  <form action="process_create.py" method="post">
      <p><input type="text" name="title" placeholder="title"></p>
      <p><textarea rows="4" name="description" placeholder="description"></textarea></p>
      <p><input type="submit"></p>
  </form>

method의 속성값을 지정하지 않으면 get이라고 쓴 것과 마찬가지다.
그런데 post라고 쓰게되면 url이 바뀌지 않고 사용자가 입력한 데이터가 url이 아닌 다른 방법으로 은밀하게 전송된다.

 

 

 

 

 

 

 

 

 

20강 (활용)- 전송한 정보처리

 

 

 

#!/usr/local/bin/python3
 
import cgi
form = cgi.FieldStorage()
title = form["title"].value
description = form['description'].value
 

print(title, descripton) # CGI CGI is...

 

opened_file = open('data/'+title, 'w') #data 디렉토리 밑에 title이라는 파일을 만드는데 w(쓰기)를 할것이다.

opened_file.write(description) #디스크립션에 해당하는 값이 data title에 해당되는 파일에 쓰기가 된다.

opened_file.close() 

 

이제 우리가 여기서 어떻게 할까를 고민할 수 있다.

'글이 작성되었습니다.' 라고 링크를 알려주고 사용자를 다른 페이지로 링크를 클릭해서 가게 할 수도 있고
글이 작성되면 바로 사용자를 글을 작성한 글의 고유한 페이지로 보내버릴 수도 있다.

 

 

 

#Redirection
print("Location: index.py?id="+title) #헤더값을 변경한다. 
print()

웹브라우저한테 웹서버가 '이 주소로 이동해라'라고 얘기할 때는 location이라고 붙여주면 된다.
이렇게 사용자를 웹서버가 다른 페이지로 보내버리는 저러한 헤더를 redirection이라고 한다.

 

 

 

 

 

 

 

20강 (활용)- 수정구현

 

 

변경사항

 

 

방문자가 정보를 폼을 통해서 업데이트(update) 할 수 있도록 하는 방법을 살펴보자.

 

 

 

업데이트는 우리가 어떤 컨텐츠를 선택한 상태에서만 나오는게 더 우아한 접근방법이다.

 

index.py

form = cgi.FieldStorage()
if 'id' in form:
    pageId = form["id"].value
    description = open('data/'+pageId, 'r').read()
    update_link = '<a href="update.py?id={}">update</a>'.format(pageId) #추가

else:
    pageId = 'Welcome'
    description = 'Hello, web'
    update_link = ''           #추가
. 
.
.
 <a href="create.py">create</a>
  {update_link}
  <h2>{title}</h2>
  <p>{desc}</p>  #추가
</body>
</html>
'''.format(title=pageId, desc=description, listStr=listStr, update_link=update_link))  #추가

 

 

 

 

우리가 필요한 것은 지금 쓰기 기능이 아니다.

사용자가 수정하고 싶은 데이터가 이 글 양식에 채워져 있어야지만 사용자가 수정하기가 편하다.

 

update.py

 <form action="process_update.py" method="post">
      <p><input type="text" name="title" placeholder="title" value="{form_default_title}"></p> #value값 추가
      <p><textarea rows="4" name="description" placeholder="description">{form_default_description}</textarea></p> #value값 추가
      <p><input type="submit"></p>
  </form>
</body>
</html>
'''.format(title=pageId, desc=description, listStr=listStr, form_default_title=pageId, form_default_description=description))#추가

 

 

 

 

우리가 수정하고자 하는건 제목이 html인 컨텐츠이다.

그건 데이터 밑에 html이라는 제목으로 저장되어있다.

그런데 만약에 사용자가 제목을 html5로 수정하면 전송을 했을 때

htm5에 해당되는 파일에 대한 본문을 바꾸면

파이썬 애플리케이션은 데이터 디렉토리에서 html5라고 하는 파일을 찾을 것이다.
그런데 그 파일은 없다.

즉 , 제목은 앞으로 변경될 가능성이 있기 때문에 우리가 변경하고자 하는 것에 대한
식별자로 쓰이면 안된다는 것이다.

 

 <form action="process_update.py" method="post">
      <input type="hidden" name="pageId" value="{form_default_title}"> #추가
      <p><input type="text" name="title" placeholder="title" value="{form_default_title}"></p>
      <p><textarea rows="4" name="description" placeholder="description">{form_default_description}</textarea></p>
      <p><input type="submit"></p>

   <input type="hidden" name="pageId" value="{form_default_title}"> 은 우리가 

수정하고자 하는 파일의 이름을 담고 있어야 한다. 누군가 수정할 수 있을 수 있으니 type="hidden"을 사용해 숨긴다.

 

 

 

procsee_update.py

 

#!/usr/local/bin/python3
 
import cgi, os
form = cgi.FieldStorage()
pageId = form["pageId"].value
title = form["title"].value
description = form['description'].value
 
opened_file = open('data/'+pageId, 'w') #title은 바뀔 수 있기 때문에 pageid로 파일을 열어야한다.
opened_file.write(description)
opened_file.close()  
 
os.rename('data/'+pageId, 'data/'+title) # 현재 pageid에 해당되는 파일의 이름을 바꿔준다.

#Redirection
print("Location: index.py?id="+title)
print()

 

opened_file.close()  #파일을 연 다음에 작업이 끝난 다음에는 그 파일을 닫아줘야한다.
                        특히 쓰기할 때 읽기할때는 알아서 되는데 그냥 무조건 붙인다고 생각하자

 

os.rename(src,dst) #src 소스의 약자 (지금 현재거 원본) dst 데스티네이션(우리가 수정하고자 하는 새로운 이름)

 

 

 

 

 

 

 

 

 

 

20강 (활용)- 삭제구현

 

 

변경사항

 

 

삭제(delete)는 클릭했을 때 바로 일어난다.

이런 경우엔 링크로 처리하는 것이 아니라 폼으로 처리해야 한다.
이걸 링크로 처리하면 누군가가 링크를 다른 사람에게 공유하면 그 링크를 클릭하는
순간에 삭제가 일어날 수도 있다.

 

index.py

    delete_action = '''
        <form action="process_delete.py" method="post">
            <input type="hidden" name="pageId" value="{}">
            <input type="submit" value="delete">
        </form>
    '''.format(pageId)

 

 

 

process_delete.py

#!/usr/local/bin/python3
 
import cgi, os
form = cgi.FieldStorage()
pageId = form["pageId"].value
 
os.remove('data/'+pageId) # 파일을 삭제
 
#Redirection
print("Location: index.py") #삭제가 끝난 후 홈페이지로 이동
print()

 

 

 

정보 시스템에서 가장 중요한 요소는

1. 정보를 생성하는 것 create
2. 정보를 읽을 수 있는 것 read
3. 정보 수정 update
4. 정보 삭제 delete

이것들을 crud라고 부른다.  crud는 정보 시스템에서 가장 중요한 본질이다.