Codemash 2019

Earlier this month I attended the Codemash developers conference at the Kalahari Waterpark in Sandusky, OH. This was my 11th time going to the conference and I always come back with a list of things I want to learn more about. This year was no different and overall it was probably the best one I have attended. Following are a few of the more interesting sessions I attended.

 

Best Practices for Robust API Development in ASP.NET Core

This was full day workshop that went through in detail a typical API architecture written in .NET Core and including other common packages for Dependency Injection (Autofac), Testing (XUnit), Logging (SeriLog), Mocking (Moq), API Documentation (Swagger), Object Mapping (AutoMapper), plus a working example of using MongoDB with .NET Core. Lots of good takeaways from this.

 

A Hands-on Intro to Containers

Although Docker is not new, I have not really done anything with it before. This ½ day session included an AWS instance with the prerequisites already setup so we were able to go over creating a Docker image, and using DockerHub to find existing images to work with. It was a perfect to getting-started workshop for my level of Docker experience.

 

Database Devops in Docker

This session, in addition to the Docker pre-compiler, went over some cool uses of Docker images.  The most interesting one to me was where the speaker described how each night that take a backup of the their production database, scrub the data of private information, and update an internal Docker image with the database backup.  Then each morning all of the developers can pull the new image and do their development with data that is essentially production data.

 

Service Workers and Intro to Progressive Web Apps

These were two separate sessions but they are very much related technologies.  Service Workers are a key part of Progress Web Apps. I have many years of web development experience and PWA’s are something I have been interested in learning more about.  The PWA session was a great introduction and included details on when a PWA is the appropriate choice for an app, and a lot of good examples on how to setup a PWA.

Overall I feel like the time at Codemash was well spent and as usual I have a list of new tech to on my list of things to learn more about this year.

 

Angular – Refreshing a Route with Parameters

Angular routing is pretty nifty.  Going into how it works is beyond the scope of this post Mike Berryman(and there’s plenty of resources out there doing just that), but suffice it to say if you’re working on an Angular application, you’re using Angular’s routing.

One of the things Angular’s routing does to increase performance is reusing a Component for a route that has already been instantiated.  Say you have a Component, “MyComponent”, tied to a route, “/MyPath”.  “MyComponent” isn’t created until the user actually navigates to the “/MyPath” route.  That makes perfect sense – why instantiate a component that doesn’t need to be used yet?  What’s interesting about this design, though, is how parameters factor into it.  Let’s say you add a parameter to your “/MyPath” route, making the route “/MyPath/:id”.  The first time the user navigates to some version of this route, let’s say “/MyPath/1”, “MyComponent” will be instantiated (with the id parameter set to 1).  Then if, without leaving that route, the user changes only the parameter – for example, there’s a link in the component to go to “/MyPath/2”, “MyComponent” will not be recreated.  In fact, if not handled correctly, to the user nothing will have changed.  It will still look like they’re seeing the “/MyPath/1” version of “MyComponent”. Continue reading “Angular – Refreshing a Route with Parameters”

Talent Shortage with JavaScript Frameworks

Talent Shortage with JavaScript Frameworks

According to a report from HackerRank the widest skill gap with IT talent plays out in JavaScript frameworks, particularly with React. More and more employers are seeking developers proficient in the framework, but the talent isn’t readily available just yet.

It should also be noted that AngularJS and Node.js are more heavily favored by developers. Spring and Django seem to gaining popularity with employers and developers alike but not quite as much as React. Visit HackerRank for the full breakdown.

Evaluating HTML5/Angular Data Grid

misc1I’m implementing sorting, filtering, and grouping for a data set to allow business users to look at information in various ways for more comprehensive data analysis. By using a pre-built component, time is saved by reducing development time for implementing the feature.  This is replaced by configuring and adding logic for the grid to work. I tried out a few different data grids to see how they might meet my needs:

UI-grid

  • Control selected/displayed columns
    • Must manually load / save user selected columns (implemented on other tables)
  • Column Filtering
    • If we limit the result set and do NOT use pagination, then we can use filters inside the grid:
      • Supports less-than and greater-than — need to be in separate inputs
      • Dates need to be typed in by hand (and need to specify format) or create a custom date filter
  • Saving/Loading Filters     
    • The filters store the column data like “grid.column[i].filters[0]” so it would be pretty easy to store that data to a database and then pre-populate back
  • Exporting
  • Pagination
    • Painful but possible with the filters and just passing them to the server and handling them individually
  • Printing
    • Export to pdf and print


Dev Express Grid

  • Control selected/displayed columns
    • This will be a manual process as well (combining this with the ‘visible’ properties on the columns)
  • Column Filtering
    • Again, we would want to NOT use pagination and just limit the result set
    • Contains built-in equality operators
  • Saving/Loading Filters
    • I’m having difficulty finding out how to do this.  It seems that this is close
  • Exporting
  • Pagination
    • They only have simple pagination samples, none containing filters
  • Printing
    • Export to excel and print
    • Export to pdf on server (or client)

Telerik KendoUI DataGrid

Note: although this seems like a fully-functional datagrid, it’s hard to find examples for angularjs.  It seems most are plain javascript.

  • Control Selected/Displayed columns
    • Must be handled manually (like all others)
  • Column Filtering
  • Saving/loading filters
  • Exporting:
    • Exports to PDF
    • Exports to Excel
  • Pagination
    • They only have simple pagination samples, none containing filters
  • Printing
    • Export to pdf and open then print

 

Printing seems to be the biggest issue across all three of these data grids. UI-Grid can do CSV and pdf in Chrome, DevX Grid can do Excel only). Up next, I’m looking to do the following:

Choosing the Right Front End Tools

Rick HerrmannRecently, I had the opportunity to meet with a client that was in the process of deciding on a front-end technology for their dev team to use.  They already did quite a bit of research and formed some opinions about different technologies, and wanted to get our opinion about the way they evaluated their options. One point I made early on in our discussion was that there is no one “right” answer to the question of “which tool(s) should we use?”.   Continue reading “Choosing the Right Front End Tools”

Router Events in Angular

Mike BerrymanWhen working with Angular Routing, it’s very useful to be able to respond to routing events – the most obvious and useful being when the route changes. In AngularJS this was accomplished with by attaching a callback function to one the “$routeChange” events on the $scope. In Angular the concept is similar but has some key (and in my opinion, useful) differences.

Once you have a reference to the Router for your application you can subscribe to its “events” observable. This observable will emit a route-event whenever applicable that you can listen for. Being an observable you can subscribe to it in multiple places, filter for the specific event you want, transform the raw event, or anything else you could do with an observable.

Continue reading “Router Events in Angular”

Custom Validators for Angular 4

Rick HerrmannOn a recent Angular 4 project I had the need to use some custom form validations.  Out of the box, Angular 4 contains validators for required, email, pattern, and min/max length, and it is possible to write your own validators as well.  In particular, the custom validation I needed to do was verify that two fields were equal.  For example, a form where the user enters a phone number, and then confirms the phone number in a second form field.  The custom validation would verify that the two text inputs had the same value.

Continue reading “Custom Validators for Angular 4”