Custom CRM

I came across this project on one of the freelance IT-projects websites. Because, for obvious reasons, I cannot share that much on projects I did for customers, so I decided to spend a week and build part of this app to show what I can do, how it would look like and how much I can archive in a week's time. You can see it working it working at crm.naguras.com. You can login with bob@inter.net and password 12345

I plan to add some more functionality whenever I have some spare time. I’m also thinking of making several versions of this app, each showing different technologies. The specifications document is at my Google Drive. I also put the source code into pubic repositories that you can find here: crm-frontend and here: crm-backend.

This project is a good example of how I translate business requirements in an application. After reading the specifications I still had a lot of questions but also enough to build something functional.

There is a frontend which is basically an empty shell. It contains everything you see except the variable data. The frontend is technically a static Single Page Application and can be hosted on any simple web server. Currently it's hosted in Amazon's London datacenter as an S3 website. This kind of static hosting is extremely cheap. For a business app with under a dozen users the costs would stay well under a dollar a month. You only pay for the transfer of the single webpage when it is loaded in a user's browser. So for an app like this it's probably only twice a day. This all means that it is infinitely scalable and extremely secure. Although an empty frontend would not need any security as there is no data or secrets inside the webpages. The frontend is built with Vue.js 3. and the Quasar Framework.

Then there is a backend server process that, on request, will provide the data to the frontend like lists of dealerships, venues and detailed information about a dealership or venue. It will also handle update requests for deleting or modifying data. Access to the data is limited to authenticated and authorized users only. Through the frontend you need to login providing a username and password. When a login has been approved the server will return a token with a limited expiration. With every subsequent request this token needs to be provided. Without the token or with an invalid token no data will be returned. The token contains secured information about the user who requested it like his userId and his role. By using role based authentication it's possible to have a fine grained system of who can see and alter what information. The backend is built with node js, an extremely fast javascript runtime especially suited for high transaction backend systems. This node js code is containerized using Docker. This Docker container can run on any high-end hosting facility and can be automatically scaled up or down depending on the demand. Currently it's running in Amazon's London datacenter on the smallest EC2 virtual machine. Amazon has more elegant container systems but they come at a higher price and would be overkill for this demo app. To serve data over HTTPS, I added two Docker container apps to the deployment. A nginx proxy web server together with a special nginx companion app that automatically creates and updates Let's Encrypt SSL certificates without any manual work.

The last part is a database server where all the data is persisted. Currently the datastore is a Mongodb hosted solution which is fine for small installations. Depending on the demand and use cases of an application, this database could also be hosted on Amazon.

The app is meant for desktop displays because of its high information density. But the app can be used on a mobile device. In fact the top menu bar as seen in the desktop browser is replaced on mobile by a so-called hamburger menu (the three stacked bars in the top left corner). Clicking on the menu icon will open a side drawer with an access menu to all pages in the app. Also the tables in the desktop are replaced by cards because tables are difficult to display on small screens. Because of the high information density, other parts of the application will need much more adaptation to small screens. It is doubtful if a full mobile application would be needed or useful but the Call List and the Call Report could come in handy on mobile.