Showing posts with label tutorials. Show all posts
Showing posts with label tutorials. Show all posts

Monday, February 10, 2020

Some Other Great Asp.Net Core Tutorials in 2020

In the last weeks, I have been looking to further materials and information related to my main subject of study, Asp.Net Core. Even if my main projects are in .Net WPF, I really like the Asp.Net web world, and that's where I am deepening my knowledge.

Before going through the latest tutorials, the material I purchased from the code-maze guys has to be mentioned Asp.Net Core Web API course. This is the most serious course material I probably purchased, but easy to follow, with full support and explanations. I really prefer this approach vs Udemy or Youtube. I like to have a pdf file with explanations, code snippets and code repo, versus the lengthy youtube videos from any trainer, even if they are free.


In addition to the above, lets's see what I have found and studied (all of them, but not very deeply) in the last couple of weeks:

1. The blog of Saineshwar Bager, tutexchange.com

a)
https://tutexchange.com/creating-grid-view-in-asp-net-core-with-custom-searching/

This one contains a tutorial, how to present tabular data with paging, search and sorting data with asp.net core mvc. Really nice and useful one. Medium difficulty.

b)
https://tutexchange.com/how-to-upload-files-and-save-in-database-in-asp-net-core-mvc/


How to upload file content to a MS SQL database, some new idea, maybe I will further this idea on a later project. Really good quality one, as a), so I can only recommend his blog, which is a true delight for Asp.Net Core learners.

2. Another great tutorial source https://dotnetthoughts.net

c) Even if I prepared a Chart.JS tutorial in Dec 2019, this is a great one too, with Google Charts, see
https://dotnetthoughts.net/integrating-google-charts-in-aspnet-core/

d) From the same source, how to deploy an asp.net core app on Heroku:
https://dotnetthoughts.net/hosting-aspnet-core-on-heroku/

Until now I published my small works on Interserver.net, but this time I published my c) and d) learning directly on heroku! :)
https://dotnet-core-chart.herokuapp.com/



3. I always wanted to check the Angular client generation with NSWAG, so I tested this one out:
e) https://elanderson.net/2019/12/using-nswag-to-generate-angular-client-for-an-asp-net-core-3-api/

I wish the explanations were clearer on this site!

4. Also tried this one, Angular Chat app with SignalR

f) https://morioh.com/p/70381fe201a4?f=5c21f93bc16e2556b555ab2f&fbclid=IwAR0i4C9Mw9tfYJKWjTjoEuV8ngIN_lV3oxUevCFlyYXh3IT36NYQzXTjy1I
The idea is great, but the tutorial explanations are a bit superficial.

What would be your additions to the asp.net core tutorial world?

Monday, January 6, 2020

Reviewing Three Asp.Net Core Tutorials


In my process of learning, in parallel to my C# projects, I am going forward with Asp.Net core, researching current practice and future trends. I came across three interesting tutorials, that combine these.

I try to be less elaborate with the review, just not to confuse the reader with too many details. Try all tutorials, and provide your feedback about them! I am a fan of learning from multiple sources, gradually, increasing complexity and depth step by step.



A. https://codinginfinite.com/creating-admin-panel-asp-net-core-mvc-tutorial/#choosing-template

This one, is aiming to build a nice admin LTE background, and use several practical HTML/JS tips.

The part I liked in this tutorial:
1. uses MySQL instead of MS SQL, with EF Core
2. Introduces Logging
3. Uses admin lte template, with all css/js dependencies, and uses also a custom login page
4. provides code repo on GitHub.
5. I see this tutorial as the most impactful to my activities, due to the business-like layout and approach.

What I didn't like about this tutorial:
1. Towards the end of it, it becomes superficial in explanation, hard to follow and understand
2. When I started to host the published version - somehow the admin lte is not working, and displays a mess.
3. The Role-Based Authorization part - I am not able understand this, something more detailed and systematic is needed, with better, step-by step explanations.

B.https://www.jerriepelser.com/tutorials/airport-explorer/

This aims combining Asp.Net Core Razor pages with lots of javascript APIs from the internet, especially those focused on maps and geolocation. I find this tutorial very high quality and easy to follow.

The pros of this tutorial:
1. Combines lots of internet APIs together with Asp.Net Core/Razor
2. Easy to follow despite its complexity
3. Very high quality explanations and step-by-step approach;
4. Provides GitHub Repo with code.

Some of the hardships:
1. Some complexity especially on the Javascript part;
2. The libraries and .net core version seem to be old;

C. https://youtu.be/8DNgdphLvag
This is Tim Corey's next tutorial, an easy introduction to Blazor Server Side. This is some very new technology and his explanations are easy to follow and shared lots of best practices.

The pros:
1. Latest technology;
2. Very easy to follow, excellent explanation;
3. Shares some nice best practices with organizing the code and database access;
4. Code provided.

The cons:
1. The example seems to be very simplistic, I would like to see a more complex application presented.(maybe a next version for him)
2. The technology presented is still not widespread. Waiting to see how Blazor proves to be in 2020 and later. Clearly Blazor Server Side is more stable, but Client side is not yet production ready.

What kind of similar tutorials would you recommend? I am especially interested in the combination of html/js/css with Razor pages (not Blazor, yet) with a focus for business applications.


Tuesday, December 3, 2019

PivotTable.js in .Net Core Razor Pages - Tutorial (With Some More Javascript)



Being a former accountant, and my current projects also serving business processes, I find that Pivot Tables are a must in any application of this kind. I struggled without them but now I found a solution, using an Open Source Javascript Library.

I already implemented some of the functionality in one of my projects, but I have to admit that it was a little bit hard, that's why I want to help by showing this example.

Prerequisites for this tutorial:
1. intermediate javascript;
2. basic .Net Core Razor pages knowledge (recommended reading list: https://mydev-journey.blogspot.com/2019/11/razor-pages-not-for-shaving.html
3. study briefly the documentation of pivottable.js, take the simple one: https://pivottable.js.org/examples/simple_ui.html;
4. clone the official repo https://github.com/nicolaskruchten/pivottable
5. my previous tutorial on ChartJS, has a very similar approach and result, and might be a learning step towards this more advanced tutorial: https://mydev-journey.blogspot.com/2019/12/chartjs-tutorial-with-aspnet-core-22.html
6. Repo on Github for this project, to try it:
https://github.com/zoltanhalasz/PivotTableJS

Steps to follow if you want to do it yourself:

A. Create .Net Core Web App (default, razor pages)

B. download pivot table repository from point 4.
Then take the pivot.js and pivot.css files and copy them under the newly created pivot folder in wwwroot.

C. take my _LayoutPivot file and use it instead of the default generated _Layout file from Shared. My _LayoutPivot file will contain all proper references to jquery and pivot.js. Then include it in the _ViewStart file, like :     Layout = "_LayoutPivot";

D. Create InvoiceModel Class, with Json Properties Annotation, this is the main entity for the listing.


E. Create InvoiceService Class which will be injected in the constructor of Index page class. (and set up in Startup.cs).


F. The index cshtml page will just iterate through the list of invoices retrieved by the service and display them.
The backend part in PageModel class will be comprised of:
1. the OnGet function - prepare the data to display
2. the other function - OnGetInvoicePivotData - will pass the JSON array to the javascript fetch in the page.


G. The scripts in the index.cshtml page: below the list of invoices you can find:
1. the pivot - javascript code - retrieving the list using fetch and then giving it to pivotUI function, as per documentation mentioned above.
2. an export to excel (code from stack overflow- how to export an html table to excel from javascript), tailored to export our pivot table.


H. Final result should display as below, showing the list and the pivot table also, together with the Export button:




Monday, November 4, 2019

Javascript - the biggest discovery of 2019

As I mentioned earlier ,  I had the occasion this year to learn Javascript. And later a little bit of Typescript together with Angular.

This was a major breakthrough for me, because I did not know almost any of it before!



The steps of learning were the following:
1. learn syntax, basic structures
2. array, string, date functions, IIFE, arrow functions, callbacks
3. classes and objects
4. promises and Fetch function, a little bit of async/await
5. learn node.js, with express and mySql database.

Finally, I was able to build small APIs to Insert, Update, Delete etc data from a MySQL database.
This took aproximately 3 months to master, with weekly 8-10 hours as average. I kept a constant pace, solving a lot of small exercises in the beginning. As I mentioned, this was part of a code-camp called Smartware Academy, organized by a local company.

Some of the resourced I used:
Then, behavior of DOM -> very useful https://www.w3schools.com/js/js_htmldom.asp

The easy part was:
- similarity to known languages (C#)
- a lot of resources and tutorials online
- some good support from the mentors in the course

The hard part was:
- constantly using console.log to show the values of variables during execution/debugging
- DOM - new concepts and behaviour
- callback functions - really strange - and callback hell

Finally, lately I got into a little bit of Jquery/w bootstrap. Really useful, this is still ongoing for me as I want to integrate this into my Razor Pages application.

And now about Angular -  I did quite a few tutorials (maybe 30-40 in total), as I described in my blog post. And yes, I would like to deepen my Typescript experience, since this is one of the coolest trends in the Web stack. I mean, really useful, especially if you come from the C#/Java world, some concepts are borrowed to make your life easier in Javascript.


PS: Does anybody have good ideas about learning Jquery with bootstrap?

Sunday, November 3, 2019

Razor Pages - Not For Shaving!

This is absolutely fantastic! Easier to understand than MVC, and some additional features vs old .net Razor pages! Using Entity Framework Core.

What is Razor pages?
  • ASP.NET Core Razor Pages is a page-focused framework for building dynamic, data-driven web sites with clean separation of concerns. 
  • Razor Pages can make coding page-focused scenarios easier and more productive than using controllers and views.

Best tutorials, I did them all:
1. https://www.learnrazorpages.com/razor-pages/tutorial/bakery
2.  https://docs.microsoft.com/en-us/aspnet/core/razor-pages/?view=aspnetcore-2.2&tabs=visual-studio
3. https://kenhaggerty.com/
4. https://www.codeproject.com/Articles/1263791/ASP-NET-Core-Razor-Pages-Using-EntityFramework-Cor
5.https://www.youtube.com/watch?v=vh0UqlnM0Jw

Currently I build a small project, using EF core, which connects to an Azure database.It has aprox 15 pages, and uses a lot of Linq expressions.
Guys, did any of you have contact with this technology?
Do you have any tips?

Angular? This is real tutorial hell. (but it's worth it)

During the summer of last year, one of my friends I used to go swimming together, mentioned he recommends Angular to me if I want to learn programming seriously.

What an idea...

In February 2019 I started to study Angular and do lots of tutorials. Besides my course and big project which was finalized in summer of 2019, I studied this Javascript framework.

Imagine, I started doing Angular tutorials, and parallelly learned Javascript (ECMA 2015).
My main source of angular tutorials:
- https://angular.io/tutorial
- lots of smaller, simple tutorials : https://javabrains.io/courses/angular_basics/
- later on angular+firestore: https://fireship.io/
- some angular + material tutorials

It took me about 6 months, with weekly 1-2 tutorials, some of which have been quite superficial, copy paste etc. That's tutorial hell! I think now I am the best at faking angular tutorials... I became MEAN in the meanwhile, going through this hell.

Imagine my frustration in the beginning trying to use Web-API for back-end... from .net core and node.js... but that's a different story, maybe for another blog post.

But, around June 2019, I succeeded with some nice applications, one of which I can show below:

https://songlist-varad.firebaseapp.com/



To be honest, it is a replica of an existing tutorial, tailored to my needs:
https://angular-templates.io/tutorials/about/angular-crud-with-firebase

In spite of all odds, this Angular hell has some value. It was hard, steep learning curve. But now I know I don't have to be stopped by new technologies or complex code. Everything has to be taken slowly, maybe only 20 min of focused learning per day. Excellent source was : fireship.io.

This HELL - is worth it!!

Journey to Web Programming

After my big project began to finalize, I decided to quit my day job as controller.  In the meantime I had the opportunity to participate in an intensive Web-Development class locally, organized by a local Software Company.

https://www.smartware-academy.ro/

Lessons learned during the 12 week course were:
  • html with css (for me css was quite new!!)
  • Javascript, basics, classes, algorithms
  • Node.js with MySQL for back-end
  • we constructed a Note-manager, a small application similar to a mini-blog, called Smart Notes
This was an excellent opportunity! I learned JS here from scratch - really focusing on technique and self-discipline. I took all the steps slowly but steadily, almost every day exercising, doing challenges etc.

Node.js is fantastic for creating fast back-end projects. We used simple node.js web-apis to get and post data to the mysql database (notes, users, pictures).

Tools used:
- Cloud 9
- VS Code
- no CSS framework
- html and css written in "notepad" style
- NodeJS with express.s


This journey lead me to deepen my interest to web-programming, the MEAN stack in special.
 
I did this course while finalizing my big project, mentioned in my first two posts. I do think I added a lot to my C# knowledge, and I recognize Javascript is the biggest discovery for me in 2019!

My first big project (.NET) - and technologies used.



In the summer of 2017, together with my former finance manager, I began to design an internal recharge system for the company.
The choice was WPF for Windows (https://docs.microsoft.com/en-us/dotnet/framework/wpf/getting-started/walkthrough-my-first-wpf-desktop-application) using the old .NET, and an MS SQL Database.

We began to learn, exercise and think about the tools to use:
Our inspiration was: https://www.iamtimcorey.com/
1. IDE: Visual Studio Community 2017
2. WPF - for the visual part, front-end
3. ORM - Dapper - I think this is the best discovery ever! Tim speaks about this in his Videos.
https://www.iamtimcorey.com/blog/137806/entity-framework 

Please, check out his videos, about SQL, C# and lots of serious tutorials and courses.
 (https://stackexchange.github.io/Dapper/)
See also: https://dapper-tutorial.net/
4. MS SQL - I needed to review my SQL knowledge. Did a lot of exercises, and build many stored procedures for the application - dapper maps the entities to the data returned by those stored procedures, and I also used SP to insert and update entity data. Even if this was very time consuming in the beginning, proves to be very efficient and goal oriented.
5. lots of company data about expenses and the algorithm to create allocation keys - business logic designed together with Finance Manager.

The journey was hard. It took me probably 1 year to really get some speed, and show something to my Finance Manager colleague.

Luckily, I had my finance background, to understand the process we tried to automate, as there was a working excel macro/formula model as well used before the application.

But, I needed to fix my knowledge of C# (also using MVVM the first time for WPF) and SQL/Dapper. This meant weekly 2-3 hours of coding for 1 year to get some traction.
Main source for C# was google and Tim Corey, and my big discoveries were:
  • lists/collections of items 
  • LINQ and the foreach 
  • breaking down the tasks to smaller chunks and functions
  • writing a services class to export lists to excel using OpenXML
  • first steps in async/await

A special challenge was how to integrate the good old WinForm control ReportViewer into WPF and MVVM. I will detail these maybe in another blog post.