I Just Released My English Number Listening Practice App

Yes, I just released the first rough version of my English number listening practice APP: English Number

Why An English Number App?

I m having my NAATI class recently, it is a course that helps you practice to be an interpreter. I’m doing English-Mandarin interpreting.

The practice is usually based on a dialogue conducted by an English speaker and LOTH speaker. What I will do is interesting the content from the English speaker to Mandarin and the other way around, one by one.

Continue reading →

Lower you expectation for Webpack’s Tree Shaking

Recently I upgrade my project from webpack1 to webpack3, one of the main highlight feature for me is Tree Shaking. Depnding on the static structure of ES6 module system, webpack is now able to get rid of unused modules from your build.

That sounds very cool, but after I finished my upgrade and rebuilt my project, the decrease of the file sizes did not reflect my expectation.

Why? Did I not use it right, or is it actually not working?

Continue reading →

Adding `skip()` and `only()` features to unittest

If you are like me, a python newbie just moved from web front-end world, you must have used Mocha before, the most commonly used test framework made by the genius TJ.

skip() and only() are the two most useful features for me among all the tools that Mocha provides. So when I started to write test cases in Python using Unittest, I felt so frustrated, because there’s nothing that can do the same as the skip() and only() did for me.

So I am going to teach you how to add these two features to unittest-testing in this article, but before we get there, I want to talk more about why these two features are important to your development.

Continue reading →

Using raw SQL with Flask-SQLAlchemy

This week I was using Flask-Migrate to do a database data migration. I created an empty reversion file and put my migrate script in it so that the migrate can be recorded just like the other reversion files.

The only thing special about writing a migration script is you need to use raw SQL to do the database manipulation instead of using ORM model object from Flask-SQLAlchemy. The reason is that maybe at the time your script is written, your model definition in your application reflects your actual database structure, but it may change over time, and once that happens, your script may not work correctly anymore.

This is one thing that I think is quite important when you are doing data migration with Flask-Migrate.

Continue reading →

Responsive Master-Detail Layout in React

I am using React with React-Router to make a SPA(Single Page Application) recently. In my setting page, I adopted the typical Master-Detail layout.

It’s quite easy if you only need to make it work on desktop devices, but for small devices, you need to put extra effort into it.

This article describes how I implement the Master-Detail Layout which works well on both desktop and mobile. If you just want to see the end result, check out the demo project.

Continue reading →

How to avoid preflight OPTION request in CROS request

When sending CROS Ajax request, sometimes you may found that before every request you make, there will be a OPTION request sent.

It’s quite annoying and slows down your data request since the actually request has to wait the OPTION request to finish.

According to the CORS strategy (highly recommend you read about it) You can’t just force the browser to stop sending OPTION request if it is necessary.

There’s two way you can work around it

  1. Make sure your request is a “Simple Request”
  2. Set Access-Control-Max-Age for the OPTION request

Continue reading →