A Self-Contained UI component.
In BrewCareer.com, users will have 3 different status: normal visitor, signed up member, and mentor. According to UI, these 3 status share same CTA button with different states and behaviours, that means we need to create a button component which is adaptable no matter users are in which status.
The CTA button needs to be self contained, it fully adapts to user’s status, so we need to set the logic properly, make sure users always get what they expect while they are interacting with application.
Since users status potentially could be more in the future, we…
Deep look into the cause of the similar issue we’ve seen before.
Once again, our old friend, the rendering issue we had before appeared again, which is supposed to be resolved by tweaking :key value, and it has similar behaviour that the issue only appeared on Prod mode.
so first of all, we compared the error message between Prod and Dev mode which can be seen as below.
To approach a more maintainable CSS codebase.
While maintaining colour variables, one thing I felt really painful is naming new colours. For example, if we need to add a new grey colour which is for menu background, usually it would be named as
menuBackgroundGrey straightforwardly, but what if this grey is also for the text colour?
Then we will see this:
color: $menuBackgroundGrey; or
It does look bit weird, but I think this is still fine, what really painful is there are always multiple menus existing in website. …
The common issue in Vue.js
As mentioned above, we had an component rendering issue, but the weird thing is it only happened on Prod, on local it still worked well , so this unusual behaviour made us suspect that some conflicts might happen on Prod server. …
In Odds.com.au, we use odds comparison tables (below) to show different odds of each competitor, so users can quickly choose the one they are after, and make the best bet.
In racing game(e.g. horse racing), we put a switch button on top left of table, so users can see the results in different bet type by just clicking, a very typical page interaction in many other websites.
In our approach, while button is clicked, it will hit API endpoint with different param, then presenting the updated data in component without page refresh. During this process, we need the button to…
Odds.com.au is a platform which provides punters all kind of convincing information while they are trying to compose their own betting strategy and seeking for best bets. As a member of web development team, one of my major tasks is to make sure our users won’t get frustrated while they are ready to enjoy the party, like FIFA World Cup 2018.
Before FIFA World Cup coming, we added few features aiming to let punters would put Odds.com.au into their daily essential while they are enjoying soccer party, like Live Score, Confidence Meter, and a simple Stake Calculator. According to result…