Since my favorite programming language is C#, I am going to use C#, but the code should be easily translatable to other languages. (Shaders are in GLSL). For the rendering I will use my own game engine which has a basic 2D renderer. Finally this post isn't for total OpenGL beginners (I won't use any advanced or niche features), so I advise you to visit this amazing website if you don't know much about OpenGL: https://learnopengl.com/

Drawing the player (tank) and the masking object (wood crate)

I will be using a free "tank assets pack" from Kenney, available here: https://kenney.nl/assets/tanks

First we need to enable blend for transparency and depth test:

GL.Enable(EnableCap.Blend);
GL.BlendFunc(BlendingFactor.SrcAlpha, BlendingFactor.OneMinusSrcAlpha);
GL.Enable(EnableCap.DepthTest);

Then we can simply render our player's tank and a wooden crate like this:

_renderer.Begin(_camera.GetProjection());
_renderer.Draw(_tank, _tankPosition, Color4.White, _tankPosition.Y / 720f);
_renderer.Draw(_crate, new  Vector2(64, 64), Color4.White, 64f / 720f);
_renderer.End();

(720 is the height of the game window, you might want to adjust this value so the depth value is always between 0 and 1)

Transparency sorting is a (hated) famous and common problem. In our case we are going to use a simple solution, which is discarding pixels with alpha value of 0. You can add those line at the end of the main function of the main fragment shader:

if (fragColor.a == 0)
{
    discard;
}

If you have sharp eyes you can see a sort of outline around the tank. This is because the tank texture has some semi-transparent pixels on the edges for making them smoother. Since this is not the main subject of this blog post, I won't go any further.

Drawing the tank's silhouette

For this we will need to write a custom fragment shader which output the tank's shape as a static color:

#version 330

in vec2 vertTexturePosition;
in vec4 vertColor;

uniform sampler2D uSampler;

out vec4 fragColor;

void main()
{
    fragColor = vec4(vertColor.rgb, texture(uSampler, vertTexturePosition).a);
}

We only use the texture to get the alpha value.

Then we are going to enable and disable the depth buffer to get the desired effect. When we disable the depth test, it use the draw order. Here is the drawing code:

// Draw the crate
GL.Enable(EnableCap.DepthTest);
_renderer.Begin(_camera.GetProjection());
_renderer.Draw(_crate, new  Vector2(64, 64), Color4.White, 64f / 720f);
_renderer.End();

// Draw the tank's silhouette
GL.Disable(EnableCap.DepthTest);
_renderer.Begin(_camera.GetProjection(), _silhouetteShaderProgram);
_renderer.Draw(_tank, _tankPosition, Color4.Red);
_renderer.End();

// Draw the tank
GL.Enable(EnableCap.DepthTest);
_renderer.Begin(_camera.GetProjection());
_renderer.Draw(_tank, _tankPosition, Color4.White, _tankPosition.Y / 720f);
_renderer.End();

The first line is the color buffer and the second is the depth buffer. So this is what happens:

1. We enable depth test.
   We draw the crate with a depth value of 0.5 (example value), so we can see the crate on the depth buffer.
2. We disable depth test.
   We draw the silhouette using the custom shader, the depth buffer doesn't change.
3. We enable depth test.
   We draw the tank with a depth value of 0.4, because of the depth test the part behind the crate isn't visible and so we can still see the silhouette.

As previously, first line is the color buffer and second is the depth buffer:

1. We enable depth test.
   We draw the crate with a depth value of 0.5 (example value), so we can see the crate on the depth buffer.
2. We disable depth test.
   We draw the silhouette using the custom shader, the depth buffer doesn't change.
3. We enable depth test.
   We draw the tank with a depth value of 0.6, because of the depth test the tank is drawn over the crate and because of the draw order, in front of the silhouette too.

We could stop here, but again if you have sharp eyes (and a red silhouette) you could see something disturbing. There is a red outline all over the tank, because we are always rendering the silhouette and the tank has some semi-transparent pixels on the edges. If your textures doesn't have semi-transparent pixels, you won't have this problem, but I'll still show you a way to fix it.

Draw the silhouette only where needed

This part is like a bonus and should be applied only if your texture has semi-transparent pixels because we will be doing some extra computation (and every optimization is welcome in game development).

The goal here is to draw the silhouette only where the tank is on the crate. To do this we will be using the stencil buffer as follows:

GL.Enable(EnableCap.DepthTest);
GL.DepthFunc(DepthFunction.Less);
GL.Enable(EnableCap.StencilTest);
GL.StencilFunc(StencilFunction.Always, 1, 0xFFFFFF);
GL.StencilOp(StencilOp.Keep, StencilOp.Keep, StencilOp.Replace);
_renderer.Begin(_camera.GetProjection());
_renderer.Draw(_crate, new Vector2(64, 64), Color4.White, 64f / 720f);
_renderer.End();

GL.StencilFunc(StencilFunction.Equal, 1, 0xFFFFFF);
GL.StencilOp(StencilOp.Keep, StencilOp.Keep, StencilOp.Incr);
GL.ColorMask(false, false, false, false);
GL.DepthMask(false);
_renderer.Begin(_camera.GetProjection());
_renderer.Draw(_tank, _tankPosition, Color4.White, _tankPosition.Y / 720f);
_renderer.End();

GL.ColorMask(true, true, true, true);
GL.DepthMask(true);
GL.Disable(EnableCap.DepthTest);
_renderer.Begin(_camera.GetProjection(), _silhouetteShaderProgram);
_renderer.Draw(_tank, _tankPosition, Color4.Red);
_renderer.End();

GL.Enable(EnableCap.DepthTest);
GL.Disable(EnableCap.StencilTest);
_renderer.Begin(_camera.GetProjection());
_renderer.Draw(_tank, _tankPosition, Color4.White, _tankPosition.Y / 720f);
_renderer.End();

Now we have a third line corresponding to the stencil buffer. Here is what's happening:

1. We enable depth test and stencil test, we set the stencil function to "always" with value of 1 and a default mask (0xFFFFFF), we set the stencil operations to keep/keep/replace. Basically it means that for each drawn pixel we will put the value 1 in the stencil buffer. We draw the crate, we can see both the depth buffer and stencil buffer have changed.
2. We set the stencil function to "equal" with value of 1 and same default mask, we set the stencil operations to keep/keep/incr.  It means that we will increment the stencil buffer by 1 wherever the current value is already 1 (so where the crate has been previously drawn). We set the color mask to false/false/false/false to disable color buffer writing and the depth mask to false to disable depth buffer writing.
   We draw the tank and no buffer is affected because the tank is behind the crate.
3. We set back the color mask to true/true/true/true and the depth mask to true. We disable the depth test.
   We draw the silhouette and because if the stencil test, it is drawn only where the stencil buffer has a value of 1 which correspond of where the crate has been drawn.
4. We enable depth test again and disable stencil test.
   We draw the final tank and it looks good! No red outline is visible anymore.

The process is pretty much the same when the tank is in the front except the stencil buffer on the second step is incremented by 1 where the tank is drawn. So the silhouette isn't drawn at all during step 3.

Hope it has been useful, feel free to comment if you have any question or suggestion.

The goal is to redirect a non-authenticated user to a login page automatically. The code works for both client-side and server-side. For this we are going to create a component that will check the authentication state on each (protected) page.

First step is to create the component. I named it RedirectToLogin.razor, below is the code:

@inject NavigationManager Navigation

@code {

    [CascadingParameter]
    private Task<AuthenticationState> AuthenticationStateTask { get; set; }

    protected override async Task OnInitializedAsync()
    {
        var authenticationState = await AuthenticationStateTask;

        if (authenticationState?.User?.Identity is null || !authenticationState.User.Identity.IsAuthenticated)
        {
            var returnUrl = Navigation.ToBaseRelativePath(Navigation.Uri);

            if (string.IsNullOrWhiteSpace(returnUrl))
                Navigation.NavigateTo("auth/login", true);
            else
                Navigation.NavigateTo($"auth/login?returnUrl={returnUrl}", true);
        }
    }

}

The component uses the AuthenticationState, so you'll need to implement your own AuthenticationStateProvider or use an existing one. The code only checks the user authentication (not any authorization check). If the user is not authenticated, it redirects him to the "auth/login" page or "auth/login?returnUrl=xxx" if the user tried to access a specific page.

The next step is to modify the App.razor file in order to load the component when the user isn't authorized:

<Router AppAssembly="@typeof(Program).Assembly">
    <Found Context="routeData">
        <AuthorizeRouteView RouteData="routeData" DefaultLayout="@typeof(MainLayout)">
            <NotAuthorized>
                <RedirectToLogin></RedirectToLogin>
            </NotAuthorized>
        </AuthorizeRouteView>
    </Found>
    <NotFound>
        <CascadingAuthenticationState>
            <LayoutView Layout="@typeof(MainLayout)">
                <p>Sorry, there's nothing at this address.</p>
            </LayoutView>
        </CascadingAuthenticationState>
    </NotFound>
</Router>

Now if you try to access a protected page (using the Authorize attribute) without being authenticated, you should be redirected to the login page automatically!

P.S. This actual implementation doesn't prevent open redirect attacks, I suggest you to visit this documentation to learn about it: https://docs.microsoft.com/en-us/aspnet/core/security/preventing-open-redirects

Hope you guys enjoyed it! Please comment if you have any question or suggestion.

A typical application's solution would look like this:

I will not go in details about the whole structuring of a .NET Core application in this post, but only show you how to separate all EF Core/database related stuff (DbContext, entities, migrations) from your main project and put it into a library project.

Let's begin!

Before doing anything on your project, I recommend you to install the EF Core global tools by typing this command:

dotnet tool install --global dotnet-ef

Having the dotnet-ef tool installed as global will enables you to use it wherever you want without adding it to a specific project. This tool allows you to manage migrations, your database and more.

The first step is to create the new library project and add it to your solution. Either by using an IDE or typing the following commands: (no project naming convention is required but I usually use "ApplicationName.Database"):

dotnet new classlib -n MyApplication.Database -f netcoreapp3.0 //Create the project

dotnet sln add MyApplication.Database //Add the project to the solution

Once the project is created and added to the solution, you can import it to whatever projects needing it.

Next step is to import the required NuGet packages: Microsoft.EntityFrameworkCore.Design and Microsoft.EntityFrameworkCore.Abstractions

If you already have a DbContext, some migrations and entities in another project, you can move them to the new project and fix namespace/missing libraries issues (ReSharper or Rider is highly recommended here). Else you can create one simply by adding a new class inheriting DbContext and adding a constructor like this:

public class MyApplicationDbContext : DbContext
{
    public MyApplicationDbContext(DbContextOptions<MyApplicationDbContext> options) : base(options)
    {
    }
}

Do not forget to add the DbContext to your service collection if needed by calling serviceCollection.AddDbContext<MyApplicationDbContext> in your startup class.

Then you can create your different entities and add them to your context as usual. Your DbContext might end up looking like this:

public class MyApplicationDbContext : DbContext
{
    public DbSet<Post> Posts { get; set; }
    
    public DbSet<Comment> Comments { get; set; }
    
    public DbSet<Account> Accounts { get; set; }
    
    public MyApplicationDbContext(DbContextOptions<MyApplicationDbContext> options) : base(options)
    {
    }
}

Right now, if you try to generate a migration, it should throws an exception saying "Unable to create an object of type 'MyApplicationDbContext'..." This is totally normal, all you need to do is to tell EF Core how to create a DbContext.

Actually, there is two ways to do it: specify the "startup" project when using dotnet ef commands or create a IDesignTimeDbContextFactory<> in the database project.

To specify your application startup project when using dotnet ef commands, you simply need to add -s pathToStartupProject to your command. Example to generate the initial/first migration and then update the database:

dotnet ef migrations add InitialMigration -p pathToDatabaseProject -s pathToStartupProject

dotnet ef database update -p pathToDatabaseProject

When specifying a startup project, it will use the connection string set in the startup project.

If you don't want to specify the startup project on every command or you'd like to use a database specifically for design time, the other option is to create a custom IDesignTimeDbContextFactory in your "database project" like the following:

public class MyApplicationDbContextFactory : IDesignTimeDbContextFactory<MyApplicationDbContext>
{
    public MyApplicationDbContext CreateDbContext(string[] args)
    {
        var optionsBuilder = new DbContextOptionsBuilder<MyApplicationDbContext>()
            .UseSqlite("Data Source=app.db");
        return new MyApplicationDbContext(optionsBuilder.Options);
    }
}

This example uses the official SQLite provider, but you can use whatever you want (it still needs to be the same provider used in your startup project).

Now you can create migrations and update database without specifying the startup project:

dotnet ef migrations add InitialMigration -p pathToDatabaseProject

dotnet ef database update -p pathToDatabaseProject

If you open your terminal directly in the database project directory, you don't even need to set the project parameter (-p).

Hope you guys enjoyed it! Please comment if you have any question or suggestion.

What's next?

You can put entity classes in another project too, if you need even more separation.

In this post, I'll show you how to implement background jobs, recurring jobs and delayed jobs within an ASP.NET Core 3.0 application using Quartz.Net. (All the code should work with ASP.NET Core 2 too) When it comes to background job in .NET, there is two well-known solutions: Hangfire and Quartz.Net. I would say Hangfire is the most modern and the easier one for basic usage. It is a turnkey solution but whenever you want to do more complex stuff, it becomes tricky or impossible. This is why I've chosen to use Quartz.Net on some of my personal projects and why I'm writing this article.

For the following, I am assuming you know the basics of C# and ASP.NET Core application development. If it's not the case and you're interested in building awesome web applications using one of the most loved programming languages, I encourage you to watch the official tutorials by Microsoft right here.

Let's start!

The first thing you'll need is an ASP.NET Core application, if you don't have one already, you can create one using the command line or your favorite IDE. For this post, I've created a Web API project without authentication using .NET Core 3.0.

Next you'll need to add a package reference to Quartz.Net NuGet package by typing the following command:

dotnet add package Quartz

Then we create and inject a IScheduler as a singleton in our service collection (Startup.cs):

public void ConfigureServices(IServiceCollection services)
{
    services.AddControllers();
    var scheduler = StdSchedulerFactory.GetDefaultScheduler().GetAwaiter().GetResult();
    services.AddSingleton(scheduler);
}

The role of the scheduler is to poll and fire jobs. It is possible to use multiple schedulers in one application, but for simplicity, we will only use one (singleton) in this example.

Next step is to create a new class implementing IHostingService which will start and stop the scheduler for our application:

public class QuartzHostedService : IHostedService
{
    private readonly IScheduler _scheduler;

    public QuartzHostedService(IScheduler scheduler)
    {
        _scheduler = scheduler;
    }

    public Task StartAsync(CancellationToken ct)
    {
         return _scheduler.Start(ct);
    }

    public Task StopAsync(CancellationToken ct)
    {
        return _scheduler.Shutdown(ct);
    }
}

Do not forget to register the hosted service in the services collection as follows:

services.AddHostedService<QuartzHostedService>();

Then we create a job class implementing the IJob interface from Quartz.Net:

public class TestJob : IJob
{
    public Task Execute(IJobExecutionContext context)
    {
        Console.WriteLine("Hello from a job!");
        return Task.CompletedTask;
    }
}

In order to start a TestJob on a fire-and-forget mode from a service, you need to create a IJobDetail using the JobBuilder, create a ITrigger using the TriggerBuilder and finally call the IScheduler.ScheduleJob() method:

public Task StartTestJob()
{
    var jobDetails = JobBuilder
        .CreateForAsync<TestJob>()
        .WithIdentity("MyJobName")
        .WithDescription("My job description")
        .Build();
        
    var trigger = TriggerBuilder
        .Create()
        .StartNow()
        .Build();

    return _scheduler.ScheduleJob(jobDetails, trigger);
}

(Be careful: a lot of methods inside Quartz.Net are asynchronous but does not have the 'Async' suffix in their names)

The JobBuilder static class is used to wrap a job in a IJobDetail containing the job type and some metadata. In the other hand, the TriggerBuilder is used to create a trigger for jobs. In our example it is a simple trigger which will fire the job once directly after registering it to the scheduler.

From now, whenever you call the method StartTestJob(), you should see a Hello from a job! message in the console. You can call the service method from a simple HTTP GET controller method for testing purpose.

[HttpGet]
public void Get()
{
    _testService.StartTestJob();
}

Dependency injection

Next big step is to use dependency injection within our jobs. The solution I'll propose is pretty simple and straightforward. For this we are going to create a custom IJobFactory like this:

public class MyJobFactory : IJobFactory
{
    private readonly IServiceProvider _serviceProvider;

    public MyJobFactory(IServiceProvider serviceProvider)
    {
        _serviceProvider = serviceProvider;
    }
    
    public IJob NewJob(TriggerFiredBundle bundle, IScheduler scheduler)
    {
        return ActivatorUtilities.CreateInstance(_serviceProvider, bundle.JobDetail.JobType) as IJob;
    }
    
    public void ReturnJob(IJob job)
    {
        if (job is IDisposable disposableJob)
            disposableJob.Dispose();
    }
}

And then add it to the scheduler:

var scheduler = StdSchedulerFactory.GetDefaultScheduler().GetAwaiter().GetResult();
scheduler.JobFactory = new MyJobFactory(services.BuildServiceProvider());
services.AddSingleton(scheduler);

As of now we can inject services via the job class' constructor like this:

public class TestJob : IJob
{
    private readonly ILogger<TestJob> _logger;
    
    public TestJob(ILogger<TestJob> logger)
    {
        _logger = logger;
    }
    
    public Task Execute(IJobExecutionContext context)
    {
        _logger.LogInformation("Hello from job logger!");
        return Task.CompletedTask;
    }
}

Then you should see the hello world message coming from the logger in the console:

Recurring and/or delayed job

To delay a job, you simply need to replace .StartNow() on the trigger builder with .StartAt(dateTimeOffset) . Example for starting a job after 15 minutes:

var trigger = TriggerBuilder
    .Create()
    .StartAt(DateTimeOffset.Now.AddMinutes(15))
    .Build();

There is two ways to create recurring jobs: using CRON expressions or the Quartz' SimpleScheduleBuilder with a fluent flow.

Example of a CRON trigger to fire a job every 5 minutes:

var trigger = TriggerBuilder
    .Create()
    .StartNow()
    .WithCronSchedule("*/5 * * * *")
    .Build();

Same trigger but using the SimpleScheduleBuilder :

var trigger = TriggerBuilder
    .Create()
    .StartNow()
    .WithSimpleSchedule(builder =>
        builder.WithIntervalInMinutes(5)
            .RepeatForever()
    )
    .Build();

To be precise, these two triggers will not work exactly the same. If you register the job at 6:03, the first trigger using CRON will fire the job "at every 5 minutes" like 6:05, 6:10, 6:15... But the second one will fire the job every 5 minutes starting from now, so 6:03, 6:08, 6:13... I invite you to read the Wikipedia page of CRON to learn more about it.

Hope you guys enjoyed it! Please comment if you have any question or suggestion.

What to do next?

You could try to save jobs in a database, so you won't lose them when the application stops. Quartz.Net has a persistence feature, so you can store your jobs in a database easily with multiple provider available (SqlServer, PostgreSQL, SQLite and more).

One another idea would be to make your jobs resilient (retry on error).