React Hooks/React Table demo

I do a lot of React and C# at work. Looking to do more with the cloud at work but have not been presented with opportunities at work in that area since last year.

So I was asked to do a rough and dirty sample react app (not spending too much time at it) that will address the following requirements:


A retailer offers a rewards program to its customers, awarding points based on each recorded purchase.

A customer receives 2 points for every dollar spent over $100 in each transaction, plus 1 point for every dollar spent over $50 in each transaction

(e.g. a $120 purchase = 2x$20 + 1x$50 = 90 points).

Given a record of every transaction during a three month period, calculate the reward points earned for each customer per month and total.
· Use React JS
· Make up a data set to best demonstrate your solution
· Check solution into GitHub

So I checked in my solution at:
https://github.com/kousekt/reward-points

Now granted, I don’t claim that my way is “correct” or “good” or even “recommended”. Had I had more time, I would have liked to do more with the lodash/grouby/aggregation rather than to manually calculate the totals.

But it does demonstrate hooks and the ReactTable control.

Youtube video here

Thoughts on Redux again

Recently I have been working on a few large scale applications where the front end is in React and the back end is using restful API’s in .NET Core 2.1. Without giving away company secrets, the applications are products that implement a platform sold to behavioral health businesses that employ clinicians and care managers to provide services to members. The services are calculated/recommended via screenings which are then calculated into scorecarsds. From there, it is determined which programs the specific members would be best suited to partake in given their condition.

Having said that, the front end has hundreds of pieces of information that need to be kept in order to determine the proper workflows to undergo from screening questionnaires to online reporting to scorecard/program analysis.

How are we able to maintain this in a “sane” manner thru React? Well it would have been a nightmare to pass props all over the place to each of the components. We only really use local component state to manage the appearance of controls in the specific component.

Enter Redux. I used Redux with success in an application using Angular2 and we’re having just as much success with it in React.

I cannot recommend enough that you explore Redux if you have not done so already and are using React and/or Angular. I cannot speak tho if Redux is suppored with Vue.js.

Angular app using AWS Cognito, AWS Api Gateway and AWS Lambda

 

Wanted to put together this quick demo (which is not really a tutorial per se) that shows how you can use AWS Cognito to authenticate a front end (in this case an Angular app but it could be React, etc..).  Once authenticated, you can then invoke a restful API via the AWS Api Gateway service (which invokes a Lambda function).

AWS Cognito is what you could use if you’re using AWS and you’re developing a mobile app out there that needs to securely persist/use users/passwords out there.

I’d love to know what the equivelant in Azure would be.

Angular source

https://github.com/kousekt/angularcognitotest

 

 

I was curious of the Azure equivalents so I found this link

https://docs.microsoft.com/en-us/azure/architecture/aws-professional/services

 

Deploy .NET Core 2.0 app to AWS using Cloudformation/CodePipeline/CodeDeploy

Elastic Beanstalk is one way to do this fairly easy. Another way is using Cloudformation templates (there are several Cloudformation tutorials out there).

I share my experience in two youtube videos demonstrating how I was able to create a test .NET Core 2.0 web app and deploy it to AWS. The cloudformation template provisions a windows server 2016 EC2 instance and installs the CodePipeline/CodeDeploy agent to it. Part1 ended abruptly for reasons I explain in the beginning of Part2.

I hope this helps someone out there as there really is not much out there in the way of documentation that brings this particular task together for a .NET Core 2.0 web app deployed to an Windows 2016 AWS instance in the cloud utilizing CodePipeline/CodeDeploy.  I attempted to do that here.

Thanks!!

Part1

Part2

Scripts can be found here
https://github.com/kousekt/CloudFormationCodeDeployWindowsDemo

AWS Powershell toolkit
https://aws.amazon.com/powershell/

The original project (.NETCore 1 RC2) that this was based off
https://github.com/awslabs/aws-blog-net-exploring-aspnet-core

The .net core runtime and windows hosting downloads can be found here:
https://github.com/dotnet/core/blob/master/release-notes/download-archives/2.0.5-download.md

Learning and working with Umbraco

I was placed on a project recently using Umbraco.  Without revealing any proprietary information, there’s a .NET Core web application that needs to work with dynamic content.   Umbraco was chosen as the CMS.   For those not familiar with Umbraco, it’s an open source CMS implemented in ASP.NET/MVC.   You can write a web site from within Umbraco and have it read from its own content.   In our application, we are using Umbraco for creating/maintaining the content and then publishing that content over to the .NET Core application.   Umbraco also provides hooks as you can enable the REST api and then reach out to Umbraco to update/pull content, etc…

I created a quick video with a recommendation on one of the best free tutorials on Umbraco that I could find.  In this video, it will explain what you will learn if you follow along with the tutorial.   Thanks for reading.

Here’s the video

The source code that I created while following along with this tutorial can be found here in case you wanted to save yourself some typing.

https://github.com/kousekt/UmbracoTutorial