DEV Community: Daniel Leinweber

How to create a WPF DateRangePicker?

Daniel Leinweber — Thu, 16 Mar 2023 15:30:00 +0000

I needed a way to let a user select a date range for a WPF DataGrid filter. After some research I was not able to find a control that was capable of what I wanted, so I decided to create my own WPF User Control that allows either selecting a single date or a date range.

The finished WPF User Control can be found in my GitHub profile under XamlDateRangePicker.

The following article will describe the creation process and how to use the control.

Planning

First I needed to plan what parts the user control would need to provide the functionality I was looking for. So I did a quick paper prototype.

Parts

TextBox
I wanted to show the selected date (range) similar to a DateTimePicker, so I figured I would need a Textbox.
Image Button
A button to open the calendar should be combined with the TextBox. I figured a ToggleButton would be the best choice for this functionality, because of its IsChecked state.
Popup
I wanted the calendar to slide down from the TextBox when the user clicked the ToggleButton, so I decided to add a Popup.
Calendar
The actual calendar control that is nested in the Popup.

Creating a WPF User Control

A typical WPF user control consists of two files.

a .xaml file
and a .xaml.cs file

The controls UI will be created in the .xaml file and it's logic in the .xaml.cs file.

Creating the UI

First I added a WPF User Control to my Project to create the two needed files. Then I started to edit the DateRangePicker.xaml file and added the needed controls.

<UserControl x:Class="UserControls.DateRangePicker"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:UserControls"
             mc:Ignorable="d" 
             x:Name="this"
             d:DesignHeight="30" d:DesignWidth="160">

    <StackPanel>
        <Border
            BorderThickness="1"
            BorderBrush="{Binding ElementName=DateRangePicker_TextBox, Path=BorderBrush}">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="30" />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition />
                    <ColumnDefinition Width="30" />
                </Grid.ColumnDefinitions>
                <TextBox
                    x:Name="DateRangePicker_TextBox"
                    Grid.Column="0"
                    Margin="0"
                    MinHeight="30"
                    BorderThickness="0"
                    d:Text="14.03.2023 - 20.03.2023"
                    Text="{Binding ElementName=this, Path=DisplayValue, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged, Delay=300}"
                    KeyUp="Handle_Escape_Button" />
                <ToggleButton
                    x:Name="DateRangePicker_ArrowButton"
                    Grid.Column="1"
                    Height="{Binding ElementName=DateRangePicker_TextBox, Path=Height}"
                    Focusable="False"
                    ClickMode="Press"
                    IsChecked="{Binding ElementName=this, Path=IsDropDownOpen, Mode=TwoWay}"
                    MinWidth="30"
                    Background="{Binding ElementName=DateRangePicker_TextBox, Path=Background}"
                    BorderBrush="{Binding ElementName=DateRangePicker_TextBox, Path=Background}"
                    BorderThickness="0"
                    HorizontalAlignment="Right"
                    VerticalAlignment="Stretch">
                    <Path
                        x:Name="DateRangePicker_Arrow"
                        Data="M 0 0 L 4 4 L 8 0 Z">
                        <Path.Fill>
                            <SolidColorBrush Color="#FF444444"/>
                        </Path.Fill>
                    </Path>
                </ToggleButton>
            </Grid>
        </Border>
        <Popup
            x:Name="DateRangePicker_Popup"
            Placement="Bottom"
            IsOpen="{Binding ElementName=this, Path=IsDropDownOpen}"
            AllowsTransparency="True"
            Focusable="False"
            PopupAnimation="Slide">

            <Viewbox
                x:Name="DateRangePicker_DropDown"
                SnapsToDevicePixels="True"
                Stretch="Fill">
                <Calendar
                    x:Name="DateRangePicker_Calendar"
                    SelectionMode="SingleRange"
                    SelectedDatesChanged="DateRangePicker_Calendar_SelectedDatesChanged"/>
            </Viewbox>
        </Popup>
    </StackPanel>
</UserControl>

To make sure the controls are binding to the code behind (.xaml.cs) I gave my user control the x:Name="this". So I could use it for example in the Text binding of the TextBox.

Text="{Binding ElementName=this, Path=DisplayValue, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged, Delay=300}"

This will search for a DisplayValue property in my DateRangePicker.xaml.cs file.

Creating the controls logic

Then I started editing the .xaml.cs file to add the user controls logic. Here I defined EventHandler and Properties that are used in the XAML of the control, as well as a DependencyProperty that should be accessible from the outside to be able to receive the selected date (range).

Defining a Dependency Property

A dependency property can be bound from the outside of the control. You will need to register a property as a DependencyProperty like in the following code snippet.

public static readonly DependencyProperty SelectedDateRangeProperty
    = DependencyProperty.Register(
        nameof(SelectedDateRange),
        typeof(ObservableCollection<DateTime>),
        typeof(DateRangePicker),
        new FrameworkPropertyMetadata(default(ObservableCollection<DateTime>), FrameworkPropertyMetadataOptions.None));

public ObservableCollection<DateTime> SelectedDateRange
{
    get => (ObservableCollection<DateTime>)GetValue(SelectedDateRangeProperty);
    set => SetValue(SelectedDateRangeProperty, value);
}

Updating / Interacting with the UI

In order to update or interact with the UI from your code behind, you need to make sure that you implement the INotifyPropertyChanged interface. So that you can raise a notification when you change any property that is used in your UI.

public event PropertyChangedEventHandler PropertyChanged;

public void RaisePropertyChanged([CallerMemberName] string propertyName = null)
    => PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));

protected bool SetProperty<T>(ref T backingStore, T value, [CallerMemberName] string propertyName = "", Action onChanged = null)
{
    var output = false;

    if (EqualityComparer<T>.Default.Equals(backingStore, value) == false)
    {
        backingStore = value;
        onChanged?.Invoke();
        RaisePropertyChanged(propertyName);

        output = true;
    }

    return output;
}

Then you can use the SetProperty method to raise the property change which will update the UI.

Here an example of the SelectedDates property that is updated from the Calendar controls SelectedDatesChanged event.

public ObservableCollection<DateTime> SelectedDates
{
    get => _selectedDate;
    set => SetProperty(ref _selectedDate, value, onChanged: () =>
    {
        IsDropDownOpen = false;
        if (value.Any())
        {
            if (value.Count == 1)
            {
                DisplayValue = value.First().ToString("dd.MM.yyyy");
                SelectedDateRange = new ObservableCollection<DateTime> { value.First() };
            }
            else
            {
                DisplayValue = $"{value.First():dd.MM.yyyy} - {value.Last():dd.MM.yyyy}";
                SelectedDateRange = new ObservableCollection<DateTime> { value.First(), value.Last() };
            }
        }
        else
        {
            SelectedDateRange = new ObservableCollection<DateTime>();
        }
    });
}
private ObservableCollection<DateTime> _selectedDate = new ObservableCollection<DateTime>();

Using the control

In order to use the control you need to follow the next steps.

Add the project or the user control to your solution/project.
Add the namespace for the user control to your XAML

xmlns:userControls="clr-namespace:UserControls;assembly=DateRangePicker"

Use the control in your XAML

<userControls:DateRangePicker 
    SelectedDateRange="{Binding SelectedDates, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />

You can bind the SelectedDateRange Property to your ViewModel. This property holds a ObservableCollection<DateTime> of either one or two dates. Either the single selected DateTime or the first and the last date of the selected date range.

Parse CLI arguments in .NET

Daniel Leinweber — Sat, 25 Feb 2023 11:37:00 +0000

In my day-to-day job we needed a way to parse command line arguments in an easy and structured way.

So after some research I found the awesome NuGet-Package Command Line Parser Library. This package allows to define your options with Property-Attributes.

Example of a CommandLineOptions class

In this example class we define all options we want to parse as properties and create a static collection of Examples that will be displayed in the tools command line help.

public class CommandLineOptions
{
    /// <summary>
    /// e.g. yourapp.exe -d|--database "DatabaseName"
    /// </summary>
    [Option(
        shortName: 'd',
        longName: "database",
        Required = true,
        HelpText = "Name of the database to be used")]
    public string DatabaseName { get; set; }

    /// <summary>
    /// e.g. yourapp.exe -l|--language "DE"
    /// </summary>
    [Option(
        shortName: 'l',
        longName: "language",
        Required = false,
        HelpText = "Country short key (EN|DE|IT|ES) for the report language")]
    public string ReportLanguage { get; set; }

    [Usage(ApplicationAlias = "yourapp.exe")]
    public static IEnumerable<Example> Examples =>
        new List<Example>()
        {
            new Example
            (
                "Use default settings",
                new CommandLineOptions()
                {
                    DatabaseName = "DatabaseName",
                }
            ),
            new Example
            (
                "Use custom report language",
                new CommandLineOptions()
                {
                    DatabaseName = "DatabaseName",
                    ReportLanguage = "DE"
                }
            )
        };
}

Parse CommandLineOptions class

When your tool is executed you can than parse the passed arguments into the CommandLineOptions class as follows.

static void Main(string[] args)
{
  CommandLine.Parser.Default.ParseArguments<CommandLineOptions>(args)
    .WithParsed(ExecuteWithOptions)
    .WithNotParsed(HandleParseError);
}

static void ExecuteWithOptions(CommandLineOptions options)
{
  // Handle options
}

static void HandleParseError(IEnumerable<Error> errors)
{
  // Handle errors
}

Create a NuGet-Package

Daniel Leinweber — Thu, 23 Feb 2023 10:34:00 +0000

In my day-to-day job we have a lot of projects that need to pull in the same internal libraries over and over again.

So we decided to create NuGet-Packages for these libraries and create a local feed, from which we can pull in the NuGet-Packages from our different projects.

These are the steps to create your own NuGet-Packages and use your own local feed.

1. Create a manifest

The .nuspec file is the NuGet-Packages manifest and defines the different values of the package. Like the name, description, version, etc..

You can run the following command in a developer command line to create the manifest file.

nuget spec

2. Create a package

You can execute the following command in a developer command line to actually create the package, based on the previously created manifest.

nuget pack

3. Add NuGet-Package to local feed

To add the created NuGet-Package to a local feed you can execute the following command in a developer command line.

nuget add MyPackage.1.0.0.nupkg --source \\my_server\my_local_feed_share

4. Add local feed to Package sources

To actually find the NuGet-Packages from the local feed, you need to add it to the package sources.

In Visual Studio navigate to Tools > Options > Nuget Package Manager > Package Sources and click on the green + icon to add a new source. Provide a name and a source for your local feed.

After that you are able to browse your local feed when managing NuGet-Packages for a project.

Create a Windows Service from the Command Line

Daniel Leinweber — Tue, 21 Feb 2023 10:15:00 +0000

During my day-to-day job we create a lot of Windows Services, based on the .NET Worker Service. These need to be installed on server systems. Instead of installing them manually I use the following PowerShell script.

You just need to fill in the variables for $serviceName, $executablePath, $userName, $password and $description.

$serviceName = "My_Service_Name"
$executablePath = "C:\temp\Path_to_my_service.exe"
$userName = "My_User_Name"
$password = "My_Password"
$description = "My service description"

sc.exe stop $serviceName
sc.exe delete $serviceName
sc.exe create $serviceName binpath= $executablePath start= delyed-auto obj= $userName password= $password
sc.exe description $serviceName $description

Note: Please note that there are spaces between the sc.exe parameters equal sign and their values. This is on purpose.

Laravel development on macOS

Daniel Leinweber — Sun, 19 Feb 2023 09:12:00 +0000

In this article I want to give you a guide on how to setup your development environment on macOS and start developing PHP applications with Laravel.

Setup Valet
- Install components with Homebrew
- Install Valet
Create a Project
- Use Valet
Laravel Project Structure
- MVC
- Routes
- Configuration
Blade Templates
- Passing data to views
- Displaying data in views
- Blade directives
Database Handling
- MySQL
- Migrations
- Seed database
- Refresh / Wipe database
- Creating models
- Creating factories
Shared elements
- Partials
- Components

Setup Valet

Valet is a light-weight Laravel development environment for macOS, that comes with Nginx. It provides proxies to point all requests on a configured domain to point to installed sites on your local machine.

Install components with Homebrew

Go to Homebrew and copy the installation command and run it in your terminal.

# Update homebrew
brew update

# Install PHP
brew install php

# Install composer
brew install composer

Run the following command and see if it says "composer" anywhere:

echo $PATH

If not, you have to add composer to your path. Add the following line to your shell configuration. I use zsh as my shell, so I can add it to ~/.zshrc

export PATH=$PATH:$HOME/.composer/vendor/bin

Refresh your shells configuration:

# Refresh zsh configuration
source ~/.zshrc

Install Valet

# Actually install valet with composer
composer global require laravel/valet
valet install
composer global require laravel/installer

Create a Project

Make sure to navigate to the project folder, where you want to create the Laravel project.

# Create new project
laravel new PROJECT_NAME

Use Valet

Tell Valet to use the current folder as a Laravel project.

valet park

You can now open your project in your IDE of choice and browse to your projects URL (e.g. http://PROJECT_FOLDER.test)

If you want to see all "parked" projects execute the following.

valet parked

Laravel Project Structure

Laravel is organized in the Model-View-Controller structure.

MVC

Models are found under /app/Models. These are the data models that might be generated with the help of the Laravel CLI tools.

Views are found under /resources/views. The views are usually .blade.php templates, but they don't have to.

Controllers are found under /app/Http/Controllers. The controllers are used to handle the business logic and to get the right data with the help of the models, to pass that down to the requested view.

Routes

Laravel can configure routes for "normal" web applications as well as for an API.

"Normal" routes are configured under /routes/web.php and API routes are configured under /routes/api.php.

Route configuration

Routes can be configured with absolute paths or with dynamic parameters (wildcards) as follows.

// Get all
Route::get('/', function() {
    return view('listings', [
        'heading' => 'Latest Listings',
        'listings' => Listing::all()
    ]);
});

// Get by id
Route::get('/listings/{id}', function($id) {
    return view('listing', [
        'listing' => Listing::find($id)
    ]);
});

Query string parameters might be read with the help of the Illuminate\Http\Request class.

use Illuminate\Http\Request;

// Get query string parameters
Route::get('/search', function(Request $request) {
    return view('search', [
        'name' => $request->name,
        'city' => $request->city
    ]);
});

It is also possible to add constraints to the route, to only allow specific values.

// Get by id -> id has to be a number
Route::get('/posts/{id}', function($id) {
    return view('post', [
        'post' => Post::find($id)
    ]);
})->where('id', '[0-9]+');

In order to return a json from an API route you might do the following.

Route::get('/posts', function() {
    return response()->json([
        'posts' => [
            [
                'title' => 'Post One'
            ]
        ]
    ]);
});

Calling a controller action from a route

If you want to call a controller action in a route you first need to create a controller.

php artisan make:controller ListingController

In the controller you can create public functions for all your actions.

// Show all listings
public function index() {
    return view('listings', [
        'listings' => Listing::all()
    ]);
}

// Show single listing
public function show(Listing $listing) {
    return view('listing', [
        'listing' => $listing
    ]);
}

The route definition can than be changed as follows, where we pass in the controller class and the action/function name.

// Get all
Route::get('/', [ListingController::class, 'index']);

// Get by id
Route::get('/listings/{listing}', [ListingController::class, 'show']);

Route action naming conventions

Common Resource Routes in Laravel are as follows.

index - Show all items
show - Show a single item
create - Show a form to create a new item
store - Store a new item
edit - Show a form to edit an existing item
update - Update an existing item
destroy - Delete an existing item

Configuration

The different system configuration files can be found under /config.

Database

In the /config/database.php file you can configure what type of database should be used (e.g. mysql or sqlite, etc.).

To configure the database connection you can edit the .env file in the projects root folder.

Blade Templates

Blade is a simple templating engine that is already included in Laravel. Blade templates are compiled into plain PHP code.

Passing data to views

Blade views (templates) may be returned from routes or controllers using the global view helper.

Route::get('/', function() {
    return view('greeting', ['name' => 'Finn']);
});

Displaying data in views

The name variable can be displayed in the blade template as follows.

Hello, {{ $name }}

Blade directives

Blade directives are escaped by the @ symbol. These directives function identically to their PHP counterparts. A detailed documentation may be found under https://laravel.com/docs/9.x/blade

@if (count($records) === 1)

    <p>I have one record!</p>

@elseif (count($records) > 1)

    <p>I have multiple records!</p>

@else

    <p>I dont have any records!</p>

@endif

<h1>{{ $heading }}</h1>

@if(count($listings) == 0)

    <p>No listings found</p>

@endif


@foreach($listings as $listing)

    <h2>    
        <a href="/listings/{{$listing['id']}}">{{$listing['title']}}</a>    
    </h2>

    <p>{{$listing['description']}}</p>

@endforeach

An alternative to check for the existance of items is the @unless directive.

@unless(count($listings) == 0)
    @foreach($listings as $listing)
        <h2>{{$listing['title']}}</h2>
        <p>
            {{$listing['description']}}
        </p>
    @endforeach
@else
    <p>No listings found</p>
@endunless

Database Handling

Laravel support different database systems like MySQL, SQLite and others.

MySQL

# Start MySQL server
mysql.server start

# Login with root
mysql -u root -p

# Stop MySQL server
mysql.server stop

1. You should create a dedicated MySQL user for your project

CREATE USER 'someuser'@'localhost' IDENTIFIED BY 'somepassword';

2. Create a database

CREATE DATABASE somedatabasename;

3. Grant the newly created user access to the database

GRANT ALL PRIVILEGES ON somedatabasename.* TO 'someuser'@'localhost';
FLUSH PRIVILEGES;

4. Update the .env file in the project root with the database settings

Migrations

The database schema / structure is managed with database migrations. The migrations can be found under /database/migrations.

Create a new migration

To create a new migration to create a table named listings execute the following command.

php artisan make:migration create_listings_table

Add table columns in migration

Open the newly created migration file (something like 2023_02_17_101605_create_listings_table.php) and add the missing columns in the up method.

public function up()
{
    Schema::create('listings', function (Blueprint $table) {
        $table->id();
        $table->string('title');
        $table->string('tags');
        $table->string('company');
        $table->string('location');
        $table->string('email');
        $table->string('website');
        $table->longText('description');
        $table->timestamps();
    });
}

Run migrations

In order to apply the migrations to the database, execute the following command.

php artisan migrate

Seed database

To generate "dummy" data in your database you can update the run method found in the /database/seeders/DatabaseSeeder.php file. Here you can call a factory method.

To actually execute the database seed, execute the following command.

php artisan db:seed

Refresh / Wipe database

To refresh / wipe the database you can execute the following command. This will re-run the migrations and re-create all the tables. Attention: This will delete the table data

php artisan migrate:refresh

If you want to refresh the database, but also want to execute the database seeding you can do the following.

php artisan migrate:refresh --seed

Creating models

Laravel uses Eloquent as a default ORM. To create an Eloquent model you can execute the following command.

php artisan make:model ModelName

Creating factories

Factories are stored under /database/factories and can be created as follows.

php artisan make:factory FactoryName

In the definition function you can create the objects with the help of faker.

public function definition()
{
    return [
        'title' => $this->faker->sentence(),
        'tags' => 'laravel, api, backend',
        'company' => $this->faker->company(),
        'email' => $this->faker->companyEmail(),
        'website' => $this->faker->url(),
        'location' => $this->faker->city(),
        'description' => $this->faker->paragraph(5),
    ];
}

Shared elements

It is possible to extend a view in Laravel. By doing so it is possible to define a general page layout in one file and extend this layout by side specific content.

You may create a _layout.blade.php file under /resources/views/. Add the following to it, where you want to include the side specific content.

@yield('content')

When creating the actual side layout you can extend the general page layout as follows.

@extends('_layout')

@section('content')

<h2>{{$listing['title']}}</h2>
<p>{{$listing['description']}}</p>

@endsection

Partials

Sometimes you want to re-use a UI element on multiple pages. For this you can include a partial into your side.

Create the folder /resources/views/partials and add for example a file called _search.blade.php and add your layout (etc.) to it. Then you can include it in the different pages, where you want it to appear as follows.

@include('partials/_search')

Components

Components are similar to partials with the difference that you are able to provide data (e.g. a Model) to a component.

Create the folder /resources/views/components and add for example a file called listing-card.blade.php and add your layout (etc.) to it. In order to receive data that was passed to the component add the following.

@props(['listing'])

<h3>
    <a href="/listings/{{$listing->id}}">{{$listing->title}}</a>
</h3>

In order to use a component and pass data to it call it as follows.

@foreach($listings as $listing)
    <x-listing-card :listing="$listing"/>
@enddoreach

Enclosing component

If you want to use a component to enclose something else like if you would create a card component with a specific background and border, you can do the following.

Add a new component and insert a slot for the positioning of the content to be enclosed. In order to define default css classes you can use the $attributes->merge function.

<div {{$attributes->merge(['class' => 'bg-gray-50 border border-gray-200 rounded p-6'])}}>

    {{$slot}}

</div>

And use it like a "normal" HTML tag. The provided css class will be added to the default classes that are defined in the component itself.

<x-card class="p-10">
    <p>Something in the card component</p>
</x-card>

What is Blazor?

Daniel Leinweber — Fri, 17 Feb 2023 11:38:00 +0000

Blazor is a Framework to create client-side interactive Web-UIs with .NET.

Pros:

Interactive UIs with C# instead of JavaScript
.NET App-Logic for Server and Client
Browser-Compatibility (incl. Mobile)

In this article I want to give you a quick overview of the Blazor technology of .NET.

Razor-Markup
Blazor WebAssembly
Blazor Server
Progressive Web Apps

Razor-Markup

Blazor apps are based on Components like pages, forms, etc. that can be nested and re-used in multiple places.

These components can be written in Razor-Markup, which is a combination of HTML and C#-Code.

<div>
    <h1>@Title</h1>

    @ChildContent

    <button @onclick="OnYes">Yes!</button>
</div>

@code {

    [Parameter]
    public string Title { get; set; }

    [Parameter]
    public RenderFragment ChildContent { get; set; }

    private void OnYes()
    {
        Console.WriteLine("'Yes' button was clicked.");
    }

}

Blazor WebAssembly

Blazor WebAssembly is a Single-Page-App-Framework to create client-side interactive Web-UIs with .NET.

it uses open web standards
allows the execution of .NET code in the browser
the .NET code is executed in the JavaScript-Sandbox of the browser
the sandbox protects against malicious actions on the client computer

How it works

C# and Razor-Markup files are compiled into .NET assemblies. The assemblies and the .NET-Runtime are downloaded by the browser and the Blazor WebAssembly starts the .NET-Runtime and configures it to load the assemblies. After that DOM changes and API calls in the browser will be managed by the Blazor WebAssembly-Runtime from the JavaScript-Interop.

Image Source: Microsoft

Blazor Server

Blazor decouples component rendering from UI updates, which brings support for hosting Razor components in an ASP.NET Core app on the server. UI updates are than triggered over a SignalR connection.

Image Source: Microsoft

Progressive Web Apps

A Progressive Web App is a website that has the characteristics of a native app. It is a symbiosis of a responsive website and an actual app.

Pros:

Findable as an application from search engines
Installable without the hurdles of an app store
Linkable. You can share its URL to install it
Network independent
Simultaneous use as a website (web app) and as a installed app is possible

How it works

The web application runs in a headless browser, so to speak. This allows the PWA to use all features that available to a browser / web site.

How to use EF Core Migrations

Daniel Leinweber — Wed, 15 Feb 2023 08:41:19 +0000

The EF Core Migrations feature provides a way to incrementally update the database schema to keep in sync with your application's data model, while still preserving existing data in your database.

In this article I want to give you an overview of the most common tasks you might face when working with Migrations in EF Core.

Content

Add a migration
- Customize migration code
  - Column renames
  - Adding raw SQL
  - Arbitrary changes via raw SQL
Remove a migration
Execute migrations
- Basic Usage
- With From
- With From and To

Add a migration

After you have created your models and your EF Core context, or after you have made changes to them, you can add a migration as follows.

dotnet ef migrations add "Add_Created_Column_To_Customers"

Tip: Try to name your migration like a Git commit message

Customize migration code

Sometimes it might be necessary to customize a migration. For this you can update the Up or Down method in the migration file.

Column renames

To rename a property from Name to FullName, you need to replace the generated code

migrationsBuilder.DropColumn(
    name: "Name",
    table: "Customers"
);

migrationsBuilder.AddColumn<string>(
    name: "FullName",
    table: "Customers",
    nullable: true
);

with the following. This is due to EF Core not knowing if you intended to drop and create a new column or to rename a column.

migrationsBuilder.RenameColumn(
    name: "Name",
    table: "Customers",
    newName: "FullName"
);

Tip: If you rename your property in your model with the refactoring tools of Visual Studio (e.g. F2) EF Core is usually smart enough to recognise that you meant to rename the property. So you just need to check if the generated code is already correct.

Adding raw SQL

Sometimes you might want to execute specific operations that cannot be auto generated by EF Core.

If you want to rename and combine a FirstName and LastName property into a single FullName property, you need to replace the generated code

migrationBuilder.DropColumn(
    name: "FirstName",
    table: "Customers"
);

migrationBuilder.DropColumn(
    name: "LastName",
    table: "Customers"
);

migrationBuilder.AddColumn<string>(
    name: "FullName",
    table: "Customers",
    nullable: true
);

with the following, in order to prevent unwanted data loss.

migrationBuilder.AddColumn<string>(
    name: "FullName",
    table: "Customer",
    nullable: true
);

migrationBuilder.Sql(
@"
    UPDATE Customers
        SET FullName = FirstName + ' ' + LastName;
"
);

migrationBuilder.DropColumn(
    name: "FirstName",
    table: "Customers"
);

migrationBuilder.DropColumn(
    name: "LastName",
    table: "Customers"
);

Arbitrary changes via raw SQL

Raw SQL can also be used to manage database objects that EF Core is not aware of. You might add a migration without making any model change to generate an empty migration.

Then you can add the following to create a SQL Server stored procedure.

migrationBuilder.Sql(
@"
    EXEC (
        'CREATE PROCEDURE sp_GetFullName
            @LastName nvarchar(50),
            @FirstName nvarchar(50)
        AS
            RETURN @LastName + @FirstName;'
    )
"
);

Remove a migration

To remove the last migration, use this command.

 dotnet ef migrations remove

Execute migrations

To create or update the database and schema, use this command.

dotnet ef database update

Please be aware that the recommended way to deploy migrations to a production database is by generating SQL scripts.

Basic Usage

Create a SQL script from a blank database to the latest migration:

dotnet ef migrations script

With From

Create a SQL script from the given migration to the latest migration:

dotnet ef migrations script AddNewTables

With From and To

Create a SQL script from a specific migration to a specific migration:

dotnet ef migrations script AddNewTables AddAuditTable

You can use a from that is newer than the to in order to generate a rollback script.

DEV Community: Daniel Leinweber

How to create a WPF DateRangePicker?

Planning

Parts

Creating a WPF User Control

Creating the UI

Creating the controls logic

Defining a Dependency Property

Updating / Interacting with the UI

Using the control

Parse CLI arguments in .NET

Example of a CommandLineOptions class

Parse CommandLineOptions class

Create a NuGet-Package

1. Create a manifest

2. Create a package

3. Add NuGet-Package to local feed

4. Add local feed to Package sources

Create a Windows Service from the Command Line

Laravel development on macOS

Contents

Setup Valet

Install components with Homebrew

Install Valet

Create a Project

Use Valet

Laravel Project Structure

MVC

Routes

Route configuration

Calling a controller action from a route

Route action naming conventions

Configuration

Database

Blade Templates

Passing data to views

Displaying data in views

Blade directives

Database Handling

MySQL

1. You should create a dedicated MySQL user for your project

2. Create a database

3. Grant the newly created user access to the database

4. Update the .env file in the project root with the database settings

Migrations

Create a new migration

Add table columns in migration

Run migrations

Seed database

Refresh / Wipe database

Creating models

Creating factories

Shared elements

Partials

Components

Enclosing component

What is Blazor?

Contents

Razor-Markup

Blazor WebAssembly

How it works

Blazor Server

Progressive Web Apps

How it works

How to use EF Core Migrations

Content

Add a migration

Customize migration code

Column renames

Adding raw SQL

Arbitrary changes via raw SQL

Remove a migration

Execute migrations

Basic Usage

With From

With From and To