Thoughts after Developing WordsBaking

Several months ago I started my own project called WordsBaking, which is a tool developed for helping students or learners like me to remember new English words. Considering the time and resources I have, I finally decided to use HTML/CCS/JS technologies so that it could be easier to have the versions for the three major mobile platforms.

But there would certainly be some subsequent issues. In last post, I wrote something about performance, gestures and preventing tap highlight. And in this post, I am gonna write some notes about browser bugs.

First of all, I like IE 10 Mobile quite much, comparing to original Android browser. But unfortunately, it still gets some weird bugs.

1. Scrolling issue with CSS3 transform.

I spent a lot of time locating this issue, as scrolling should be one of the most basic features, which in other word should be stable enough. It is a list of which the parent node has the style “overflow” with value “auto”. And the pseudo element “:active” of the list items has a transform with transition: translateX, so that when finger is on the item, it moves a little bit rightwards. Then the problem came, you can’t scroll the list down directly. If you want to do so, you’ll have to scroll up a little first. And, after you scroll to the bottom, you can even continue scrolling up (though the scrolling becomes no longer smooth).

So I have to change the transform to some older ways, like margin, padding, etc.

2. Scrolling issue with phone:WebBrowser control.

Ohh, again scrolling. To use pointer series of events built in IE, I have set -ms-touch-action to none under html selector. So that the page won’t move around or dance with your fingers. It works well until you get some elements with style “overflow: auto;” (or “scroll” I guess). After a list is scrolled to the top or bottom, if you put away and back your finger and continue scrolling, the whole page starts a bouncing effect. Luckily, this only happens in a phone:WebBrowser control. But unfortunately, I am using that control to wrap up my app.

I guess there should be a solution but I really haven’t found it.

Okay, so these are issues with the front end. On back end, I chose NodeJS as I am more confident with my JS skill. But it really took me quite a lot time to start due to the poor documentation. I am not familiar with back end and everyone knows I write front end all the time. I can’t say it would be a challenge to write the back-end stuffs I’ve done these days, but it was a great chance to learn new things.

The main problem I have is lack of database related experience, I don’t know how the db engine works in the box, so I don’t know how would my structures and logic perform. T-T

But back to NodeJS, I am quite missing my VEJIS, which helps JSers coding without looking for online documentations. Oh dear you know how it feels when you press the “.” but there is no accurate auto completion and hints? It might not be that helpful after one is extremely familiar with a framework, but before that, it helps a lot. And one more thing, we are never be that familiar with every new code line we write…

A thousand words are reserved here…

wb

So, I am very excited as WordsBaking for WP is almost ready for beta, after months. I always believe the power of a team, but when a team is not available, I also believe my own skills. Thanks my CTO (Chief Track Officer) for Tracking my developing progress btw, or I wouldn’t be able to finish the beta version. 🙂