Server-side web frameworks-1

본 포스팅은 Back-end 개발 입문과 홈페이지 제작 기술 기반 마련을 위한 공부자료입니다.
Django 공식 문서와 MDN web docs를 참고자료로 작성됐습니다.

https://www.djangoproject.com/
https://developer.mozilla.org/ko/docs/Learn/Server-side/Django

목표

웹 프레임워크가 Server-side 코드를 개발/유지하는 것을 간단하게 만들수 있는 방법에 대한 이해

Server-side web framework란?

작성하기 쉽고, 웹 어플리케이션 유지보수를 쉽게 만드는 소프트웨어 프레임워크를 말한다.
일반적인 웹 개발 작업을 단순화하는 도구와 라이브러리를 제공 e.g. URL 핸들러를 통한 라우팅, 데이터베이스와 상호작용, 유저 인증 및 세션 지원, 보안 등

HTTP

웹 서버와 브라우저는 HTTP Protocol을 통해 통신한다.
때문에 서버는 브라우저에서 오는 HTTP Request를 기다리고, HTTP Response에 정보를 반환하는데, 웹 프레임 워크를 통해 이런 통신을 위한 코드 작성을 단순화 한다.

아래는 Python의 Django 프레임워크의 한 예이다.

# Django view function
from django.http import HttpResponse

def index(request):
    # Get an HttpRequest (request)
    # perform operations using information from the request.
    # Return HttpResponse
    return HttpResponse('Output string to return')

요청 핸들러인 “view” 함수는 요청 정보가 포함된 HttpRequest를 받고, 형식화된 출력 HttpResponse 객체를 반환한다.

Route

대부분의 사이트틑 여러 개의 다른 리소스를 특정 URL을 통해 접근할 수 있도록 한다.
통합된 함수로 모든 작업을 처리하는 것은 유지가 매우 어렵기 때문에 웹 프레임워크는 특별한 처리 함수로 URL 패턴 매핑 기능을 제공한다.
```
urlpatterns = [
    url(r'^$', views.index),
    # example: /best/myteamname/5/
    url(r'^(?P<team_name>\w.+?)/(?P<team_number>[0-9]+)/$', views.best),
]
```

Easy to Access Data in the Request

데이터는 다양한 방법으로 HTTP Response에 인코딩 될 수 있다.
HTTP GET Request
- URL 인자나 URL 구조에서 요구한 데이터를 인코딩 할 수 있다.
HTTP POST Request
- 서버에 있는 리소스 업데이트를 요청.
이렇듯 다양한 방법으로 서버에 저장된 데이터에 액세스하는데, 웹 프레임워크는 정보에 액세스 하기 위한 프로그래밍 언어에 적합한 매커니즘을 제공한다.
예시: Django
- HttpRequest 객체는 대상 URL, 요청 유형( HTTP GET 등 ), 요청 매개 변수, 쿠키 및 세션 데이터 등에 접근하기 위한 메서드 및 속성을 포함한다.
- 또한 URL 매퍼에 캡쳐 패턴을 정의한 URL로 인코딩된 정보를 전달할 수도 있다.

Abstract and Simplify Database Access

웹 사이트는 사용자 데이터를 저장하기 위해서 데이터베이스를 이용한다.
웹 프레임워크에서는 데이터베이스 읽기, 쓰기, 퀄, 삭제 조작을 추상화할 수 있는 데이터베이스 계층을 사용하는데, 이 추상계층을 객체 관계형 매퍼( ORM )이라고 한다.
ORM 사용시 장점
- 기존 코드 수정 없이 기본 데이터베이스를 수정할 수 있는데, 이를 통해 데이터베이스의 특성을 최적화할 수 있다.
- 기본적인 데이터의 확인은 프레임워크 안에서 구현될 수 있는데, 이를 통해 올바른 타입의 데이터베이스 필드에 데이터를 저장하는지, 올바른 타입인지, 악의적인 방식인지 쉽고 안전하게 확인 가능하다.
예시: Django
- 모델은 저장될 필드 유형을 지정하며, 저장될 수 있는 정보에 대한 필드 레벨 검증을 제공( e.g. 이메일 입력란에 유효한 이메일 주소만 허용 )
- 필드 정의는 최대 크기, 기본 값, 선택 목록 옵션, 도움말, 양식 레이블 텍스트 등을 지정할 수 있다.
- 모델은 코드와 별도로 변경될 수 있는 구성설정이므로 기본 데이터베이스에 대한 정보는 명시하지 않는다.
- 간단한 Team 객체
```
#best/models.py

from django.db import models

class Team(models.Model):
    team_name = models.CharField(max_length=40)

    TEAM_LEVELS = (
        ('U09', 'Under 09s'),
        ('U10', 'Under 10s'),
        ('U11, 'Under 11s'),
        ...  #list our other teams
    )
    team_level = models.CharField(max_length=3,choices=TEAM_LEVELS,default='U11')
```
  - 팀 이름과 팀의 레벨을 문자 필드로 지정 models.CharField
  - 각각의 레코드마다 최대 한도의 문자 길이를 지정 max_length=40
  - team_level은 선택 필드로 다음을 지정함
    - 최대 길이 max_length=3
    - 선택 항목 choices=TEAM_LEVELS
    - 기본 값 default='U11'
- 데이터 베이스 검색을 위한 간단한 쿼리
  - Django 모델은 데이터 베이스검색을 위한 간단한 쿼리를 제공한다.
  - 다른 기준을 사용해 한 번에 여러 필드와 일치시킬 수 있다.
    
    ( e.g. 대소문자를 구분하지 않음, ~보다 큰 수 )
  - 복잡한 명령문을 지원한다.
```
( e.g. “Fr”로 시작하거나 “al”로 끝나는 U11팀 찾기 )
```
```
#best/views.py

from django.shortcuts import render
from .models import Team

def youngest(request):
    list_teams = Team.objects.filter(team_level__exact="U09")
    context = {'youngest_teams': list_teams}
    return render(request, 'best/index.html', context)
```
  - U09의 모든 팀을 보여주는 view function
  - team_level필드가 “U09”인 레코드 필터링 filter(team_level__exact="U09"

Rendering Data

웹 프레임워크는 템플릿 시스템을 제공하기도 한다.
페이지가 생성될 때 데이터를 추가하기 위한 자리 표시자를 사용해 출력 문서 구조를 지정할 수 있다.
템플릿은 보통 HTML로 만들어지지만 다른 형식의 문서로도 작성될 수 있다. ( e.g. JSON, XML(en-US) 등 )
예시: Django 템플릿 시스템
- 구체화된 “double-handlebars” 구조 허용
  
  ( { { variable_name } } )
  - 이는 페이지가 로딩될 때 view 함수의 값들로 대체될 수 있다.
- 다향한 표현식 지원
```
( `{% expression %}` )

- 템플릿에서 전달된 값을 반복하는 것과 같은 간단한 조작이 가능하다.
```
```
#best/templates/best/index.html

<!DOCTYPE html>
<html lang="en">
<body>

 {% if youngest_teams %}
    <ul>
    {% for team in youngest_teams %}
        <li>{{ team.team_name }}</li>
    {% endfor %}
    </ul>
{% else %}
    <p>No teams are available.</p>
{% endif %}

</body>
</html>
```
- HTML 템플릿은 view에서 youngest_teams라고 불리는 목록 변수를 전달 받는다.
- 해당 변수가 있는지 체크 {% if yongest_teams %}
- 반복문 생성 {% for team in yongest_teams %}
- 반복마다 팀 리스트 요소 출력 <li>{ { team.team_name } } </li>

Reference

https://developer.mozilla.org/en-US/docs/Learn/Server-side/First_steps/Web_frameworks

Author And Source

이 문제에 관하여(Server-side web frameworks-1), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@byeo1019/Server-side-web-frameworks-1

우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)