Лабораторна робота 2

Тема: Початок роботи з ASP.NET MVC 4. Розробка примітивного додатка на MVC 4

Відкриємо Microsoft Visual Studio 2012 У меню File (Файл ) виберемо пункт New Project ... (Створити проект). Перед нами відкриється діалогове вікно створення проекту , в якому ми виберемо шаблон ASP.NET MVC 4 Web Application:

Далі перед нами відкриється вікно вибору шаблону нового додатка:

Виберемо шаблон Internet Application.

Шаблони додатки MVC 4

Internet Application. Даний шаблон представляє деяку базову функціональність, наприклад, управління обліковими записами, яку буде містити новий додаток .

Intranet Application. Даний шаблон схожий на шаблон Internet Application. Відмінність полягає в тому, що в Intranet Application для управління обліковими записами використовується аутентифікація Windows, а не система ASP.NET Membership .

Empty. Цей шаблон представляє абсолютно чистий додаток без будь-яких файлів і структури папок.

Basic. Цей шаблон також представляє порожній проект. Правда, він містить базові каталоги, CSS, інфраструктуру додатки MVC. Раніше в MVC 3 цей шаблон називався Empty.

Mobile Application. Призначений для створення веб -додатків для мобільних платформ.

Web API. Призначений для створення сервісів і для роботи з фреймворком Web API .

Крім того, дане діалогове вікно пропонує нам вибрати движок подання до секції View Engine і задати опції тестування.

При виборі движка представлення нам доступні дві опції - движок Razor і ASPX (традиційний движок Web Forms). У даному випадку ми виберемо Razor.

Отже, натискаємо кнопку OK і створюємо новий проект. Ми відразу ж можемо запустити проект на виконання і нам постане картинка в браузері з нашим додатком:

Таким чином, весь функціонал, який містить проект за замовчуванням, реалізується в такий додаток.

Структура проекту MVC 4

Праворуч у вікні Solution Explorer (оглядач рішень) ми можемо побачити структуру проекту MVC 4.

App_Data - У цій папці зберігаються всі необхідні файли і ресурси, наприклад, бази даних, використовувані додатки. Після розгортання програми лише безпосередньо додаток може працювати з цією папкою, доступ же простих користувачів в цю папку заборонений.

Файл Global.asax і папка App_Start У mvc 4 була додана папка App_Start. Вона включає весь функціонал конфігурації програми, який в попередніх версіях містився у файлі Global.asax, а тепер перенесено в набір статичних класів, що викликаються в Global.asax. Ці статичні класи містять деяку логіку ініціалізації програми, виконуються при запуску.

файл Web.config Файл конфігурації програми, який знаходиться в кореневій папці програми

Content Містить деякі допоміжні файли, які не включають код на C# або javascript, і які розгортаються разом з додатком. Зокрема, тут можуть розміщуватися файли стилів CSS. Так, в цій папці ви побачите файл Site.css, який містить стилі додатки, а також папку з темами, що включає стилі css та зображення для певних тем.

Controllers Містить контролери - класи, що відповідають за роботу програми. За замовчуванням тут знаходяться два контролери - HomeController і AccountController.

Папки Images і Scripts Папки Images і Scripts містять відповідно зображення і скрипти на JavaScript, використовувані в додатку. За замовчуванням ці папки вже містять файли, зокрема, в папку Scripts вже поміщені файли бібліотеки jQuery.

Models Містить моделі, що використовуються додатком. За замовчуванням тут визначена одна модель - AccountModel, яка представляє окрему обліковий запис.

Views Тут розміщуються представлення. Представлення групованні по папках, кожне з яких відповідає одному контролеру. Після отримання та обробки запиту контролер, відправляє одне з цих представлень , заповнених деякими даними, клієнту. Крім того, є папка загальних для контролерів представлень - папка Shared

Створення проекту

Створимо перший примітивний додаток на MVC 4, задача якого дати деяке початкове представлення роботи MVC. Як шаблон проекту ми виберемо шаблон Empty і створимо міні -додаток з нуля.

Задача. Припустимо, ми робимо сайт банку або кредитної організації. І наш додаток буде виводити на головну сторінку з бази даних інформацію про кредити. Крім того, ми зробимо так, щоб користувач міг подати заявку на отримання кредиту, і ця заявка збереглася в базі даних.

Відкриємо Visual Studio, в меню виберемо File -> New Project.. і серед шаблонів проектів виберемо шаблон ASP.NET MVC 4 Web Application і як-небудь назвемо новий проект, наприклад, MvcCreditApp. Потім у вікні створення нового проекту ASP.NET MVC 4 Web Application виберемо шаблон Empty:

Після цього буде створено по суті порожній проект, в якому ще нічого немає. Нам належить наповнити його.

По-перше, нам належить працювати з даними, які повинні бути представлені якимись моделями. Для нашого завдання ми можемо виділити дві області даних: інформація про кредит та інформація про заявку на кредит. Відповідно, ми створимо дві моделі. Отже, в нашому додатку вже визначена папка Models. У ній будуть знаходитися наші моделі. Натиснемо на цю папку правою кнопкою миші і в меню виберемо Add- > Class .... Назвемо новий клас або модель Credit і додамо в нього код, що описує модель кредиту:

        

Тепер таким же чином створимо клас для заявки на кредит - клас Bid:

        

Умовності при створенні моделей

В даному випадку діють деякі умовності. Оскільки база даних і відповідна їй модель повинна мати первинний ключ (Primary Key), то ми його повинні визначити. У нас є два шляхи визначення ключа. У даному випадку ми використовували визначення ключа за назвою властивості. Для цього модель повинна містити властивість з ім'ям Ім'я_моделіId або просто Id. Так, у нас в моделі Credit визначено властивість CreditId, тобто дана властивість є первинним ключем. Другий спосіб полягав у визначенні ключа за допомогою атрибуту Key, встановленим над потрібною властивістю. Більш докладно про це ми поговоримо в далі, де будемо обговорювати моделі.

Створення контексту даних і EntityFramework

Для більш зручного доступу до даних рекомендується використовувати фреймворк Entity Framework, хоча його використання необов'язково і цілком залежить від уподобань розробника. Цей фреймворк дозволяє абстрагуватися від структури конкретної бази даних і вести всі операції з даними через модель.

Оскільки ми створили проект по шаблону Empty, який практично не містить жодних файлів, то нам треба буде додати в проект файли EntityFramework для взаємодії з БД. Якби ми створювали проект по іншому шаблону, наприклад, Basic або Internet Application, то бібліотека EntityFramework вже була б додана за замовчуванням.

Отже, додамо в проект підтримку EntityFramework і для цього натиснемо правою кнопкою миші в структурі проекту на вузол References ( який містить підключення в проект бібліотеки) і в меню виберемо Manage NuGet Packages ...

У вікні управління пакетами NuGet в правому верхньому куті введіть у поле пошуку Entity і натисніть Enter. Після цього всі знайдені пакети , які мають відношення до запиту, будуть відображені в середньому стовпці, як показано на рисунку:

Потім встановлюємо пакет, і після того, як закінчиться установка, ми можемо використовувати всі переваги EntityFramework для управлінням даними.

Після установки створимо контекст даних. Він потрібен для полегшення доступу до БД на основі деякої моделі. Додамо в папку Models новий клас CreditContext з наступним змістом:

Щоб створити контекст, нам треба наслідувати новий клас від класу DbContext. Властивості типу public public DbSet<Credit> Credits { get; set; } допомагають отримувати набір даних певного типу (в даному випадку типу Credit).