Исходные коды программ и игр

Программирование - работа и хобби

Исходники веб страниц .aspx, cshtml

Язык программирования C#

Простые веб страницы ASP.NET

Простенькие веб страницы ASP.NET для первого знакомства с грандиозной технологией создания веб-проектов от мала до велика. Не усложняя первые шаги рабочими каркасами WebForms, MVC, WebAPI создадим простые страницы с программным кодом на основе обработчиков представлений - ASPX и Razor. Обработчики кода, называемые еще механизмами визуализации или движками, предназначены для динамического создания веб-страницы путем замены программного кода сгенерированной HTML разметкой.

Исходники веб-проекта

Исходные коды веб-проекта написаны на языке C#. Исходник сформирован как веб-сайт и позволяет прямым копированием разместить файлы проекта на сервере. Затем, непосредственно на сервере, можно с помощью любого текстового редактора производить занимательные опыты по изучению движков динамических страниц ASP.NET. Использование только текстового редактора даёт полезную гимнастику навыков написания кода C#.

Интеллектуальный Razor

Razor новый механизм визуализации программного кода в HTML странице, в котором гармонично сочетается простота и мощность. Razor - это интеллектуальный движок динамического создания HTML разметки. Имеет понятный синтаксис внедрения кода в веб-страницу. Razor использует минимальное количество символов для обозначения зоны программного кода. Для отличия программного кода от HTML кода использует, вообщем-то, один символ @ в сочетании с фигурными скобками и без скобок.

Веб-страница на движке Razor

Ниже показан код веб страницы для обработчика внедренного программного кода Razor. Обратите внимание на гармоничное слияние html кода и выражений на языке C#. Движок Razor позволяет использовать html теги непосредственно внутри программного кода: интеллектуальная составляющая обработчика ловко отделяет html разметку от программного кода C#.


<!DOCTYPE html>
 
<html lang="ru">
    <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <meta charset="utf-8" />
        <title>@namepage</title>
        <link rel="stylesheet" type="text/css" href="/css/style.css" />
    </head>
    <body>
 
 
        <h1>@namepage</h1>
 
        <p><a href="/">На главную</a></p>
 
        @Html.Raw(createLinks.GetLinks())
 
        <p>
            Количество стобцов - @numberColumns<br />
            Количество строк - @numberRows
        </p>
 
        <table>
            <tr>
            @for (int i = 0; i < numberColumns; i++)
            {
                <th>Заголовок № @(i + 1)</th>
            }
            </tr>
            @for (int row = 0; row < numberRows; row++)
            {
            <tr>   
            @for (int col = 0; col < numberColumns; col++)
            {
                <td>@(row+1)х@(col+1)</td>
            } 
            </tr>
            }
        </table>
        
    </body>
</html>

Прежний движок ASPX

Движок ASPX - стандартная модель добавления кода на веб-страницу ASP.NET. ASPX использует блоки объявления типов, процедур и переменных <script runat="server"></script> и встроенный блок отрисовки HTML разметки <% … %>. Модель добавления программного кода ASPX с некоторыми изменениями перешла в ASP.NET из первой платформы ASP.

Веб-страница на движке ASPX

Движок ASPX требует заключения всех частей и частичек программного кода в блоки вида <% … %>. Типы, процедуры и переменные можно объявлять в блоке <script> runat="server"> … </script>. Атрибут runat="server" отличает данный блок от блока javascript и обозначает обработку кода в этом блоке непосредственно на сервере.


<!DOCTYPE html>
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>
    <%
        Response.Write(namepage); 
        // Далее  конструкцию Response.Write("") будем заменять
        // альтернативным коротким кодом =выражение
    %>
    </title>
    <link rel="stylesheet" type="text/css" href="/css/style.css" />
</head>
<body>
    
    <% 
       //  короткая конструкция не допускает внутри блока какого-либо другого кода
    %>
    <h1><% =namepage %></h1> 
 
    <p><a href="/">На главную</a></p>
 
    <% =createLinks.GetLinks() %>
 
    <p>
        Количество столбцов - <% =numberColumns %><br />
        Количество строк - <% =numberRows  %>
    </p>
 
  
    <%  // В блоках внедренного кода ASPX недопускается html разметка,
        // только в качестве строк.%>
 
    <table>
        <tr>
        <%for (int i = 0; i < numberColumns; i++)
        {
            Response.Write( "<th>Заголовок №" + (i + 1) + "</th>");
        }%>
        </tr>
        <%for (int row = 0; row < numberRows; row++){%>
        <tr>
            <%for (int col = 0; col < numberColumns; col++){%>
             <td><% =((col + 1) + "x" + (row + 1)) %></td>
            <%}%>
        </tr>
        <%}%>
    </table>
 
</body>
</html>

Исследование исходников

Для исследования исходников веб-страниц рекомендуется MS Visual Studio .NET, но можно исследовать и в MS Visual Studio Code, WebMatrix. Сайт включает из три страницы: главная и две одинаковые динамические страницы создания таблиц на движках ASPX и Razor. Размерность таблицы можно задавать в строке запроса двумя параметрами. Надо сказать, что в принципе оба обработчика эффективно создают HTML разметку, но предоставляют разные комфорт и производительность работы.

Итог и файлы исходников

Протестируйте движки в прикрепленных исходниках. Какой движок удобнее? В заключении хочется добавить, что для пользователя сайта, информация о том на каком движке работают веб-страницы не важна. Но программист, поработав с каждым обработчиком внедренного кода, наверняка сделает выбор в пользу Razor.

Файл: webpageaspnet-1.zip
Размер: 816 Кбайт
Загрузки: 575