One line of CSS…

One line of CSS – not only centering things but more

Back in those times, centering things was a huge challenge. In order to marry the woman you love, you had to get something centered by CSS….

Nowadays, things have changed…

A good explanation from Una Kravets.

#css #flex-box #css-grid

.NET Core Worker Service with EF Core

In ASP.NET Core applications, the services can be scoped, that can be resolved or instantiated at the start of a request, and disposed of at the end of a request. But in Worker Service type of applications, the definition of scope is not clear. That’s why we need to implement scoping ourselves. Let’s say every time the code runs, we assume it is a request.

1. Register DbContext in services

 public static IHostBuilder CreateHostBuilder(string[] args) =>
                .ConfigureServices((hostContext, services) =>
                    var configuration = hostContext.Configuration;
                    services.AddScoped<MyDbContext>(s => new MyDbContext(configuration));

2. Create the scope in the Worker

        private readonly IServiceProvider _provider;
        public Worker(ILogger<Worker> logger, IServiceProvider provider)
            _logger = logger;
            _provider = provider;


        protected override async Task ExecuteAsync(CancellationToken stoppingToken)
            while (!stoppingToken.IsCancellationRequested)
                _logger.LogInformation("Worker running at: {time}", DateTimeOffset.Now);
                using var scope = _provider.CreateScope();
                var db = scope.ServiceProvider.GetRequiredService<PodiumDb>();
                var notes= db.Notes.AsNoTracking().FirstOrDefault(p => p.NoteId== 340);
                await Task.Delay(1000, stoppingToken);

This is all. The DI container will create a new instance for us everytime the worker service loops.
Note that I used “using” statement without braces, it is a new feature of C# 8.0 The variable will be disposed at the end of enclosing scope, which means just after “await…” line.

#net-core #worker-service #entityframework-core

Executing code in intervals with…

Executing code in intervals with JS: setTimeout() and setInterval()

There are two ways you can execute the code in intervals with JS, but which one to use?



How do recursive setTimeout() and setInterval() differ?

The difference between the two versions of the above code is a subtle one.

  • Recursive setTimeout() guarantees the same delay between the executions. (For example, 100ms in the above case.) The code will run, then wait 100 milliseconds before it runs again—so the interval will be the same, regardless of how long the code takes to run.
  • The example using setInterval() does things somewhat differently. The interval you chose includes the time taken to execute the code you want to run in. Let’s say that the code takes 40 milliseconds to run — the interval then ends up being only 60 milliseconds.
  • When using setTimeout() recursively, each iteration can calculate a different delay before running the next iteration. In other words, the value of the second parameter can specify a different time in milliseconds to wait before running the code again.
    When your code has the potential to take longer to run than the time interval you’ve assigned, it’s better to use recursive setTimeout() — this will keep the time interval constant between executions regardless of how long the code takes to execute, and you won’t get errors.


#javascript #setinterval #settimeout

Linode Object Storage with .NET and C#

Linode Object Storage is now available on Frankfurt data centre [1]. It is much more affordable and easier to manage unstructured data such as content assets (images, files etc..), sophisticated and data-intensive storage challenges around artificial intelligence and machine learning.

Since it is S3-compatible object storage, we can use AWS SDK for .NET for any operations needed.

1. Create a Project

dotnet new console 

2. Add Amazon SDK

dotnet add package AWSSDK.S3 

3. Example: List the buckets

class Program
        static void Main(string[] args)
            string accessKey = "**";
            string secretKey = "**";

            var config = new AmazonS3Config
                RegionEndpoint = RegionEndpoint.EUCentral1, // Our bucket is on eu data center
                ServiceURL = "" 
            var amazonS3Client = new AmazonS3Client(accessKey, secretKey, config);


        static async Task ListMehmetBuckets(AmazonS3Client amazonS3Client)
           var listBucketResponse = await amazonS3Client.ListBucketsAsync();
            foreach (var bucket in listBucketResponse.Buckets)
                Console.Out.WriteLine("bucket '" + bucket.BucketName + "' created at " + bucket.CreationDate);
            if (listBucketResponse.Buckets.Count > 0)
                var bucketName = listBucketResponse.Buckets[1].BucketName;
                var listObjectsResponse = await amazonS3Client.ListObjectsAsync(bucketName);
                foreach (var obj in listObjectsResponse.S3Objects)
                    Console.Out.WriteLine("key = '" + obj.Key + "' | size = " + obj.Size + " | tags = '" + obj.ETag + "' | modified = " + obj.LastModified);


You need to enable Object Storage in your Linode account before all. Check Linode docs for the details.
That’s all.

[1] Linode Storage Solutions
#linode #objectstorage #amazon-s3 #amazon-sdk-net

ASP.NET Core 3 Service…

ASP.NET Core 3 Service Registration – AddControllers() AddControllersWithViews() AddRazorPages()

With v3 and higher, there are several ways to register MVC. This way the application can only use what it requires, not the whole framework. This would result with a smaller size and being not sure, better performance.


If you are developing an API, go with this. This is only for API-related features, Views or pages are not supported.


This adds API + Views but not Pages. If you “dotnet new mvc”, it uses this code.


This adds support for Razor Pages and minimal controller support. If you “dotnet new web”, it uses this code.

These can be combined as well. The following is equivalent to calling AddMvc in ASP.NET Core 2.2:



#aspnetcore #dotnet #net-core

Deserialize json array with System.Text.Json

Json Data

    "FirstName": "Brick",
    "LastName": "Heck"
    "FirstName": "Sue Sue",
    "LastName": "Heck"

And the class and method for deserialization

     public class Dto {
	public string FirstName { get;	set;}
	public string LastName {	get;	set;}
// Deserializer method
public static IList < Dto > DeserializeSystemNotificationEmail(string json) {
	var options = new JsonSerializerOptions {
		AllowTrailingCommas = true,
		PropertyNameCaseInsensitive = true

	return JsonSerializer.Deserialize <IList<Dto>> (json, options);

A post about the performance of system.text.json

#json #System.Text.Json #net-core #dotnet

Talks & Videos

Nowadays, it seems that going to a tech conf is the only way to prove that you are a developer (?)
You can learn something from anything anyway, here are some videos I watched recently.


Introduction to Angular 8 – Alain Chautard
Handling Angular Forms Without Losing Your Sanity – Jennifer Wadella
These ARE the Angular Tips You’re Looking For | John Papa
Angular For Enterprise | Stephen Fluin
“N Things You Didn’t Know About the Router” | Deborah Kurata
The magic of template reference variables – Alain Chautard
How to Dynamically Insert & Remove Form Controls in Angular


dotJS 2018 – John Papa – Choosing Your JavaScript Framework
Ready for Readable Code? – John Papa
The Future of Machine Learning & Javascript | Asim Hussain


Keynote NDC Sydney 2016: If I knew then what I know now – Scott Hanselman

#angular #videos #talks

BrowserSync, Gulp and TypeScript

I was creating a simple web app with VueJS (without cli, no single file component) and I thought it would be good to have a local server which watches changes, auto-transpiles TypeScript and later maybe builds(minify, terser, copy files etc.) for the production. By using BrowserSync & Gulp, a typescript project can be easily watched, and the browser can be auto-reloaded in case of any changes. Let’s assume we have .ts files and index.html in “src” folder. The following gulpfile compiles the TS files into “dist” folder, watches for the changes and reloads the browser in case of changes. It still requires the build function for the production but it would be similar to development function, maybe terser plugin can be added.

const { series, watch, src, dest } = require('gulp');
var ts = require('gulp-typescript');
var sourcemaps = require('gulp-sourcemaps');
var tsProject = ts.createProject('tsconfig.json');
var server = require('browser-sync').create();

const paths = {
    scripts: {
        ts: 'src/*.ts',
        dest: 'dist/js/'

function reload(done) {

function serve(done) {
        server: {
            baseDir: './dist'

let development = function() {
    return tsProject.src()

const mywatcher = () => {
    const watcher = watch(paths.scripts.ts, series(development, reload))
    watcher.on('change', (path) => {
        console.log(`File ${path} was changed.`);
const dev = series(development, serve, mywatcher );
exports.default = dev;

Another simple example. It uses terser and browsersync, dist folder is alway ready to deploy. It is for single js file but can be modified:

const { series, watch, src, dest } = require('gulp');
const terser = require('gulp-terser');
var server = require('browser-sync').create();

function copyAssets() {
    return src('src/assets/*')

function copy() {
    return src('./src/app.js')
            mangle: { toplevel: true },
            compress: true

function reload(done) {

function serve(done) {
        server: {
            baseDir: './dist'

const watcher = () => {
    const watcher = watch('src', series(copyAssets, copy, reload))
    watcher.on('change', (path) => {
        console.log(`File ${path} was changed.`);
exports.default = series(copyAssets, copy, serve, watcher);

There is a gulp plugin for the same purpose:

Use browsersync to start a server from a folder and watch all the files for changes:

 browser-sync start --server './' --files './'

#typescript #gulp #vuejs #javascript

Angular – Scroll to a…

Angular – Scroll to a div in child component

Child Component

<div  #scrollToPoint>
div to scroll

Return scroll point to parent

 @ViewChild('scrollToPoint', { static: false }) scrollToPoint: ElementRef;
  constructor() { }
  ngOnInit() {
  getScrollPoint() {
    return this.scrollToPoint;

Parent Component

  @ViewChild(ChildComponent, { static: false }) childComponent: ChildComponent;
 scroll() {

This would work fine. If you have another button in a child and want to listen to that to scroll, you can add an event emitter:

Parent HTML

<app-child-hero (startHereClick)="scroll()"></app-child-hero> >

Child HTML

<button type="button" class="btn btn-danger" (click)="startHere()">Start Here</button>

Child Class

 @Output() startHereClick: EventEmitter<boolean> = new EventEmitter();
 startHere() {



Azure – Application Settings and Connection Strings

Resources for storing connection string and application string in azure apps.


#azure #azure-database