.NET webfejlesztés MVC-vel

avagy webalkalmazás készítése XXI. századi módszerrel

Mottó: Már a statikus weblap is dinamikus?

Különleges kalandra hívjuk az érdeklődőket: ezen a tanfolyamon a nagyhírű, ámde elavult NetAcademia Tudástár új verzióját készítjük el a hallgatókkal közösen. Szerzőtársak leszünk. Nulláról indulunk, hogy a teljes alkalmazásfejlesztés részét képezhesse a tanfolyamnak. Lesz itt pontozási rendszer, levélküldés és minden, ami egy ilyen komoly fórumban elengedhetetlen. Természetesen megismerkedünk a Model, View, Controller szentháromsággal is. Szerveroldalon minden problémára van .NET-es megoldás, kiterjedten használni fogjuk a .NET-keretrendszer képességeit. Böngészőoldalon pedig kénytelenek vagyunk kihasználni a hőn utált JavaScript képességeit, de ezúttal a JQuery könytár bámulatos képességeit kihasználva!

Senkit ne rémisszen el az alábbi, napokra lebontott nem szokványos tematika. Ha valaki a technológiai rövidítéseket hiányolja belőle, íme itt a komplett lista: HTML, CSS, MVC, Razor, SQL, Entity Framework, LINQ, JavaScript, AJAX, JQuery, NuGet, képkezelés, SMTP-levélküldés, RSS, Facebook-integráció, Fiddler, Debugolás

Kinek ajánljuk?
Mindenkinek, aki számít

Szükséges előismeretek
A programozás alapjainak ismerete nem igazán hátrány. Ciklus, elágazás, változók stb. fogalmi szintű ismerete. Ennél több nem kell, a többit megtanuljuk a tanfolyamon.

A tanultak hasznosítása a való világban
Az MVC-programozás tanfolyam végeztével a hallgatók képessé válnak webalkalmazások önálló létrehozására, adatbáziskapcsolat kialakításával, autentikációval, emailküldéssel, mindennel, ami kell.

Információ a virtuális gépekről
A tanfolyam elvégzéséhez szükséges környezetet egy letölthető virtuális gép formájában minden hallgató számára elérhetővé tesszük.

A tanfolyam hossza
40 óra

A tanfolyam hossza: 43

Ár (online és tantermi részvétel esetén egyaránt)
Magánszemélyek részére (bruttó) 69 000 Ft, cégek, intézmények részére 69 000 Ft + áfa
Ha ketten jelentkeztek, mindketten kaptok 10% ikerkedvezményt.

Kezdési időpont:

Részletes tematika és videók

Minden előadásról videó készül, melyek tetszőlegesen visszanézhetőek innen. A szervezők a tematika változtatásának jogát fenntartják.

1. nap: Első MVC-webalkalmazásom: bugyuta Picasa

2011. május. 25., szerda, 16:30 - 20:00

Elindulunk a File->New Projecttől és eljutunk egy fantasztikus webalkalmazásig, mely képes a feltöltött fényképeinket elegánsan megtekerve megjeleníteni a Tocsi által készített XAML to MVC modul segítségével, amelyik úgy rajzol, mint a kisangyal. Világító grafikus gomb felirattal és füstölgő effekttel? Nem probléma! 37,5 fokban bedöntött fotó? Nem probléma! Megismerkedünk a Razor-szintaxissal, a kiszolgálóoldali programozás szépségeivel, a Model objektummal és a SEO-barát beszédes URL-ekkel. Kialakítjuk mesteroldalunkat, stíluslapot kovácsolunk. Elhelyezünk az oldalon egy Facebook Like gombot, mert anélkül nem élet az élet. Végezetül publikáljuk a produkciót.

MVC_20110525_1630.wmv (.wmv)

344 126Kb

MVC_20110525_1630.zip (.zip)

0Kb

MVC_20110525_1751.wmv (.wmv)

599Kb

MVC_20110525_1751.zip (.zip)

2 562Kb

MVC_20110525_1804.wmv (.wmv)

366 415Kb

MVC_20110525_1804.zip (.zip)

2 567Kb

MVC_20110525_1938.wmv (.wmv)

265 930Kb

MVC_20110525_1938.zip (.zip)

2 699Kb

2. nap: 2. Második MVC-webalkalmazásom: mi az a Doodle?

2011. május. 27., péntek, 16:30 - 20:00

A Doodle nem a Google, hanem egy időpontegyeztető weboldal, érdemes megnézni. Egy hasonló alkalmazást készítünk csoportos bulik időpontegyeztetésére, mert ez a feladat lehetővé teszi hogy megismerkedjünk az adatbáziskezelés, űrlapok, LINQ szépségeivel és/vagy kínszenvedéseivel. A mi weblapunk egyébként jobb lesz, mint az eredeti: fel fogja kínálni, hogy iCalendar formátumban letöltsük, és Outlook-naptárba mentsük a buli kezdőidőpontját.

MVC_20110527_1630.wmv (.wmv)

395 033Kb

MVC_20110527_1630.zip (.zip)

2 787Kb

MVC_20110527_1806.wmv (.wmv)

257 992Kb

MVC_20110527_1806.zip (.zip)

2 787Kb

MVC_20110527_1915.wmv (.wmv)

356 163Kb

MVC_20110527_1915.zip (.zip)

356Kb

MVC_20110527_2031.wmv (.wmv)

896Kb

MVC_20110527_2031.zip (.zip)

2 799Kb

3. nap: A Tudástár projekt indítása

2011. június. 01., szerda, 16:30 - 20:00

Első közelítésben egy ronda, de alapjaiban jól megtervezett Tudástárat pakolunk össze, benne a Tudástár objektummodelljével (OOP!), megjelenítéssel, bejelentkezéssel, szerkeszthetőséggel. Már ezen az alkalmon „meg fog szólalni” az alkalmazás, hiszen a szükséges elemeket (Controller, Action, View) már megismertük a korábbi két feladat során. A kérdésekhez válaszokat is lehet adni, így azt mondhatjuk, hogy az első alkalommal már kész is van minden. De akkor mit fogunk csinálni a hátralévő hét alkalommal?

MVC_20110601_1633.wmv (.wmv)

221 312Kb

MVC_20110601_1633.zip (.zip)

2 383Kb

MVC_20110601_1733.wmv (.wmv)

1 442Kb

MVC_20110601_1733.zip (.zip)

2 764Kb

MVC_20110601_1744.wmv (.wmv)

351 292Kb

MVC_20110601_1744.zip (.zip)

5 487Kb

MVC_20110601_1925.wmv (.wmv)

265 230Kb

MVC_20110601_1925.zip (.zip)

3 617Kb

4. nap: In Place Editing

2011. június. 03., péntek, 16:30 - 20:00

A fejlesztés következő lépése, amikor az eddig készített űrlapalapú adatbeviteli megoldást felülvizsgáljuk, és ahol értelme van, áttérünk a jelenlegi böngészők által össze-vissza támogatott In Place, azaz helyben történő szerkesztésre. Megnézzük az In Place szerkesztés alapjait, majd kiválasztunk egy kész komponenst, és felhasználjuk jól.

0wkcr1b1.Szerkeszto3.zip (.zip)

2 519Kb

f00anolj.Szerkeszto2.zip (.zip)

2 443Kb

gwbpldal.Szerkeszto1.zip (.zip)

2 441Kb

MVC_20110603_1640.docx (.docx)

32Kb

MVC_20110603_1640.wmv (.wmv)

350 832Kb

MVC_20110603_1640.zip (.zip)

2 763Kb

MVC_20110603_1820.docx (.docx)

33Kb

MVC_20110603_1820.wmv (.wmv)

352 423Kb

MVC_20110603_1820.zip (.zip)

2 766Kb

MVC_20110603_1953.docx (.docx)

32Kb

MVC_20110603_1953.wmv (.wmv)

210 397Kb

MVC_20110603_1953.zip (.zip)

2 838Kb

5. nap: Válaszvarázsló

2011. június. 08., szerda, 16:30 - 20:00

A korábbi Tudástár óriási problémája volt, hogy idővel minden kérdést megkérdeztek kétszer-háromszor, mivel a kérdés megfogalmazásakor nem jött fel, hogy korábban ez a téma már szerepelt. A Válaszvarázsló a háttérben AJAX-hívásokkal kérdezgeti a rendszert, és dinamikusan felkínálja a hasonló kérdéseket, hátha a kérdező meggondolja magát. Mire ezt a működést összerakjuk, mindenki AJAX-gurunak érezheti magát.

01yt3b3w.tudastar.xml (.xml)

74Kb

2r223btj.jquery.tmpl.js (.js)

18Kb

3ftkjm0q.futurecolors-jquery.cheatsheet.1.51.pdf (.pdf)

1 044Kb

cdfr1hks.Tudastar-adatinit.zip (.zip)

3 328Kb

hywhdi3o.Tudastar1.0.zip (.zip)

3 318Kb

lu3l0bsj.jquery.tmpl.min.js (.js)

5Kb

MVC_20110608_1633.docx (.docx)

32Kb

MVC_20110608_1633.wmv (.wmv)

284 402Kb

MVC_20110608_1633.zip (.zip)

10 219Kb

MVC_20110608_1755.docx (.docx)

33Kb

MVC_20110608_1755.wmv (.wmv)

277 990Kb

MVC_20110608_1755.zip (.zip)

3 740Kb

MVC_20110608_1919.docx (.docx)

33Kb

MVC_20110608_1919.wmv (.wmv)

318 458Kb

MVC_20110608_1919.zip (.zip)

5 017Kb

q504zqpc.Tudastar1.2.zip (.zip)

3 444Kb

scs3bovy.Tudastar1.1.zip (.zip)

3 363Kb

uuc33y0l.jQuery-1.5-Visual-Cheat-Sheet.pdf (.pdf)

336Kb

zpxxv5mg.Tudastar2.0.zip (.zip)

3 456Kb

6. nap: Kulcsszókezelés

2011. június. 10., péntek, 16:30 - 20:00

Minden alkalmazásban kulcsszerepet tölt be a kulcsszórendszer. Nálunk ez nemcsak a kulcsszavak egyszerű rögzítését jelenti, hanem kulcsszókövetést (a felhasználók feliratkozhatnak kulcsszavakra), valamint a kulcsszavak intelligens felvitelét is, hogy minden új kérdező láthassa, milyen kulcsszavak vannak már bent a rendszerben, mennyire népszerű egy kulcsszó stb. A kulcsszavakra feliratkozott tagoknak SMTP-levelet küldünk,ha új hozzászólás használja a kedvenc kulcsszavát.

24cjtygy.Tudastar6.2.zip (.zip)

3 669Kb

41rbplwt.Tudastar6.3.zip (.zip)

3 678Kb

51lejaxk.Tudastar6.1.zip (.zip)

3 466Kb

fntel5dl.Tudastar6.0.zip (.zip)

3 463Kb

MVC_20110610_1630.docx (.docx)

32Kb

MVC_20110610_1630.wmv (.wmv)

248 502Kb

MVC_20110610_1630.zip (.zip)

3 758Kb

MVC_20110610_1745.docx (.docx)

33Kb

MVC_20110610_1745.wmv (.wmv)

238 776Kb

MVC_20110610_1745.zip (.zip)

3 762Kb

MVC_20110610_1859.docx (.docx)

33Kb

MVC_20110610_1859.wmv (.wmv)

389 895Kb

MVC_20110610_1859.zip (.zip)

7 551Kb

7. nap: Forráskódszínezés, SMTP-levelezés, hibakezelés

2011. június. 17., péntek, 16:30 - 20:00

A felhasználók által felvitt adatok manipulálása, érvényességének ellenőrzése fontos témakör. A validáláson túlmenően most egy olyan megoldást mutatunk be, mely aktívan beavatkozik a felhasználói adatokba, és a kérdésben megjelenő programkódot kiszínezi, mintha a Visual Studio tette volna. Emellett megvalósítjuk a Tudástár SMTP-levélküldését (értesítés küldése a feliratkozottaknak), és ha már itt tartunk, a régóta halogatott hibakezelést is áttekintjük, beállítjuk, megvalósítjuk. A nap végén egy órában végignézzük az MVC routing rendszerét.

23jywehq.Tudastar7.2.zip (.zip)

6 322Kb

2qqdi0hj.Tudastar7.1.zip (.zip)

3 748Kb

clvj0sle.Tudastar7.0.zip (.zip)

3 696Kb

hm0lyflh.Tudastar7.2.1.zip (.zip)

6 322Kb

MVC_20110617_1630.docx (.docx)

32Kb

MVC_20110617_1630.wmv (.wmv)

294 520Kb

MVC_20110617_1630.zip (.zip)

3 976Kb

MVC_20110617_1752.docx (.docx)

32Kb

MVC_20110617_1752.wmv (.wmv)

263 062Kb

MVC_20110617_1752.zip (.zip)

4 025Kb

MVC_20110617_1859.docx (.docx)

32Kb

MVC_20110617_1859.wmv (.wmv)

332 850Kb

MVC_20110617_1859.zip (.zip)

12 552Kb

8. nap: Értékelési rendszer

2011. június. 22., szerda, 16:30 - 20:00

A Tudástár tartalmának értékét nagyban növeli, ha a válaszokat mind felfelé, mind lefelé pontozni lehet. (Természetesen aszinkron AJAX-hívással.) Ami ezen túlmutat, hogy az értékelések kialakítanak egyfajta megbízhatósági pontszámot a tagok között, amihez különböző jogosultságokat lehet rendelni. Ez nem az MVC megszokott, forráskódba bevarrt jogosultságellenőrzése lesz, hanem egy dinamikus, menet közben automatikusan változó jogrendszer, minden lusta webadmin álma.

Ezen felül a mai alkalommal megnézzük az MVC beléptett adatellenőrzési (validálási) lehetőségeit.

bimdtvst.vote.zip (.zip)

5Kb

MVC_20110622_1633.docx (.docx)

32Kb

MVC_20110622_1633.wmv (.wmv)

349 470Kb

MVC_20110622_1633.zip (.zip)

6 468Kb

MVC_20110622_1805.docx (.docx)

33Kb

MVC_20110622_1805.wmv (.wmv)

230 139Kb

MVC_20110622_1805.zip (.zip)

6 473Kb

MVC_20110622_1910.docx (.docx)

32Kb

MVC_20110622_1910.wmv (.wmv)

319 766Kb

MVC_20110622_1910.zip (.zip)

2 753Kb

oo4zgab0.Adatellenorzes.zip (.zip)

2 432Kb

ptuuhfdu.Tudastar8.1.zip (.zip)

6 331Kb

xkwsuq1z.Tudastar8.2.zip (.zip)

6 343Kb

9. nap: Adatbáziscsatlakozás

2011. június. 24., péntek, 16:30 - 20:00

Csodálatos Tudástárunk jelenleg Code First módon menti az adatokat, de sokakat izgat a Database First megközelítés. Valójában szándékosan hagytuk ezt a lépést a végére, hogy egy olyan alkalmazásfelesztési modellt mutassunk be, mely élesen elválik az adatbázis az objektumoktól, ezért független az alatta elterülő adatbázistól. Az objektumaink és az adatbázistáblák közötti kapcsolatot Entity Frameworkkel fogjuk megvalósítani.

0vb0qoow.Tudastar9.1.zip (.zip)

6 328Kb

cch3eqrj.SajatAdatbazis_log.LDF (.LDF)

576Kb

i1gyq4ya.SajatAdatbazis.mdf (.mdf)

2 304Kb

lrujddla.Entitasok.zip (.zip)

2 634Kb

MVC_20110624_1641.docx (.docx)

32Kb

MVC_20110624_1641.wmv (.wmv)

454 983Kb

MVC_20110624_1641.zip (.zip)

12 553Kb

MVC_20110624_1831.wmv (.wmv)

276 600Kb

MVC_20110624_1831.zip (.zip)

515Kb

MVC_20110624_1956.docx (.docx)

32Kb

MVC_20110624_1956.wmv (.wmv)

144 258Kb

MVC_20110624_1956.zip (.zip)

355Kb

MVC_20110624_2029.wmv (.wmv)

1 646Kb

MVC_20110624_2029.zip (.zip)

2 948Kb

zpk1ulwu.Tudastar9.2.zip (.zip)

6 332Kb

10. nap: Finomhangolás, publikálás

2011. június. 29., szerda, 16:30 - 20:00

Az utolsó fejezetben megvalósítjuk a Facebook autentikációt, emellett egy sorozat további MVC-specifikus technológiákat ismertetünk.

A T4 templétek világa megmutatja nekünk, hogy amikor nem írunk kódot, hanem "varázslat" történik, akkor is uralni tudjuk a helyzetet: saját kódgenerátor sablonokat tudunk létrehozni. Saját kód snippet létrehozásával ugyancsak gyorsíthatjuk a programozást. Írunk saját ModelBindert is, bár erre csak nagyon agyament esetekben van szükség.

Megnézzük azt is, hogyan tudjuk figyelembe venni a különböző böngészők képességeit a BrowserCapabilities vizsgálatával. Végül egy mozdulattal készítünk táblázatot és diagramot a weboldalra.

A képkezelés új módját a WebImage obektum tárja elénk: feltöltés, átméretezés, vágás, elforgatás, vízjelezés röptében!

Egyszerű gyorsítótárkezelés végezhető a WebCache objektummal. A "kesselést" egy későbbi alkalommal nézzük át részletesen.

A tanfolyam meghirdetésekor úgy gondoltuk, mára mindennel végzünk, ami majdnem igaz is, de a finomhangolásra további alkalmakat fogunk hirdetni.

01jz14gc.Facebook.zip (.zip)

2Kb

1vbxsqhf.Tudastar10.1.zip (.zip)

6 707Kb

b422pdwl.alma.snippet (.snippet)

1Kb

MVC_20110629_1630.docx (.docx)

32Kb

MVC_20110629_1630.wmv (.wmv)

270 150Kb

MVC_20110629_1630.zip (.zip)

357Kb

MVC_20110629_1741.docx (.docx)

32Kb

MVC_20110629_1741.wmv (.wmv)

279 155Kb

MVC_20110629_1741.zip (.zip)

356Kb

MVC_20110629_1906.docx (.docx)

32Kb

MVC_20110629_1906.wmv (.wmv)

317 758Kb

MVC_20110629_1906.zip (.zip)

10 103Kb

tjjy04g2.Terminator4.zip (.zip)

3 315Kb

11. nap: Bónusznap I.

2011. július. 06., szerda, 16:30 - 20:30

A mai alkalommal a tömeges adatmegjelenítésre alkalmas lapozgatást, valamint a Dependency Injectiont fogjuk megnézni.

coxcmuvu.Lapozos.zip (.zip)

2 434Kb

MVC_20110706_1630.docx (.docx)

33Kb

MVC_20110706_1630.wmv (.wmv)

435 539Kb

MVC_20110706_1630.zip (.zip)

357Kb

MVC_20110706_1820.docx (.docx)

32Kb

MVC_20110706_1820.wmv (.wmv)

353 584Kb

MVC_20110706_1820.zip (.zip)

5 161Kb

vr1vdsfi.DependencyInjectionMEF.zip (.zip)

2 442Kb

12. nap: Bónusznap II.

2011. szeptember. 08., csütörtök, 14:00 - 16:00

A mai alkalommal olyan témaköröket veszünk górcső alá, amelyek egy fejlesztés során szembejöhetnek.

Itt van például az a fura eset, hogy egy szerkesztőmezőben megjelenítünk egy decimal számot, amit módosítás nélkül sem lehet elmenteni a böngészőben, mert "valami" félrecsúszott a kódolásnál. Vajon mi? Hát a böngésző nyelve!
Hogyan jelenítsünk meg dátum"pickert" egy dátum típusú mezőnél? Persze, a válasz JQuery, no de ott is az a fránya lokalizáció - mindent elront. Vagy mégsem?
Érdekes kérdés, és eddig nem foglalkoztunk vele: hogyan lehet rávenni a webszervert, hogy gyorstárazza ("kesselje") a lapokat, amiket MVC-vel előállítottunk, hogy ne fusson le ugyanaz a kód másodpercenként hatszor?
Érdekes állatfaj a ListBox és a DropDownList. Ismerkedjünk meg velük!
Hogyan kezdenél hozzá egy olyan feladathoz, hogy egy weboldalon egyszerre sok adatrekordot módosíthasson a felhasználó? Ilyen lehet mondjuk egy kérdőív, ami több sorból áll az adatbázisban, de mi egy oldalon akarjuk az összes adatot bekérni
Mi a csuda az a DataType attribútum? Hol használjuk és mire való?

"Dióhéjban" ennyit szeretnék ezalkalommal hozzátenni az MVC-témához. Tart, ameddig tart. A 16:00 csak egy elméleti befejezési időpont!

MVC_20110908_1429_Html.zip (.zip)

357Kb

MVC_20110908_1429_Office.zip (.zip)

29Kb

MVC_20110908_1429_screen.wmv (.wmv) 01:07:41

399 349Kb

MVC_20110908_1548_screen.wmv (.wmv) 01:04:29

321 731Kb

13. nap: Bónusznap III.

2011. október. 04., kedd, 14:00 - 16:00

A múltkori bónusznap maradékát egy újabb bónusznapon fogjuk bepótolni. Témaköreink:

Saját Enum template
Gyári templatek módosítása
Cache
Resource kezelés

Iratkozz fel IT Factory hírlevélre