Learning Objectives: Week of May 11, 2020

NeedTree

Installed my first VIM plugin, NerdTree. I followed the instructions on Vim Awesome and placed the files in my vim82 folder. My only concern is that I have been using Chocolatey as my package manager, so if VIM gets updated to 8.3+ I am concerned about the possibility of losing any plugins which reside in the vim installation folder.

Update: I added vim-plug a plugin manager for Vim. I also updated my _vimrc file with a line for NERDTree. I then opened a new Vim editor and typed :PlugInstall which went ahead with the installation. I also added my Windows config file to GitHub for later reference. 

I’ve discovered that out of the box, the plugin isn’t very intuitive. Without mouse support, I learned quickly the importance of reading up on the documentation. For example, I didn’t know how to focus on the tree panel using :NERDTreeFocus.

Update: if you use `ctrl+w’ twice it will move your cursor to a different window. Also, the h key moves the cursor left, j down, k up, and l right.

Redux

Redux allows you to keep track of your React application component state in an easier way through the use of a parent object-store. You only change the global state when you call a reducer function that accepts an action (descriptive “why” string) and a state. This process makes it easier to manage and organize your applications’ state.

I had been working on a mapping app for my local church. The app has several components for filtering a map with form controls, page routing, and specific leaflet mapping components. There are several components that are similar to one another and a three-tier layered component tree. At times tracking parent and child state has been tedious. I am learning Redux so that I can more easily manage state and reduce developer time in the future. 

I went ahead and followed along with a YouTube tutorial video. Unfortunately, I ended up more confused than when I started. The most valuable asset I learned about was the ES7 React/Redux/GraphQL/React-Native snippets plugin for VS Code and the Redux DevTools for Google Chrome.

Blazor

You don’t have to create a new application in order to use Blazor. You can incorporate Blazor in an existing MVC app.

  1. Add Blazor services to startup.cs
  2. Create a new component
  3. Add Blazor JS file to razor view
  4. Attach the `html.RenderComponentAsyc` method to a HTML tag helper

Blazor shares a lot of commonalities with Web Forms in that there is a presentational code layer. If you have a variable you want to data bind to a form element, you would write the associated code in a razor file. You can, however, decouple the two by placing the associated code in a new file with the same file with the “.cs” extension name.

Clean Architecture With ASP.NET Core

Jason Taylor created a great video where he describes how to keep your projects simple with the use of a clean architecture template. You are not forced to use Angular or a specific database storage instance even though those are included out of the box. The template includes the following layers for organizing and simplifying your work:

  • The domain layer contains enterprise-wide logic and types
    • Entities, value objects, enumerations, logic, and exceptions
  • The application layer contains business logic and types
  • Infrastructure layer contains all external concerns
  • Presentation and Infrastructure layer only depends on the application layer

ES6

Learned about deconstructing arrays and object parameters. 

VIM

I completed the free VIM Adventures game and learned about b(move back a word), x(delete a character), w(move to the next word), and e(move to the end of either the current or next word in the sentence).

Below is a list of commands I learned about using vimtutor:

  • G: go to the end of the file
  • gg: go to the beginning of the file
  • 2G: go to line number 2
  • / + word + enter: search doc for word
    • n: search next word
    • N: search the previous word
  • dd: delete line
  • p: put a deleted line
  • d2w: delete two words
  • $: to end of line

Deno

One of the original authors of NodeJS was disappointed in the evolution of the Node.js runtime. He decided to create his own version, DenoJS, with several changes. Specific changes address security, dependencies, and typescript

 Deno now is a more secure version of NodeJS in that when running your apps, you need to pass flags to allow features such as HTTP and file access.

Out of the box, Deno no longer uses a node_modules folder and can easily run TypeScript files without the need for ‘ts-node”. Instead, dependencies have been decoupled, you can now pass in URL’s, hard drive paths, or GitHub links. 

I have discovered through trial and error that Deno does not work on non-64 bit operating systems. You are out of luck if you want to install this on a Raspberry Pi.

Leave a Reply

Your email address will not be published. Required fields are marked *