DEV Community: Animesh Bulusu

Build a Linux CLI app with .NET Core

Animesh Bulusu — Tue, 14 May 2019 15:37:24 +0000

Being a developer and a geek for as long as I can remember, command line tools have always fascinated me. They are relatively easy to create and use than a web app or a desktop app.

In this post, we will explore how to build a simple command line tool on Linux using .NET Core.

Create a new console app using the dotnet cli.

$ dotnet new console -o netcore-test-cli
$ code netcore-test-cli

Most command line tools do take user input and perform actions as based on these inputs.

These inputs come into the Main function during runtime by the way of the string[] args parameter. We could simply parse the arguments and their values from the string array args, but this is a tedious thing for us to do.

Fortunately, there are many open source libraries to help us do this. One such library is CommandLineParser. I have used it in a couple of projects and like it.

Let us add this command line parsing library to the project.

$ dotnet add package CommandLineParser

To get started with CommandLineParser, first we need to specify the types and names of the arguments in the form of an Options class. Then we need to use a Parser instance to parse the arguments provided.

var result = Parser.Default.ParseArguments<Options>(args)

On successful parsing, we get back a Parsed<Options> type. Otherwise, we get back a NotParsed<T> type which is an error collection of type IEnumerable<Error>.

The prescribed way to do this is to use the WithParsed and WithNotParsed extension methods which take on the respective parsed types and pass the parsed options to further processing.

static void Main(string[] args)
{
    Parser.Default.ParseArguments<Options>(args)
        .WithParsed<Options>(options => ProcessOptions(options))
        .WithNotParsed<Options>(options => HandleErrors(options));
}

For the sake of simplicity, let us define two options, Count and Name, as follows.

class Options
{
    [Option('c', "count", HelpText="The count variable")]
    public int Count { get; set; }

    [Option(HelpText="Name for greeting")]
    public string Name { get; set; }
}

We need to specify the [Option] attribute on our two properties. This lets CommandLineParser know which properties are valid for parsing against the user input. Notice that Count option has c for its ShortName and count for its LongName. This lets you specify count input as either -c 10 or --count 10.

Let us just take the Count option to generate a sum of all whole numbers upto Count and display a exit message if the Name option is specified.

private static void ProcessOptions(Options options)
{
    int sum = 0;
    for (int i = 1; i <= options.Count; i++)
    {
        sum = sum + i;
    }
    Console.WriteLine($"Sum: {sum}");

    if(!string.IsNullOrEmpty(options.Name))
        Console.WriteLine($"Bye, {options.Name}");
}

To run the program use, dotnet run command.

$ dotnet run -- --count 10 --name=animesh
Sum: 55
Bye, animesh

If you want to run the compiled program directly, you can run dotnet command and pass the name of the output dll.

$ dotnet bin/Debug/netcoreapp2.2/netcore-test-cli.dll -c 123
Sum: 7626

To make it a proper Linux executable, we need to publish the program with appropriate runtime identifier.

$ dotnet publish -c 'release' -r 'linux-x64'

Microsoft (R) Build Engine version 15.9.20+g88f5fadfbe for .NET Core
Copyright (C) Microsoft Corporation. All rights reserved.

  Restore completed in 55.08 ms for /home/animesh/projects/lucubrations/netcore-test-cli/netcore-test-cli.csproj.
  netcore-test-cli -> /home/animesh/projects/lucubrations/netcore-test-cli/bin/release/netcoreapp2.2/linux-x64/netcore-test-cli.dll
  netcore-test-cli -> /home/animesh/projects/lucubrations/netcore-test-cli/bin/release/netcoreapp2.2/linux-x64/publish/

This publishes the program to folder bin/Release/netcoreapp2.2/linux-x64. Check it out.

$ ll bin/Release/netcoreapp2.2/linux-x64

total 1552
-rwxrw-rw- 1 animesh animesh 692128 Jan 18 03:54 libhostfxr.so
-rwxrw-rw- 1 animesh animesh 712624 Jan 18 03:54 libhostpolicy.so
-rwxrw-rw- 1 animesh animesh 106912 Mar  9 15:29 netcore-test-cli
-rw-r--r-- 1 animesh animesh  37340 Mar  9 15:29 netcore-test-cli.deps.json
-rw-r--r-- 1 animesh animesh   5632 Mar  9 15:29 netcore-test-cli.dll
-rw-r--r-- 1 animesh animesh    928 Mar  9 15:29 netcore-test-cli.pdb
-rw-r--r-- 1 animesh animesh    206 Mar  9 15:29 netcore-test-cli.runtimeconfig.dev.json
-rw-r--r-- 1 animesh animesh     26 Mar  9 15:29 netcore-test-cli.runtimeconfig.json
drwxr-xr-x 2 animesh animesh  12288 Mar  9 15:29 publish

Notice the file attributes on the third item netcore-test-cli in the directory listing above. It has file attributes -rwxrw-rw-, which means it is a Linux executable. This became possible as we specified the linux-x64 runtime identifier.

We can run the executable just as before.

$ cd bin/Release/netcoreapp2.2/linux-x64

$ ./netcore-test-cli 

Sum: 0

$ ./netcore-test-cli -c 100

Sum: 5050

Both parameters specified:

$ ./netcore-test-cli -c 1000 --name animesh

Sum: 500500
Bye, animesh

Specifying the --help option shows all possible options for user input:

$ ./netcore-test-cli --help

netcore-test-cli 1.0.0
Copyright (C) 2019 netcore-test-cli

  -c, --count    The count variable

  --name         Name for greeting

  --help         Display this help screen.

  --version      Display version information.

That's the end of this post. We have seen how to build a basic command line application with .NET Core.

All code for this post is available on my gitlab repository.

Originally posted on my blog @ https://animesh.blog/build-a-linux-cli-app-with-net-core/

Note taking with QOwnNotes

Animesh Bulusu — Thu, 09 May 2019 19:59:37 +0000

I have written a few days back about the search for near perfect note taking software. I would like to provide a short rundown on the features of QOwnNotes in this post.

QOwnNotes is a open source notepad with markdown support and hierarchical notes. Let us look at some features.

Markdown support

Markdown is the default plaintext editing option. Files can be written in plain text and saved as markdown files. This is crucial for me because my fundamental goal is to create a personal knowledge base accessible to me in the browser. It may either be public accessible website or a website local to my machine.

QOwnNotes has a markdown preview panel which lets us view our rendered markdown live next to the editor panel. With the live preview present, I have no use for other Linux desktop markdown editors like typora, abricotine, retext and remarkable.

This is how the editor and preview look like.

Hierarchical notes

Let us say, we have the following structure with some notes. Note that the files learning-resources.md and tutorials.md are at the root level of the learning folder.

└── learning
    ├── dotnet
    │   ├── designpatterns.md
    │   ├── generics.md
    │   └── solid.md
    ├── javascript
    │   ├── angular.md
    │   ├── es6.md
    │   └── react.md
    ├── learning-resources.md
    └── tutorials.md

3 directories, 9 files

To be able to view this structure inside QOwnNotes

create a note folder testing from the settings dialog
select path to learning folder as the note folder path
select Use note subfolders option

This is how it looks. As you can see here, the folder structure that we created before is showing up as is.

In the top panel, we see the folders and learning folder is selected. In the bottom panel, we see all the files in the learning folders, including its subfolders. If we now select the dotnet folder, in the bottom panel, we will only see the files from this folder.

Apart from this display of folder hierarchy, we can also apply tags to files. All tags created across the the entire note folder called testing will show up in the middle.

Here is an example from one of my note folders with two tags, csharp and linux.

Note folders

We can create multiple note folders in the settings dialog. Each note folder will act as a workspace. Notes in a note folder will only show up in that note folder.

Create all your note folders and designate one note folder as active note folder. To view and switch between note folders, there is a panel available. It might not be displayed by default or if you changed to Minimal layout mode. To re-enable it, select the following menu item.

Window > Panels > Note folder panel

This is particularly useful when we have many text files in a complex folder hierarchy.

In QOwnNotes, confusingly enough there is a feature called workspaces, but it is for different layouts we would like to use.

Keyboard accessibility

Most of the menu items are keyboard accessible. I use few shortcuts often.

Add tag to note: Alt+Shift+A
Switch to next note: Alt+Down
Switch to previous note: Alt+Prev
Select note folder: Ctrl+Alt+;
Insert current time: Ctrl+T

Conclusion

There are other features you will find useful and more.

note linking
note splitting
built-in todo list
distraction free mode
encryption
panel unlocking
scriptability

QOwnNotes has replaced markdown editors and even geany for editing markdown files. I have been using it extensively this past week and recommend it very highly. If you need a quality markdown notepad for maintaining your personal knowledge base, give it a try.

How do you pronounce QOwnNotes? For something that I am going to use every waking moment, I need to know this. Some possibilities include — Queue Own Notes, Cone Notes, Connotes, QNote, QNotes. Let us try to find out.

Learn more about QOwnNotes on its github repository. To play with markdown, use Dingus.

Search for the near-perfect note taking software

Animesh Bulusu — Mon, 06 May 2019 17:14:04 +0000

I have a lot of information stored in a number of text files littered all over my workstations from as early as 2007. For a while, I would just place them in dropbox and forget about them. I had hundreds of programming notes, error logs, dotfiles, questions to be asked on stackoverflow, potential blog posts and other miscellany.

Last month, as a part of a larger effort, I decided to consolidate all these notes into a personal knowledge base. Thus began my hunt for good note taking software.

My requirements were simple. The program must support the following features.

Plain text editing of markdown files
Hierarchical notes
Workspaces
Keyboard accessible
Customizable (optional)
In-built Server (optional)

I conducted this exercise of finding such software several times unsuccessfully over the last decade. So, a few familiar names popped up on my mind and searches.

Wikidpad

I have used it extensively about 8 years back for a good amount of time and remember having lots of notes while working in a startup. I cannot recollect the reason why I did not continue to use it. It does not fit my current requirements, but curious users should take a peek at it.

Zim

This is a very mature program and is available in apt. It ticked every checkbox except markdown format.

Joplin

Joplin is Electron based, so it is not my cup of tea. Only VSCode seems to be whitelisted in my electron_bad_for_laptop policy. At least two instances of VSCode are always running on my laptop. My note taking software is the first program after terminal, to always stay opened. I did not explore it further. Again, curious users should try it.

EverNote

I have used EverNote briefly for about a day almost 8 years back. It did not grow on me.

OneNote

OneNote is not cross-platform. This rules it out completely. It also has a proprietary format and is not great at keyboard accessibility. However, it is a great program. I use it regularly on my Windows laptop and wherever I have a subscription of Office365.

QOwnNotes

This is one name that felt familiar. Hacker News is where I seemed to have found this recommendation. I did not like its webpage design then and do not like it now. However, that is not what I am here after. As I learnt, visceral reactions are not really trustworthy.

This time I wanted to give it a try given my renewed fascination of QT based software. It ticked all boxes except the server one. I don't really care for it at the moment as I have other different plans for that.

QOwnNotes supports

markdown as the default plaintext editing option
keyboard shortcuts
hierarchical notes
workspaces in the form of note folders

There are few other great features.

Customizability - Most of the editor and the panels are completely customizable.
Note encryption - Always good to have encryption.
Markdown preview panel - With this, I have no use for other markdown editors on Linux like typora, abricotine, retext and remarkable.
Scripting - An opportunity for stepping into QML.
Auto update - It is possible to auto update from the central server, but I added the accompanying repository to my sources, so that, I could get the latest on apt update.
Vim mode - Not for me, but good to have it.
Nextcloud support - Not for me, but good to have an alternative cloud sync option.
Versioning - Not for me, but great to have. Also, I have not figured it out fully yet, but since my notes exist inside Dropbox, this is not a must have at the moment.
Cross platform - I don't use this feature yet, but it is great to have it, if you need it.

It took me around two whole weeks to organize all my files into a single folder called notes.

I love this software and wholeheartedly recommend it. I will explore these features in detail in the next post.

Improving usability of static blogs

Animesh Bulusu — Sat, 04 May 2019 20:43:00 +0000

There are three main things to focus to improve the usability of a static blog. Though I have written this with Lektor in mind, most of techniques are generic to any static blog generator.

Performance
SEO
Accessibility

Performance

Static blogs are fast by default. We can improve the page load times further by implementing some optimization techniques. I use Varvy to identify potential improvements. A few other popular websites you may find useful are listed.

Common suggestions, which I apply to my blog, include

minifying static resources
enabling gzip compression
using HTTPS

Minification

Minification is the process of compressing static files to reduce the file download size. For example, the following JavaScript snippet is 540 bytes.

var myModule = (function() {
    'use strict';

    var _privateProperty = 'Hello World';

    function _privateMethod() {
        console.log(_privateProperty);
    }

    return {
        publicMethod: function() {
            _privateMethod();
        }
    };
}());

myModule.publicMethod();                    // outputs 'Hello World'   
console.log(myModule._privateProperty);     // is undefined protected by the module closure
myModule._privateMethod();                  // is TypeError protected by the module closure

When compressed, it is shrunk to 215 bytes.

var myModule=function(){"use strict";function o(){console.log(e)}var e="Hello World";return{publicMethod:function(){o()}}}();myModule.publicMethod(),console.log(myModule._privateProperty),myModule._privateMethod();

This is a 60% reduction in download size or bandwidth costs, however you would like to call it.

I use an unofficial plugin lektor-minify to do this. To use this plugin, install it with the lektor plugin command.

lektor plugins add lektor-minify

To see the minification in action, run the following command.

lektor build -f minify:html,css,js

Open the output folder and check the HTML files. All static files are compressed. For css and js files, associated .min.css and .min.js files are created and for html files, the content of the html file is minified into the same file. Separate .min.html file will not be generated.

I include the above line in gitlab-ci.yml. It is executed just before the built content is deployed to the server.

image: python:3.6
pages:
 script:
 - pip install lektor
 - lektor build --output-path public -f minify:html,css,js
 artifacts:
   paths:
   - public
 only:
 - master

GZIP compression

Apart from minifying files, we can take care of one more level of compression. Gzipping a file compresses it to .gz file format which browsers can unpack on receipt.

If we are using a web server to serve our blog, then we can tell the web server to gzip our pages and return to the client. Since I use gitlab pages for deployment, gzipping of all content is done when the blog is being deployed.

To do this, I add the following shell command into our gitlab-ci.yml.

gzip -k -6 -r public

Here is the full example.

image: python:3.6

pages:
  script:
  - pip install lektor
  - lektor build --output-path public -f minify:html,css,js
  - gzip -k -6 -r public
  artifacts:
    paths:
    - public
  only:
  - master

This will run the gzip command after the build step is complete. Now, when a client requests for a page at the URL, /blogpost-url-123/, server returns /blogpost-url-123/index.html.gz. Browser understands this file and does an additional step of unpacking it before rendering it.

We can check the amount of compression using the website checkgzipcompression.com.

As is evident here, I got 70% savings on one of my large blog posts.

While these are the main things I implement for improving performance, I also implement a few other things based on the insights website optimization tools provide. One of them I use often is using compressed images.

SEO

SEO, which stands for Search Engine Optimization, is an optimization that improves the visibility of your website or blog posts on various search engines like Google, Bing and DuckDuckGo. An article written on a specific topic will reach more people when it is optimized for search engines.

SEO is a vast and an ever changing topic and cannot be comprehensively covered in this article. However, let us look at some popular techniques including

adding meta information
structuring content
using HTTPS

Lektor does not provide any SEO options by default. Let us take a stab at these three things.

Adding Meta information

There are variety of ways to provide metadata or meta information about an article or a webpage.

Meta tags

There are many meta tags, but the following are the most important, IMHO.

title - like title tag, but for crawlers
author - indicate the author of the content
copyright - copyright content on your webpage
description - summarize the content of the webpage
keywords - like tags, but for crawlers

In case of Lektor, I create a property on the associated model and then use it on the template. For example, to have a meta tag for description on articles, first I add a field on the blog-post.ini model:

[fields.metadesc]
label="Meta Tag: Description"
type = string

This metadesc field is available for use in templates. So I add the following markup in the head of relevant template.

<meta name="description" content="{{ this.metadesc }}" />

Since this is a field, it appears on the admin.

Meta Description field in Lektor Admin

Here is a full example with all the above meta tags.

<meta name="title" content="Improving usability of static blogs | Animesh Bulusu" />
<meta name="author" content="Animesh Bulusu" />
<meta name="copyright" content="Animesh Bulusu" />
<meta name="description" content="Optimizing my static blog for SEO and performance" />
<meta name="keywords" content="seo, optimization, optimize, static blog, lektor, performance optimization, meta tags, metadata, 2019, accessibility, performance, animesh bulusu, animesh.blog, animesh bulusu blog" />

Note: Meta tag keywords is not considered useful anymore. I was not aware of this as I added these features in between 2016 and 2017. I left it in case one would like know about it.

Canonical URLs

A canonical URL is required to indicate that a particular webpage is the original source. This can be useful for two things.

When we cross post our content into other content aggregators like DEV.TO and Medium, it will add a link at the end of the article, something to the effect of "This blog post is originally from: https://animesh.blog/improving-usability-of-static-blogs"
When we have multiple copies of an article, we could designate one article as canonical. This way search engines know that the article with canonical URL is the original and do not punish the article.

In the markup, I add the following tag.

<link rel="canonical" href="{{'.'|url(external=true)}}" />

This generates the absolute URL for the current page and is rendered as follows.

<link rel="canonical" href="https://animesh.blog/improving-usability-of-static-blogs/" />

Robots.txt

Add this file at the root of your directory to indicate whether you want your content to be indexed or not. This is in my robots.txt file. First line tells the crawler that my blog is available for indexing. The second line tells the crawler that I disallow crawling of the static folder.

User-agent: *
Disallow: /static/*

Sitemap

In the robots.txt file, add a reference to a sitemap.xml file like this.

Sitemap: https://animesh.blog/sitemap.xml

This sitemap.xml file can be generated when the site is built. I use this sitemap from Lektor documentation.

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  {%- for page in [site.root] if page != this recursive %}
  <url><loc>{{ page|url(external=true) }}</loc></url>
  {{- loop(page.children) }}
  {%- endfor %}
</urlset>

It recursively generates the links for all the webpages on my blog, which is useful for crawlers.

<urlset>
  <url>
    <loc>https://animesh.blog/</loc>
  </url>
  <url>
    <loc>https://animesh.blog/improving-usability-of-static-blogs/</loc>
  </url>
</urlset>

It is also helpful to add a link to a generated sitemap the main page of your blog. Checkout my sitemap page.

Structuring content

Headings

Use heading tags such as h1, h2 and h3, but remember to have only one H1 tag per page. The h1 tag should contain the words most relevant to your article.

Semantic Tags

Use semantic tags such as the following to structure your content.

header
main
nav
footer
article

Friendly URL

The gist of this technique is to have a URL that is relevant to the article.

Let us say you are writing an article on how to learn react.js

A URL like

https://mydomain.tld/how-to-learn-react/

is a better URL than

https://mydomain.tld/article?id=203

Using HTTPS

This is an area that feels like it is a performance thing rather than a SEO thing. It is a performance aspect in reality. However, the use of HTTPS has become common place these days due to efforts of Google. Originally, search engines have started ranking sites without HTTPS lower. Browsers vendors have more recently begun highlighting the sites not using HTTPS as "Not secure". Due to this, having HTTPS on a website has become an SEO thing.

Among other things HTTPS mainly guarantees two things, identity and data integrity.

An SSL certificate tells the browser that the information it receives is indeed from the originating party. A HTTPS connection prevents a hijacker from reading the data transferred from the server to user. A HTTPS connection also prevents the hijacker from tampering the data in transit. This type of attack is called MITM. HTTPS makes it harder to perform MITM attacks.

There is a class of malicious activity whereby an ISP injects code or ads into your connections. This is possible if your connection to a website is unencrypted. HTTPS prevents this.

Setting up an SSL certificate has been easier for at least two years now, thanks to Let's Encrypt.

Accessibility

Accessibility is a development practice that makes the browsing of a webpage easier for people with disabilities. Again like SEO, accessibility is an ocean of a topic. It is, however, of great importance that many organizations make it a legal requirement to make their web products accessible. So, IMHO, it is worth a consideration.

My personal opinion is that it is a moral obligation and should be taken into consideration when building a new blog. It is easier to fall into the trap of thinking that your blog isn't as important. Moreover adding all the extra stuff just takes time, doesn't it? It does take time, but it is your blog. There is no rush to implement everything right this moment. Keep adding things as you find time. Boy scout rule does apply here very well.

Here are a few things I have managed to implement, though not to my full satisfaction. All of these are quite easy to implement.

skiplinks - these are indicators of where the actual content starts
alt text for images and videos - screen readers would use this information to announce what the media is about
page title - this is useful for a number of scenarios
logical structure - the navigability of the site when structured logically provides a better experience to users using a screen reader.
page language
meaningful tab order - having this maintains a linear or logical navigation for users who are keyboard-only or use screen readers
focus indication - indication of where the focus is when content is accessed by keyboard
color contrast - users with poor eyesight or low vision will have a better experience if this is taken into account

Rather than recommending a specific learning resource for these individual items, I would encourage reading the WCAG checklists and the levels of compliance first and only then reach for learning on specific items.

I have recently become aware of this checklist as part of a work project. Only then, I have been able to form an internal expression on how these seemingly small things do wonders to your readers. This helped me pull this article out of draft status after more than a year.

Ending note

To improve the usability of a static blog further, one could invest time to

implement responsive web design
convert to a PWA

A PWA might be an overkill for most static blogs. However, responsive web design is a must-have if you are building your blog today. I have implemented responsive design with media queries and some flexbox.

Feel free to inspect, view-source or view the full source on gitlab.