1. A Real World MVC Application with some other groovy stuff thrown in James Johnson Developer AdvocatesLos Angeles C# User Group Tuesday, November 1, 2011

2. Who I amFounder and President of the Inland Empire .NET Users GroupThree time and current Microsoft MVP CADSoftware developer by daySerial netrepreneur by nightPartner in Developer AdvocatesEasily distracted by acronyms and shiny objects 3. Developer AdvocatesHelping small to medium size software companies through Evangelism and Advocacy Blog Articles Webcasts Presentations User group meetings Code Camps Regional Tech Conferences 4. Agenda Demo of web site Comparing Web Forms to MVC Entity Framework Administration Bad words Uploading images Ajax and JavaScript Ratings Paging Searching Tweeting 5. Aphirm.it New thought and spiritual affirmations Always have been a new thinker and hippie Sister site to Windows Phone 7 app Some bad words will be shown for the demo 6. Aphirm.it Rotating aphirm.its Simple registration Beginner badge 7. ASP.NET MVC Models Views Controllers ViewModels No Postbacks Very limited use of existing server controls Clean HTML makes CSS and JavaScript easier What all the cool kids are using these days 8. ASP.NET MVCViewState 9. ASP.NET MVC No ViewState 10. Entity Framework Version 4 released with .NET 4.0 New version (4.1) allows for model-first, code-first ordatabase-first development Maps POCO objects to database objects A collection of things instead of a dataset of rows things are the entities 11. Entity Framework Why? Adds a layer of abstraction between database and code DBA can structure database how they want Developer can map to the database how they want Rename entities for more comfortable use Entity Framework handles the mappings 12. Entity Framework Entity Data Model EDM Deals with the entities and relationships they use Entities Instance of EntityType Represent individual instances of the objects Customer, book, shoe, aphirmit Fully typed Relationships between look up tables are mapped asassociations in the EDMX 13. Entity Framework csdl Conceptual Schema Definition Language The conceputal schema for the EDM EntityContainer, EntitySet, EntityType definitions ssdl Store Schema Definition Language Schematic representation of the data store msl Mapping Specification Language Sits between the csdl and ssld and maps the entity properties 14. Entity Framework Lazy LoadingA design pattern to defer initialization until neededcontext.ContextOptions.DeferredLoadingEnabled=true;List cases = context.BookCase.ToList();foreach(var bookcase in cases){var books = bookcase.Books;} 15. Entity FrameworkEager LoadingUse if you will be needing every related entityList cases =context.BookCase.Include(Books).ToList();foreach(var bookcase in cases){var books = bookcase.Books;} 16. Entity FrameworkContexts The context is the instance of the entity Passing an entity around to tiers breaks the context Just like the song, make sure the context remains the same 17. Entity FrameworkContextspublic class ModelHelper{ private static CourseEntities _db; public static CourseEntities CourseEntities { get { if(_db == null) _db = new CourseEntities(); return _db; } set { _db = value; } } }private readonly CourseEntities _db = new CourseEntities(); 18. Entity Framework Contextsprivate Student AddStudent(Student student, Course course){student.Courses.Add(course);_db.SaveChanges();}Didnt work because course was in a different contextprivate Student AddStudent(Student student, Course course){var newStudent = GetStudent(student.Id);var newCourse = GetCourse(course.Id);newStudent.Courses.Add(newCourse);_db.SaveChanges();} 19. Entity FrameworkLINQ to Entities Very similar to LINQ to SQL Major differenceLINQ to SQL SingleOrDefault()LINQ to Entities FirstOrDefault() 20. Entity Framework LINQ to EntitiesSelectingThing thing = _db.Things.Single(x=>x.Id == id);Deletingpublic void DeleteThing(Thing thing){ _db.DeleteObject(thing); _db.SaveChanges();} 21. Entity Framework LINQ to EntitiesAdding (Inserting)public void AddThing(Thing thing){ _db.AddToThings(thing) //this will be a list _db.SaveChanges()// of AddTo}Editing (Updating)public void EditThing(Thing thing){ _db.Things.Attach(new Thing{Id=thing.Id}); _db.Things.ApplyCurrentValues(thing); _db.SaveChanges();} 22. Entity FrameworkRepositories Repository pattern encapsulates code into a separate class Allows for easy changes Can use it to swith database providers or new technologies Stephen Walther ASP.NET MVC Framework, Sams stephenwalther.com Download the code link Add the two projects to your solution Add references to your project 23. Entity FrameworkRepositoriesusing GenericRepositorypublic class MyController{ private readonly IGenericRepository _repo; private readonly CourseEntities _db;public MyController(){_repo = newEFGenericRepository.EFGenericRepository(_db);}} 24. Entity Framework Repositories// get _repo.Get(id);// edit _repo.Edit(thing);// create _repo.Create(thing);// delete _repo.Delete(thing);// list var list = _repo.List().Where(x => x.Name.Contains(myName)); 25. Aphirm.it New thought and spiritual affirmations Always have been a new thinker and hippie Sister site to Windows Phone 7 app Some bad words will be shown for the demo 26. Aphirm.it Administration Approve aphirm.its Set IsApproved to true Send email to user Check for badges Tweet new aphirm.it 27. Aphirm.itSetBadgespublic void SetBadges(Aphirmit affirmation){ var memberId = affirmation.MemberId; _db.ResetPostBadges(memberId); //SP in database//get all the aphirmations the user has created var aphList =_aphirmitHelper.GetAphirmitsByMember(memberId) .Where(x => x.IsApproved.Equals(true)).ToList(); var aphCount = aphList.Count; if (aphCount >= 0) //beginnerAddPostBadge(100, memberId);} 28. Aphirm.it AddPostBadgeprivate void AddPostBadge(int badgeId, int memberId){// BadgeIdis the internal Id varbadge = _db.Badges.Single(x => x.BadgeId.Equals(badgeId)); varnewBadge = new MemberBadge() {MemberId = memberId, BadgeId = badge.Id };_db.AddToMemberBadges(newBadge);_db.SaveChanges();} 29. Aphirm.it Uploading Images Using Telerik MVC Upload control@Html.Telerik().Upload().Name("attachments").Async(async => async.Save("UploadAvatar", "Profile")).ClientEvents(events => events.OnSelect("onSelect")).ClientEvents(events => events.OnComplete("onAvatarComplete")).ShowFileList(false) 30. Aphirm.it Uploading Images[HttpPost]public ActionResultUploadAvatar(IEnumerable attachments){ if (attachments == null)return Content("no file was uploaded");HttpPostedFileBase img = attachments.ElementAt(0);var imagePath = _generalHelper.UploadAvatar(img);return Json(new { status = imagePath }, "text/plain");} 31. Aphirm.itUploading Imagesfunction onSelect(e) {var extArray = new Array(".png", ".gif", ".jpg", ".jpeg");var $status = $("div.status");$status.hide();var file = e.files[0];var inArray = $.inArray(file.extension, extArray);if (inArray == -1) {$("div.status").html("Sorry, only PNG, GIF, or JPG images are allowed.").show();e.preventDefault();return false;}} 32. Aphirm.itUploading Imagesfunction onAvatarComplete() {var userName = $("#avatarPath").val();var url = "/Profile/GetMemberAvatar/" + userName;$.getJSON(url, function (json) {//append something to the string so that the image will berefreshed.json = json + "?" + new Date();$("#memberAvatar").attr("src", json);});} 33. Aphirm.itUser Registration Be as minimal as possible Dont ask for all possible data at start Go easy, can always come back for more 34. Aphirm.itUser Registration Use Ajax/JavaScript to help the user Check for existing username before submitting Check for existing email and format 35. Aphirm.itAjax/JavaScriptValidate usernamefunction validateUserName(elem) {var $elem = $(elem);var userName = $elem.val();$elem.attr("valid", true);var url = "/Account/IsExistingUser/";$.get(url, { name: userName }, function (json) {if (json) {$("#userNameTaken").fadeIn();$elem.attr("valid", false).removeClass("valid").addClass("invalid");} else {$("#userNameTaken").fadeOut();$elem.removeClass("invalid").addClass("valid");}});} 36. Aphirm.it Ajax/JavaScriptValidate username[HttpGet]public JsonResult IsExistingUser(string name){ return Json(_memberHelper.IsExistingUser(name), JsonRequestBehavior.AllowGet);} 37. Aphirm.itPaging Use paging when there is more data than can easily be viewed Easy to add page to display There are several jQuery grids available I just like mine 38. Aphirm.it Paging[HttpGet]public ActionResult All(int? id){ int pageIndex; if (id == null)pageIndex = 0; elsepageIndex = (int)id - 1; var pageSize = _generalHelper.GetListSize(); var affirmationList =_affirmationHelper.GetAphirmitRange(pageIndex, pageSize); decimal totalAffirmations = _affirmationHelper.GetApprovedCount(); var pageNumbers = Math.Ceiling(totalAffirmations / pageSize); ViewBag.PageNumbers = pageNumbers; ViewBag.CurrentPage = pageIndex; ViewBag.ListCount = pageSize; ViewBag.Total = totalAffirmations; return View("View", affirmationList); 39. Aphirm.itBad WordsNeed to check text for any bad words the user may have usedvar status = false;var badWords = _repo.List().ToList();foreach (var bWord in badWords.Where(bWord =>aphirmit.Text.IndexOf(bWord.Word) > -1)){ status = true;} 40. Aphirm.it Bad Wordsvar hasBadWords = _affirmationHelper.HasBadWords(affirmation);if (hasBadWords){ TempData["HasBadWords"] = true; return RedirectToAction("Edit", new {id = affirmation.Id});} 41. Aphirm.itBad Wordsif(TempData["HasBadWords"] != null && (bool)TempData["HasBadWords"]){

Your Aphirmit has some unsavory words. If you wouldlike to have it published, you will need to clean it up.

} 42. Questions? 43. Thank youJames JohnsonEmail: james.johnson@developeradvocates.comBlog: www.latringo.meTwitter: latringoPayPal: members@iedotnetug.orgSlides: www.slideshare.net/latringo/real-world-mvcInland Empire .NET Users Group2nd Tuesday of each monthwww.iedotnetug.org