As a part of DotNetConf the new version 7 of .NET was revealed. As always, Microsoft had a lot of exiciting news. One of the things that really caught my eye was some of the new stuff they added to Blazor. I was lucky to work with Blazor server on my last contract and I have to say that I was immensely impressed with Microsofts 'answer' to the other frontend frameworks like React, Angular and Vue. 

Steven Sanderson had a very interesting talk about some of the new features that has been implemented in Blazor in .NET 7. Most of the new features work in all three flavours of Blazor (server, WebAssembly (aka WASM) and .NET Maui). Especially one of the new features is the QuickGrid, which solves a problem that many developers has tried solving many times during their carreer: showing tabular data in a search table with pagination.

QuickGrid.gif

A quick disclaimer: Even though QuickGrid technically is a part of .NET 7 it is not officially released. It's only in public preview and the API might change a little bit before it is fully launched. So if you want to play around with it, you need to install one of the daily builds of version 7.0.2xx on the dotnet Github page. It will also require the latest version of Visual Studio. 

The QuickGrid component allows you to create a sortable table with pagination in a matter of minutes. But let's take a look at the different part of the code. 

<Paginator Value="@pagination" />

<QuickGrid Items="@products" Pagination="@pagination">

    <PropertyColumn Property="@(p => p.Category.CategoryName)" Sortable="true" />

    <PropertyColumn Property="@(p => p.Supplier.CompanyName)" Sortable="true" />

    <PropertyColumn Property="@(p => p.ProductName)" Sortable="true">

        <ColumnOptions>

            <input @bind="@filter" placeholder="Search..." class="form-control" autofocus

                   @bind:event="oninput"

                   @bind:after="UpdateFilter" />

        </ColumnOptions>

    </PropertyColumn>

</QuickGrid>

 

@code {

    [Inject]

    public IProductRepository? ProductsRepository { get; set; }

 

    private IQueryable<Product>? products;

    private PaginationState pagination = new PaginationState { ItemsPerPage = 30 };

    private string? filter;

 

    protected override void OnInitialized()

    {

        UpdateFilter();

    }

 

    private void UpdateFilter()

    {

        products = ProductsRepository?.SearchProducts(filter);

    }

}

The QuickGrid component is obviously the main thing here. The Items property points to the collection of items that should be handled by the QuickGrid. This must be of the type IQueryable<T> where T is the type of objects. The Pagination property should be hooked up to a PaginationState, which is new'ed up in the class, with a variable telling it to have 30 items pr. page. Please note that the Pagination is not required. If the QuickGrid should show all the entries in the Items property, the Pagination property can be omitted. 

A PropertyColumn is added for each column that should be shown in the table. The most basic PropertyColumn has a lambda expression pointing to the property that should be shown and the Sortable property determines if the column should be sortable or not.

If it is required to have a bit more flexibility with the column, it is possible to add a ColumnOptions element under a PropertyColumn. Here it is possible to add markup and/or components that should be shown. In the code example a search box will appear when you click the small icon on the header, where you can filter the contents of the table. 

The filtering leverages one of the new 'bind-enhancements' which is also a part of .NET 7. The @bind:after property will point to a method that will be fired each time the variable that the input is bound to (using the @bind parameter) has been updated. So each time the user has entered a new letter in the filter text box UpdateFilter will be called, which will update the list of products, that should be shown in the table. 

Pretty need, huh?

The job-title 'tech lead' is becoming more and more common. But what does a tech lead really do? And what are the common pitfalls that tech leads should avoid?

A tech lead is a developer, that has the overall technical responsibility of a team (sometimes more teams). The tech lead must be a guiding light for the team and the most important task is empowering the team to perform to their fullest potential. The team should continously be guided to become better individual developers and becoming a better and stronger team together. 

The tech lead does not code as much as a regular developer, due to the many extra responsibilites they have. The scrum master, the product owner and the managing boss of the team should be working closely together with the tech lead to facilitate the improved performance of the team measured both in development speed and code quality.

1. A group of people is not a team

The most important task as a tech lead is to enable the team to perform to their true potential. In order to do this you have to create a team out of the group of people that you're leading. What this means is that you have to give the team a common goal and instill confidence in their ability to solve complex problems, when they work together. 

In order to achieve this, team must trust each other and you must have a finger on the pulse at all times, so that you can handle the small problems before they become big problems. Therefore you must make it a priority to develop a good relationship with all of the team members and make sure to keep tabs on their dreams, concerns and general happiness. 

If possible it is a very good idea to have social get-togethers where the team can spend time together outside the office. This could be going to a movie together, eating in a restaurant or something entirely different that makes the team members relax and enjoy each others companionship. Spending time together will build good intercollegial relationships, that will let the team work better together when they're back at the office.

2. Time management is crucial

Many, if not most, tech leads have a background as a developer. But taking the leap up to the tech lead role, means that you will get many other responsibilities on your plate than coding. You will have many more meetings and having focus time where you have time to code, will be much harder to come by, because the team members will come to you for advice. Time management is therefore very important in order for you, to keep an overview over what you have to time to do and more importantly what you do not have time to do. It is a very important skill to be able to say 'no' and this is even more true for a tech lead.

A good idea is to analyze when you work best. Some people work best in the morning, while others work best in the afternoon. Try to block yourself from distractions by booking yourself to a meeting, in the time block where you are most productive. Remember that this will not mean that your team are not allowed to disturb you - your most important task is to help them being productive. But booking a 2 hour meeting with yourself, will atleast deter people outside your team to disturb you on IM or booking you in a meeting.

3. Everything you say and do matters

You are the leader of your team. Your team will expect you to be the guiding light. For this reason they will listen very closely to every word you say, how you say it and (not the least) your body language while you're saying it. You must be very self-conscious about your demenor and be very careful not to be formulate what you say in a negative manner and/or having bad body language. Do not take any shortcuts; keep yourself to the highest standard and your team will follow your lead.

4. Make changes, but no too many at once

The tech lead should always try to have the overview of what is going on in the team. You should keep a list of things that is impeeding the team from performing, things that could work better or differently and other things that directly og indirectly influences the team in a negative way. Make sure to 'compare notes' with the teams scrum master and product owner and see what are the biggest problems and what their resolution could be. 

When you have a complete overview of the problems that you want to solve, it might be tempting to solve them all at once, however it is recommended that you do not change too many things all at once. Humans are creatures of habit and some may have problems handling when too many things change at once. Prioritize your list of changes and take it one at a time.

5. Ask 'why' 5 times

This trick is really an extension of the trick above. When you identify something that you think is a problem or you are puzzled why something is done in a specific way, you book a meeting with the people who knows most about the topic. Descripe what you've observed and ask 'why' it is done in this way. Listen to the answer and (if possible) ask 'why' again. It often takes up to 5 'why's' until you have the real answer/core problem. 

6. Don't fake it till you make it

The tech lead will participate in many technical discussions with the team, when complex problems come up. Chances are that you will be discussing topics that you're an expert on. Do not fall for the temptation to 'fake it 'til you make it'. Your team are proberly very skilled and intelligent and even though they might not be expert themselves, they can see right through when you're faking to know what you're talking about. Instead you should have the courage to say when you are unsure about something and invite the team to figure out the solution together. The team will respect your honesty and show your professional integrity and fell empowered when you figure out the solution together as a team.

7. Allow the developers to make mistakes

If you think back to the start of you developer-career, you properly remember a lot of the mistakes that you made. While mistakes can be frustrating it is the best way of learning. Even though it can be tempting to 'save' your developer when you see that they are about make a mistake, let them make the mistake (as long as it is not a critical mistake!). Create a working environment where it is normal to make mistakes and learn from them together as a team. When someone makes a mistake, talk about it in the team, so that everyone understands why the mistake was made and how to avoid making the same mistake in the future. This way the whole team lears from their mistakes and grows much faster than it would have if you just corrected the mistake for the individual developer.