현재 번역은 완벽하지 않습니다. 한국어로 문서 번역에 동참해주세요.

이전 기사에서는 웹 클라이언트와 서버 간의 통신 모습, HTTP 요청 및 응답의 성격, 서버 측 웹 애플리케이션이 웹 브라우저의 요청에 응답하기 위해 수행해야하는 작업에 대해 설명했습니다. 이러한 지식을 바탕으로, 지금 시간에는 웹 프레임 워크가 어떻게 그러한 작업을 간단히 만드는지 탐색하고, 당신의 첫 서버측 애플리케이션을 위한 프레임 워크를 어떻게 선택하는지 의견을 드리겠습니다.

Prerequisites: 기본적인 컴퓨터 활용법. HTTP 요청을 서버측 코드가 어떻게 다루고 응답하는지에 대한 높은 수준의 이해 (Client-Server overview를 참고 하십시오).
Objective: 웹 프레임 워크가 어떻게 서버측 코드를 개발/유지하기 간단하게 만들 수 있는지 이해하고 , 독자들이 그들의 개발에 어떤 프레임워크를 선택 할지에 대해 생각해보게 합니다.

이 섹션에서 실제 웹 프레임 워크에서 가져온 코드 조각을 설명할 것 입니다. 지금 전부 이해가 가지 않는것에 대해 당황하지 마세요; 우리는 프레임 워크 특정 모듈의 코드를 통해 작업 할 것입니다.

Overview

서버측 웹 프레임워크("웹 어플리케이션 프레임워크"라고 알려진)는 작성하기 쉽고, 웹 어플리케이션을 유지및 보수하기 쉽게 만드는 소프트웨어 프레임 워크입니다. 적절한 URL핸들러로 라우팅, 데이테베이스와 상호작용, 유저 인증과 세션 지원, 출력 형식(예: HTML, JSON, XML), 웹 공격에 대처하기 위한 보안 강화 같은 일반적인 웹 개발 작업을 단순화하는 도구와 라이브러리를 제공합니다.

다음 섹션은 어떻게 웹 프레임워크가 웹 애플리케이션 개발을 쉽게 하는지 더 상세히 살펴 보겠습니다. 우리는 당신이 사용할 웹 프레임워크를 선택하는 기준을 설명하고 몇 가지 옵션을 나열하겠습니다.

What can a web framework do for you?

웹 프레임워크는 일반적인 웹 개발 작업을 단순화 하는 도구와 라이브러리를 제공합니다. 당신은 서버측 웹 프레임 워크를 사용하지 않을 수 있지만 이는 권고 되지 않습니다 — 서버측 웹 프레임워크를 사용하면 당신의 삶이 더 편해질 것입니다.

이 섹션에서는 웹 프레임워크가 제공하는 몇몇 기능에 대해 논의 하겠습니다(모든 프레임 워크가 그 기능을 제공하지는 않습니다!)

Work directly with HTTP requests and responses

우리가 마지막 기사에서 봤듯이 웹 서버와 브라우저는 HTTP protocol을 통해 통신합니다 — 서버는 브라우저에서 오는 HTTP요청을 기다리고, HTTP응답에 정보를 반환 합니다. 웹 프레임워크는 이러한 요청과 응답을 할 서버측 코드를 만드는데 작성할 문법을 단순화 합니다. 이것은 당신의 일과 상호작용을 쉽게 하고, 저수준 네트워킹 프리미티브보다 높은 수준의 코드를 이용한다는 것을 의미합니다.

Django (Python) 웹 프레임워크가 어떻게 작동 하는지의 대한 예가 아래에 나와 있습니다. 모든 "view"함수는(요청 핸들러)  요청 정보가 포함된HttpRequest객체를 받고, 형식화된 출력(이번 케이스에선 string)이 있는HttpResponse 객체를 반환합니다.

# 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')

Route requests to the appropriate handler

대부분의 사이트는 여러개의 다른 리소스를 특정된 URL을 통해 접근 할 수 있도록 제공합니다. 통합된 함수로 모든것을 처리하는건 유지하기가 매우 힘듭니다, 그래서 웹 프레임워크는 특별한 처리 함수로 URL패턴을 매핑하는 기능을 제공합니다. 이러한 접근 방법은 유지 보수 기간에 이점이 있습니다. 왜냐하면 기본 코드를 변경하지 않고도 특정 기능을 제공하는 데 사용되는 URL을 변경할 수 있기 때문입니다.

각각의 프레임 워크들은 다른 매핑 메커니즘을 사용합니다. 예를 들면 Flask (Python) 웹 프레임 워크는데코레이터를 사용하여 view함수에 경로를 추가합니다.

@app.route("/")
def hello():
    return "Hello World!"

Django는 개발자가 URL 패턴과 뷰 함수 사이에 URL 매핑 목록을 정의 할 것을 기대합니다.

urlpatterns = [
    url(r'^$', views.index),
    # example: /best/myteamname/5/
    url(r'^(?P<team_name>\w.+?)/(?P<team_number>[0-9]+)/$', views.best),
]

Make it easy to access data in the request

데이터는 다양한 방법으로 HTTP응답에 인코딩 될 수 있습니다. 서버에서 파일이나 데이터를 얻기 위한 HTTP GET 요청은 URL인자나 URL구조를 요구한 데이터를 인코딩 할 수 있습니다. 서버에 있는 리소스를 업데이트를 요청하는 HTTP POST는 요청 본문에 "POST data"로 업데이트 정보를 대신 포함합니다. 또한 HTTP 요청은 클라이언트 측 쿠키에서 현재 세션 또는 사용자에 관한 정보를 포함 할 수있습니다.

웹 프레임 워크는 정보에 액세스하기위한 프로그래밍 언어에 적합한 메커니즘을 제공합니다. 예를 들어 Django가 모든 뷰 함수에 전달하는 HttpRequest 객체는 대상 URL, 요청 유형 (예 : HTTP GET), GET 또는 POST 매개 변수, 쿠키 및 세션 데이터 등에 접근 하기 위한 메소드 및 속성을 포함합니다. Django는 URL 매퍼에 "캡처 패턴"을 정의한 URL 구조로 인코딩 된 정보를 전달할 수도 있습니다 (위 섹션의 마지막 코드 단편 참조).

Abstract and simplify database access

웹 사이트는 사용자와 사용자에 대한 정보 공유를 위한 데이터를 저장 하기 위해서 데이터베이스를 사용합니다. 웹 프레임 워크는 종종  데이터베이스 읽기, 쓰기, 쿼리, 삭제 조작을 추상화 할 수 있는 데이터베이스 계층을 제공 합니다. 이러한 추상 계층을 객체 관계형 매퍼(ORM)라고 합니다.

ORM을 사용 하는 것은 2가지 장점이 있습니다:

  • 사용하던 코드를 수정하지 않고 기본 데이터베이스를 바꿀 수 있습니다. 이것을 통해 개발자가 사용법에 따른 데이터베이스의 특성을 최적화 할 수 있습니다.
  • 기본적인 데이터의 확인은 프레임워크 안에서 구현 될 수 있습니다. 이를 통해  올바른 타입의 데이터베이스 필드에 데이터를 저장하는지, 올바른 타입인지(예: 이메일 주소), 악의적인 방식 (크래커는 특정 코드 패턴을 사용하여 데이터베이스 레코드를 지우는 것과 같은 나쁜 행동을 할 수 있습니다)인지 쉽고 안전하게 확인 할 수 있습니다.

예를들어 Django 웹 프레임워크는 ORM을 제공하고 레코드 구조 모델로 정의하는데  사용한 객체를 참조합니다. 모델은 저장 될 필드 유형을 지정하며, 저장 될 수있는 정보에 대한 필드 레벨 검증을 제공 할 수 있습니다(예 : 이메일 입력란은 유효한 이메일 주소 만 허용). 또한 필드 정의는 최대 크기, 기본 값, 선택 목록 옵션, 문서를 위한 도움말, 양식 레이블 텍스트 등을 지정할 수도 있습니다. 모델은 코드와 별도로 변경 될 수있는 구성 설정이므로 기본 데이터베이스에 대한 정보는 명시하지 않습니다.

첫번째 코드 스니펫은 아래에 보이는 매우 간단한 Django 모델인 Team객체 입니다. 이 객체는 팀 이름과 팀의 레벨을 문자 필드로 저장하고 각각의 레코드마다 최대 한도의 문자 길이를 저장 합니다. team_level은 선택 필드이므로 우리는 디폴트 값과 함께 표시할 선택 항목과 데이터를 저장하는 것 사이를 매핑하는 것을 제공합니다. 

#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')

Django 모델은 데이터베이스 검색을 위한 간단한 쿼리를 제공 합니다. 다른 기준을 사용하여 한 번에 여러 필드와 일치시킬 수 있습니다. (예 : 대소 문자를 구분하지 않음,보다 큼, 등), 그리고 복잡한 명령문을 지원 할 수 있습니다 (예를 들어 당신이 "Fr"로 시작하거나 "al"로 끝나는 특별한 U11팀을 찾을 수 있습니다). 

두번째 코드 스니펫은 U09의 모든 팀을 보여주는 view function(요청 핸들러)을 보겠습니다.  이 경우 우리는 team_level 필드의 텍스트가 정확히 'U09'인 모든 레코드를 필터링하도록 지정합니다. ( 이 기준이 필드 이름과 일치 유형이 두 개의 밑줄로 구분 된 인수로 filter() 함수에 전달되는 방법을 아래에 기록하십시오. team_level__exact ).

#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)

Rendering data

웹 프레임워크는 종종 템플릿 시스템을 제공합니다. 이것은 페이지가 생성될 때 데이터를 추가하기 위한 자리 표시 자를 사용하여 출력 문서 구조를 지정 할 수 있습니다. 템플릿들은 보통 HTML로 만들어지지만, 다른 형식의 문서로도 작성될 수 있습니다.

웹 프레임워크는 보통 저장된 데이터를 다른 형식으로 쉽게 생성 할 수 있는,JSON, XML을 포함한, 틀을 제공합니다.

예를들어, Django 템플릿 시스템은 구체화된 "double-handlebars" 구조 (예를 들어 {{ variable_name }})를 사용하도록 허용하는데, 이것은 페이지가 로딩될 때 뷰 함수의 값들로 대체될 수 있습니다.  템플릿 시스템은 또한 다양한 표현식을 지원하는데 (예를 들어 : {% expression %}), 템플리트가 템플리트에 전달 된 목록 값을 반복하는 것과 같은 간단한 조작을 수행 할 수 있습니다.

 예를 들면, Django 템플릿 시스템은 구체화된 변수를  "double-handlebars"문법(예: {{ variable_name }})으로 지정 할 수 있습니다. 이것은 페이지가 렌더될 때 view함수에서 보낸 변수들로 대체 될 것입니다. 또한 템플릿 시스템은 표현식에대한 지원을 제공합니다(문법: {% expression %}), 이것은 템플릿에 전달되는 목록값을 반복하는것 같은 간단한 작업을 수행 할 수 있습니다.

Note: 다른 대부분의 템플릿 시스템들은 비슷한 문법을 사용합니다, 예: Jinja2 (Python), handlebars (JavaScript), moustache (JavaScript), 등등.

아래의 코드 스니펫은 그것이 어떻게 작동 하는지 보여줍니다. 이전 섹션에 사용한 "youngest team" 예제를 다시 보겠습니다, HTML 템플릿은 view에서 youngest_teams이라고 불리는 목록 변수를 전달 받습니다. Inside the HTML skeleton we have an expression that first checks if the youngest_teams variable exists, and then iterates it in a for loop. On each iteration the template displays the team's team_name value in a list item.

#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>

How to select a web framework

Numerous web frameworks exist for almost every programming language you might want to use (we list a few of the more popular frameworks in the following section). With so many choices, it can become difficult to work out what framework provides the best starting point for your new web application. 

Some of the factors that may affect your decision are:

  • Effort to learn: The effort to learn a web framework depends on how familiar you are with the underlying programming language, the consistency of its API, the quality of its documentation, and the size and activity of its community. If you're starting from absolutely no programming experience then consider Django (it is one of the easiest to learn based on the above criteria). If you are part of a development team that already has significant experience with a particular web framework or programming language, then it makes sense to stick with that.
  • Productivity: Productivity is a measure of how quickly you can create new features once you are familiar with the framework, and includes both the effort to write and maintain code (since you can't write new features while old ones are broken). Many of the factors affecting productivity are similar to those for "Effort to learn" — e.g. documentation, community, programming experience, etc. — other factors include:
    • Framework purpose/origin: Some web frameworks were initially created to solve certain types of problems, and remain better at creating web apps with similar constraints. For example, Django was created to support development of a newspaper website, so is good for blogs and other sites that involve publishing things. By contrast, Flask is a much lighter-weight framework and is great for creating web apps running on embedded devices.
    • Opinionated vs unopinionated: An opinionated framework is one in which there are recommended "best" ways to solve a particular problem. Opinionated frameworks tend to be more productive when you're trying to solve common problems, because they lead you in the right direction, however they are sometimes less flexible.
    • Batteries included vs. get it yourself: Some web frameworks include tools/libraries that address every problem their developers can think "by default", while more lightweight frameworks expect web developers to pick and choose solution to problems from separate libraries (Django is an example of the former, while Flask is an example of a very light-weight framework). Frameworks that include everything are often easier to get started with because you already have everything you need, and the chances are that it is well integrated and well documented. However if a smaller framework has everything you (will ever) need then it can run in more constrained environments and will have a smaller and easier subset of things to learn.
    • Whether or not the framework encourages good development practices: For example, a framework that encourages a Model-View-Controller architecture to separate code into logical functions will result in more maintainable code than one that has no expectations on developers. Similarly, framework design can have a large impact on how easy it is to test and re-use code.
  • Performance of the framework/programming language: Usually "speed" is not the biggest factor in selection because even relatively slow runtimes like Python are more than "good enough" for mid-sized sites running on moderate hardware. The perceived speed benefits of another language, e.g. C++ or JavaScript, may well be offset by the costs of learning and maintenance.
  • Caching support: As your website becomes more successful then you may find that it can no longer cope with the number of requests it is receiving as users access it. At this point you may consider adding support for caching. Caching is an optimisation where you store all or part of a web request so that it does not have to be recalculated on subsequent requests. Returning a cached request is much faster than calculating one in the first place. Caching can be implemented in your code or in the server (see reverse proxy). Web frameworks will have different levels of support for defining what content can be cached.
  • Scalability: Once your website is fantastically successful you will exhaust the benefits of caching and even reach the limits of vertical scaling (running your web application on more powerful hardware). At this point you may need to scale horizontally (share the load by distributing your site across a number of web servers and databases) or scale "geographically" because some of your customers are based a long way away from your server. The web framework you choose can make a big difference on how easy it is to scale your site.
  • Web security: Some web frameworks provide better support for handling common web attacks. Django for example sanitises all user input from HTML templates so that user-entered JavaScript cannot be run. Other frameworks provide similar protection, but it is not always enabled by default.

There are many other possible factors, including licensing, whether or not the framework is under active development, etc.

If you're an absolute beginner at programming then you'll probably choose your framework based on "ease of learning". In addition to "ease of use" of the language itself, high quality documentation/tutorials and an active community helping new users are your most valuable resources. We've chosen Django (Python) and Express (Node/JavaScript) to write our examples in later on in the course, mainly because they are easy to learn and have good support.

Note: Let's go to the main websites for Django (Python) and Express (Node/JavaScript) and check out their documentation and community.

  1. Navigate to the main sites (linked above)
    • Click on the Documentation menu links (named things like "Documentation, Guide, API Reference, Getting Started".
    • Can you see topics showing how to set up URL routing, templates, and databases/models?
    • Are the documents clear
  2. Navigate to mailing lists for each site (accessible from Community links).
    • How many questions have been posted in the last few days
    • How many have responses.
    • Do they have an active community?

A few good web frameworks?

Let's now move on, and discuss a few specific server-side web frameworks.

The server-side frameworks below represent a few of the most popular available at time of writing. All of them have everything you need to be productive — they are open source, are under active development, have enthusiastic communities creating documentation and helping users on discussion boards, and are used in large numbers of high-profile websites. There are many other great server-side frameworks that you can discover using a basic internet search. 

Note: Descriptions come (partially) from the framework websites!

Django (Python)

Django is a high-level Python Web framework that encourages rapid development and clean, pragmatic design. Built by experienced developers, it takes care of much of the hassle of web development, so you can focus on writing your app without needing to reinvent the wheel. It’s free and open source.

Django follows the "Batteries included" philosophy and provides almost everything most developers might want to do "out of the box". Because everything is included, it all works together, follows consistent design principles, and has extensive and up-to-date documentation. It is also fast, secure, and very scalable. Being based on Python, Django code is easy to read and to maintain.

Popular sites using Django (from Django home page) include: Disqus, Instagram, Knight Foundation, MacArthur Foundation, Mozilla, National Geographic, Open Knowledge Foundation, Pinterest, Open Stack.

Flask (Python)

Flask is a microframework for Python. 

While minimalist, Flask can create serious websites out of the box. It contains a development server and debugger, and includes support for Jinja2 templating, secure cookies, unit testing, and RESTful request dispatching. It has good documentation and an active community. 

Flask has become extremely popular, particularly for developers who need to provide web services on small, resource-constrained systems (e.g. running a web server on a Raspberry Pi, Drone controllers, etc.)

Express (Node.js/JavaScript)

Express is a fast, unopinionated, flexible and minimalist web framework for Node.js (node is a browserless environment for running JavaScript). It provides a robust set of features for web and mobile applications and delivers useful HTTP utility methods and middleware.

Express is extremely popular, partially because it eases the migration of client-side JavaScript web programmers into server-side development, and partially because it is resource-efficient (the underlying node environment uses lightweight multitasking within a thread rather than spawning separate processes for every new web request). 

Because Express is a minimalist web framework it does not incorporate every component that you might want to use (for example, database access and support for users and sessions are provided through independent libraries). There are many excellent independent components, but sometimes it can be hard to work out which is the best for a particular purpose! 

Many popular server-side and full stack frameworks (comprising both server and client-side frameworks) are based on Express, including FeathersItemsAPIKeystoneJSKrakenLEAN-STACKLoopBackMEAN, and Sails.

A lot of high profile companies use Express, including: Uber, Accenture, IBM, etc. (a list is provided here).

Ruby on Rails (Ruby)

Rails (usually referred to as "Ruby on Rails") is a web framework written for the Ruby programming language.

Rails follows a very similar design philosophy to Django. Like Django it provides standard mechanisms for routing URLs, accessing data from a database, generating HTML from templates and formatting data as JSON or XML. It similarly encourages the use of design patterns like DRY ("dont repeat yourself" — write code only once if at all possible), MVC (model-view-controller) and a number of others.

There are of course many differences due to specific design decisions and the nature of the languages.

Rails has been used for high profile sites, including: BasecampGitHub,ShopifyAirbnbTwitchSoundCloud,HuluZendeskSquareHighrise.

ASP.NET

ASP.NET is an open source web framework developed by Microsoft for building modern web applications and services. With ASP.NET you can quickly create web sites based on HTML, CSS, and JavaScript, scale them for use by millions of users and easily add more complex capabilities like Web APIs, forms over data, or real time communications.

One of the differentiators for ASP.NET is that it is built on the Common Language Runtime (CLR), allowing programmers to write ASP.NET code using any supported .NET language (C#, Visual Basic, etc.). Like many Microsoft products it benefits from excellent tools (often free), an active developer community, and well-written documentation.

ASP.NET is used by Microsoft, Xbox.com, Stack Overflow, and many others.

Mojolicious (Perl)

Mojolicious is a next generation web framework for the Perl programming language.

Back in the early days of the web, many people learned Perl because of a wonderful Perl library called CGI. It was simple enough to get started without knowing much about the language and powerful enough to keep you going. Mojolicious implements this idea using bleeding edge technologies.

Some of the features provided by Mojolicious are: Real-time web framework, to easily grow single file prototypes into well-structured MVC web applications; RESTful routes, plugins, commands, Perl-ish templates, content negotiation, session management, form validation, testing framework, static file server, CGI/PSGI detection, first class Unicode support; Full stack HTTP and WebSocket client/server implementation with IPv6, TLS, SNI, IDNA, HTTP/SOCKS5 proxy, UNIX domain socket, Comet (long polling), keep-alive, connection pooling, timeout, cookie, multipart and gzip compression support; JSON and HTML/XML parsers and generators with CSS selector support; Very clean, portable and object-oriented pure-Perl API with no hidden magic; Fresh code based upon years of experience, free and open source.

Summary

This article has shown that web frameworks can make it easier to develop and maintain server-side code. It has also provided a high level overview of a few popular frameworks, and discussed criteria for choosing a web application framework. You should now have at least an idea of how to choose a web framework for your own server-side development. If not, then don't worry — later on in the course we'll give you detailed tutorials on Django and Express to give you some experience of actually working with a web framework.

For the next article in this module we'll change direction slightly and consider web security.

문서 태그 및 공헌자

 이 페이지의 공헌자: bcc829, hongroba
 최종 변경: bcc829,