TGIMBA .NET Core Upgrade – Main Display Panel – Vanilla JS, JQuery JS, Angular 6 Type Script and React/Redux JS w/Selenium Test

Git  Code Commit

Git  Selenium Code Commit

Welcome back!

This time I have added the main display panel. In the application flow, this panel will contain all of the more specific panels such as a list of bucket lists, search results and more.  So for now, this is what the user sees after successfully registering and logging in.


To get here, I did some preliminary work and then added the connecting calls to get a logged in user to the main panel. Specifically:

  • Shared MVC Controllers/Models – In this multiple client effort, I have had a fair amount of duplication. To minimize this, I have attempted to remove redundancy. One redundancy was duplicate controllers. Because each client lives in its own website, it is very hard to share code. To combat this, I created a shared Model View Controller (MVC) controller/model project. Inside each website, there are ‘hooks’ into this shared version of its controller. For the moment, this is only the HomeController.cs which has the login and registration calls to the WebClient.cs.
    • As you can tell from the constructor, the TGIMBA service and WebClient.cs instances are injected from each web client.2
    • This is where the TGIMBA service and WebClient.cs instances are injected for the Vanilla and JQuery JS clients.3
  • Added test for Shared MVC Controllers/Models – I added tests for each of the expected controller and model actions (some of which existed before).


  • WebClient.cs – I have moved this to the Shared project and added some tests. You may have noticed that I am using basically the same tests as the shared home controller. Because I am ‘hard binding’ the service to this implementation (though I am using an interface…so its not completely bad, right?) until I write the separate service down the road, I kinda have to have this duplication. A web client should not have methods (my opinion) other than Hyper Text Transfer Protocol (HTTP) calls like GET and POST. Once these clients are done, I intend to return and update the WebClient.cs and its calling controllers to use traditional HTTP calls. I will update the tests at that point.


  • Added connecting calls between the login and registration pages. If you register is successful, you go back to the login page. I also removed the cancel button on the various login pages. I had played with the idea of loading the welcome screen, but I am leaning towards not incorporating that into the Angular and React clients. So, I removed it from the Vanilla and JQuery JS clients as well. The selenium tests have also been updated.
  • Removed test projects from Angular and React projects. To cut down on complexity, I am opting to only have all of the test projects in the Vanilla and JQuery clients solution. The same code is used by the Angular and React clients and will be tested. Having the same test projects in all three solutions seems like overkill.
  • The React client built more easily after being cloned. My github repository became corrupt, so I had to start again with the project as it currently is. While rebuilding, I noticed that the react client built right away. I had to do an independent ‘npm install’ before the Angular client would build.



Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s