Creating a dashboard with numbers and fancy charts is always a pain and involves whole lot of work. If the dashboard is for your clients, your end users, then it’s inevitable and it will be worth the time doing yourself given future changes are always going to happend. For internal monitoring, data reports, it’s a different story. We can always make our own dashboard to make the team happy but it has its costs, while at the same time there are already a lot of BI tools that is easy to use and flexible enough for this purpose. So this

My Parallel Desktop subscription ended again when today I was trying to use my Windows VM to test out a page on IE. Over the last 12 months I had only been using vm for very limited reasons, and probably ended up only opened Parallel Desktop for twice. A $99 renew for maybe another two times open of it just does not make senses to me. So I decided to find a cheaper or free alternative. Luckily I found VirtualBox, which is free and open source. As I already have things setup in my Parallel Desktop VMs, so it would

This project is to showcase a common use case in React web application that a List page with search and pagination while their state needs to be synced with the page URL query. Check out the Demo here You can also check the complete source code here Features Users can use the Search component to type in a keyword and hit enter or click “search” to trigger a list search. The list result should be rendered together with pagination, which allows users to navigate between different pages. when users trigger a new keyword search, the page needs to be rest

In my recent project, I was asked to implement several features that needs to use Puppeteer, mostly using it to open web pages and get content. The first feature is generating screenshot of given website URLs, a service that takes a URL and return Base64. The second one is similar, but instead of generating a screenshot of a given URL, it is required to general a thumbnail of a product detail page. To achieve that, we came up with an idea that creating a dedicated thumbnail web page for the detail page, to which we used a secure way passing

The general tutorial from Heroku: https://devcenter.heroku.com/articles/s3-upload-python The main benefit for this approach is that AWS will now handle the process of the actually uploading, so that our server does not need to worry about the performance and it’s scalable.

Finally I setup Cypress for the project that I am working on in my company. After wrote several test cases, here is some take aways I want to share. Stub Network Before Visit When stubbing the requests for test cases, cypress need to know about the routes before the reqeusts being made from the app you are testing. This is crucial for the initial requests that your app will emit to load initial data used to boot up.

I got a task about Xero integration in my work last week, aiming to copy invoices from one account to the other. To perform this task, the workflow will be: Invoice created/updated in Xero account A The webhook from Xero account A is triggered Our App handles the webhook and copy the newly created/updated invoice to Xero account B This article will show you how to setup Xero and talk about some tricky parts of the task.

UI Test has been a problem for every web front end project once it grows and becomes rather complicated while the common unit tests fail to cover complex workflow and business logic. UI Test in this artile, I would say it’s more like integration test, but I would not put it as E2E test, since I have no intention to test the real backend. So the things that I am going to talk about in this article, are “login and redirect to the home page”, “sign up and redirect to the home page”, “create a query in the dashboard and