ASP.Net MVC (Model – View – Controller) je arhitektonski sloj na visokom nivou (high-level) framework za izgradnju veb aplikacija otvorenog code-a (open-source)
koji je baziran na MVC obrazcu (pattern). On je takođe i Cross-Platform; znači
da radi na više platformi ili još bolje rečeno totalno je nezavisan od bilo
koje platforme i definisan je na posebnom asembleru System.Web.Mvc. Prva
zvanična verzija ASP .Net MVC je izašla 13 marta 2009; razvijala se sve do
verzije 6.0 da bi od 17 maja 2016 godine se proširila i na open-source verziju
ASP.Net Core MVC 1.0 i trenutno dok pišem ovoja post; zadnja realizacija ASP
.NET Core MVC 2.0 je izašla 14 avgusta 2017 godine. Još bi napomenuo da od svoje
prve pojave MVC je stekao toliku popularnost i toliko je kompanija prešlo na
njegovu upotrebu da se projekti bazirani u ASP .Net-u i veb formama u nekim poslovnim
krugovima smatraju zastarelim iako ASP .Net MVC nije nastavak ASP .Net-a. Ja ću
na svom blogu pisati i o ASP .Net tehnologiji jer treba da znate sve što možete
da znate; ali to definitivno nije prioritet ako započinjete neki ozbiljan svoj
projekat. Još veći razlog ako pokrećete veb projekat za neku kompaniju; moj
savet vam je da koristite ASP .Net MVC tehnologiju.
( Arhitektura Asp .Net MVC-a )
Za
razliku od ASP .Net-a baziranog na veb formama; ASP .Net i veb forme nisu isto;
gde se i ulaz i izlaz generišu u prikazu (View); MVC je razdvojen na tri logička
segmenta: modelu, prikazu i kontroloru. Možete se pitati zašto su ovo zakomplikovali?
Odgovor je jednostavan, zbog poslovne logike i bolje organizacije same
strukture veb aplikacije ali i mnogih tehničkih promena. Ponekad kad
programirate neke manje aplikacije sve je odlično ali kad se vaš mali projekat
vremenom razvije tad je organizacija i struktura samog projekta itekako bitna. ASP .Net je poput Windows formi baziran na događajima dok je MVC baziran nad kontrolorima. ASP .Net se oslanja na ViewState mehanizam; čuva podatke između poziva dve veb strane
ili veb stranice i servera; što u slučajevima kada imate dosta podataka
opterećujete serverske resurse i učitavanje stranice može biti itekako usporeno.
Takođe negativno utiče na rangiranje veb stranice. Iako ViewState mehanizam
rešava probleme, on nije prednost. MVC jednostavno ne koristi ViewState, Postback
i serverske kontrole. MVC umesto ViewState-a čuva podatke u metodama
kontrolora; koristi HTML kontrole i mnoge stvari obavlja na klijent strani i
lako se integriše sa JavaScript-om i JQuery bibliotekom sa kojim dizajn vašeg
veb sajta izgleda lepši, bolji i moderniji. MVC koristi
i REST – Represantational State Transfer; znači metode kontrolora pokreće preko
URL-a. Što se tiče Routing procesa, on može da se koristi i u ASP .Net aplikacijama. Testiranje ASP .Net MVC aplikacije je pojednostavljeno.
Šta
je MVC obrazac i kako funkcioniše?
Kao
što sam već naveo na početku posta; ASP .Net MVC se deli na tri glavne celine.
Sa ovim celinama će te se mnogo više upoznati kroz buduće postove, kad budete
učili kako se iste prave.
- Model – je skup klasa koji definišu i opisuju podatke vaše poslovne logike sa kojim radite. Model je zadužen za sve podatke koji se trebaju prikazati iako on nema predstavu o tome gde i kako će se ti podaci prikazivati. Model kao objekat uglavnom inkapsuliraju podatke koje čuvate u bazama podataka.
- View – prikaz definiše kako će izgledati vaše veb grafičko okruženje. To je više šablon koji dinamički generiše HTML.
- Controller – kontroler je specijalna klasa zadužena za komunikaciju sa korisnikom i fleksibilnost cele logike aplikacije. On je veza i interakcija između modela i prikaza. On prvo komunicira sa modelom i onda odlučuje koji prikaz će prikazati krajnjem korisniku.
Kako
se kreira ASP .net MVC aplikacija?
Bez
obzira koliko ste upoznati teoretski sa ASP .Net aplikacijama, praktična upotreba
iste je mnogo jednostavnija. Za početak, pokrenite Visual Studio 2017 i kliknite
na New Projecat. Za šablon izaberite ASP .Net Application (.Net framework) i
aplikaciju nazovite HelloWorld.
Kliknite
na dugme OK i pojaviće vam se nova forma. Izaberite šablon MVC. Kliknite na
dugme Change Authentication. Odaberite opciju Individual User Accounts i
pritisnite dugme OK.
Sačekajte
jedno kraće vreme da se MVC projekat kreira. To može potrajati u zavisnosti od performansi
vašeg računara i operativnog sistema. U Solution prozoru kliknite desnim
tasterom miša folder Controllers, zatim na Add i na Controllers…
Odaberite MVC 5
Controller – Empty. Kliknite na Add, zatim nazovite kontroler
ContentsController. Obratite pažnju da u nazivu kontrolera uvek stoji
Controller bez obzira kako ćete nazvati kontroler. Kliknite na Add i vaš
kontroler će biti kreiran i izgledaće ovako:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace HelloWorld.Controllers
{
public class ContentsController : Controller
{
// GET:
Contents
public ActionResult Contents()
{
return View();
}
}
}
Kontroler
ContentsController se sastoji od jednog akcionog upita. Nema potrebe tu ništa
da menjate. Postavite kursor od miša bilo gde u metodi i kliknite desnim
tasterom miša. Zatim, kliknite na Add View. Na
ovaj način kreiramo View koji će biti pozvan kad se pokrene akcioni upit.
Pritisnite
dugme Add. Pogledajte u prozor Solution, kliknite na folder Views i videćete da
vam je kreiran folder Contents i fajl Contents.cshtml. Kliknite na fajl i
dodajte jednu liniju koda u čistom HTML jeziku:
@{
ViewBag.Title = "Contents";
}
<h2>Hello
World</h2>
U ovom
jednostavnom primeru nemamo potrebe da pravimo modul. Međutim, hoćemo da u
navigacionom toolbar-u omogućimo link Contents koji će aktivirati naš prikaz. Zato
pređite na folder Views u Solution prozoru, kliknite na folder Shared, zatim
kliknite na fajl _Layout.cshtml. Promenite code da izgleda ovako, samo umesto
mog imena unesite svoje.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,
initial-scale=1.0">
<title>@ViewBag.Title -
My ASP.NET Application</title>
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
@Html.ActionLink("Manuel Radovanovic's
Tutorials", "Index", "Home", new { area = ""
}, new { @class = "navbar-brand" })
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li>@Html.ActionLink("Home", "Index",
"Home")</li>
<li>@Html.ActionLink("Contents","Contents","Contents")</li>
<li>@Html.ActionLink("About", "About",
"Home")</li>
<li>@Html.ActionLink("Contact", "Contact",
"Home")</li>
</ul>
@Html.Partial("_LoginPartial")
</div>
</div>
</div>
<div class="container body-content">
@RenderBody()
<hr />
<footer>
<p>© @DateTime.Now.Year
- My ASP.NET Application</p>
</footer>
</div>
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@RenderSection("scripts", required: false)
</body>
</html>
To
je mala promena i to je sve što treba da uradite. Pritisnite F5 i pogledajte
šta ste sve kreirali sa tako malo rada.
Ukoliko
trenutno ne programirate možete pogledati video kako to sve izgleda:
( ASP .Net MVC - 1#. Hello World )
Nema komentara:
Objavi komentar