I am trying to find small things to learn and add them to a bigger project later this year, perhaps.
My main tutors on the net were Tim Corey, and maybe Nick Chapsas. You can search them on youtube, they have great content.
The new application I have created is a regular todo app which uses:
- blazor server
- material design https://www.matblazor.com/
- a simple list (no database)
Prerequisites:
- asp.net core 3.1 installed on your machine
- intermediate C# and html
Code is under:
https://github.com/zoltanhalasz/TodoList_BlazorServer.git
The application is live: https://todolist-blazorserver.zoltanhalasz.net/todos
You can add material design to a blazor server project:
1.Install-Package MatBlazor
2.Add @using MatBlazor in main _Imports.razor
3.add to _Host.cshtml (head section)
<script src="_content/MatBlazor/dist/matBlazor.js"></script>
<link href="_content/MatBlazor/dist/matBlazor.css" rel="stylesheet" />
The toaster is added to the todo page: see instructions at: https://www.matblazor.com/Toast
I will explain some of the code and application below.
A. The main model class for the todos:
public class TodoModel
{
public int Id { get; set; }
public string Todo { get; set; }
public DateTime Deadline { get; set; }
public bool IsCompleted { get; set; }
}
B. The layout:
Please read the below examples
https://www.matblazor.com/TextField
https://www.matblazor.com/Checkbox
https://www.matblazor.com/DatePicker
https://www.matblazor.com/Button
See list of icons available:
https://www.matblazor.com/Icon
Toast, see tutorial example:
https://www.matblazor.com/Toast
C. The code-behind:
D. Final result:
