Blog

Simple Vue splash screen

Today, ill just introduce a nifty little trick to create a loading screen, to let your users know that your app is still working, even though it takes a while to do the initial load.

Splash screen

The idea is to add the loading/splash screen to the .public/index.html file inside the <div id="app"></div> or whatever your mount point is, because vue will remove whatever is inside, when it is done loading the components.

I’ve just created a new vue app from the CLI.
To simulate the slow rendering I’ve put a delay function in the HelloWorld.vue which is then called inside of the beforeMount()

In the .public/index.html file I’ve added;

which is just some simple animation css and inside the <div id="app"></div>I’ve added the following:

You can find the full project on my github

Special thanks to https://codepen.io/luka-butina/ for the Loading Screen.

Throttling actions in .Net Core 2.1 using AttributeFilter

I have previously written about Throttling in the pre-core times, and this is sort of the update to that post – with a bit of fixes and tweaks.

Lets get to it;

A few changes:

In my last post I did things a bit differently, for instance; I used to throw a custom exception type and handle that as a response, I have learned that this is an anti-pattern and is strongly discouraged (at least by David Fowler).
Anyway now we return a class, which is basically just my old ApiException type, just without the inherited bits of Exception. – this is both cheaper and cleaner.
Also since we are using .NET Core, we are using IMemoryCache instead of HttpRuntime.Cache – which is also nice.

services.AddMemoryCache();

On to the attribute:

There isn’t a lot to it to be honest.

  1. Check for existence of cache entry
  2. If none, create one and set allowExecute = true
  3. If allowExecute != true, return throttle response and short-circuit the pipeline.

Do note that this throttle uses IP as it’s target, but could easily be username or similar.

Usage:

[IPThrottling("GetItems", 300)]
[HttpGet]
public ActionResult<IEnumerable<string>> Get()
{
    return new string[] { "value1", "value2" };
}

The above throttles for 300 seconds for the GetItems key, so you can group together functionality as well, if you really need to.

Ill talk about the custom response in a different blogpost

Developer and Power User Tools

Developer tools

  • Visual Studio Code
    Great editor, that (at least for me) has beaten sublime and the others. – built with electron as well!
  • Visual Studio
    I am a .NET Dev, so this is pretty essential for my daily use.
  • Notepad++
    I’ve switched mostly to use VSCode as my main editor, but for small things I like the speed of notepad++.
  • DockStation
    “Visual Docker” Dock station helps me quickly assemble large container applications with not much more than some drag and drop. Awesome!
  • HashCheck
    A simple right-click menu tool for getting the hash of any file.
  • Advanced Installer – Paid
    For any project I do where I need an installer, I use advanced installer… it’s simply an amazingly easy to use tool for all installation needs. (even does installer from *.sln file.)
  • GitKraken
    The best git gui out there.

Visual Studio Extensions

Ive made this a category by itself as there are many really good extensions.

Power User Tools

  • Fiddler
    Webrequest sniffer.
  • Wireshark
    Package sniffer.
  • Postman
    Best Rest Client.
  • ConEmu
    Guake style powershell prompt – whats not to like?
  • Everything search
    Great indexing and searching engine with a hotkey.
  • 1Password – Paid
    Everyone should be using a password manager these days, I use 1Password.
  • LightShot
    Awesome screenshot taking app.
  • Snagit – Paid
    Another amazing screenshot tool.
  • Evernote
    Notetaking for pro’s. nothing to more to say.
  • OneNote
    Another great notetaking app.

Chrome Addons

  • YSlow
    A website “slowness” tester for chrome.
  • Toby
    A much better (shareable) start page for chrome.
  • Awesome Screenshot
    Full page screenshots.
  • ColorZilla
    A Colorpicker.

Websites

  • Codepen.io
    Some fiddle, some bin, some plunk.. I pen.
  • Foundation for email
    Need html emails, but have html and separate css? – no problem.
  • APIMatic
    Transform any api spec into any other api spec.
  • Can I Use
    Lookup any html/css feature and see if its supported by browser xyz.
  • GuidGenerator
    A great looking, simple to use, Guid (v4) Generator.
  • Cron expression editor
    I keep forgetting how to Cron.. never again!
  • Http Status Codes api
    Awesome api to test statuscode handling – just request http://httpstat.us/418 or any other (Supported) status code.
  • Simple Online Rest Api
    When you just need to prototype – Request one of the endpoints and itll return what you sent (basically).