Web Development – Page 2 – Gordon Chan's Tech Blog

Gift with love – Hong Kong new Gift for baby / kids option

新網站登場，協助兩位女站長設立她們原在Facebook平台的生意轉戰到網店層面。她們的網店售賣澳洲入口的純天然嬰兒產品。包巾、安睡公仔，和暖色系和簡單的卡通造型是他們商品的風格。可作為朋友同事祝賀新生嬰兒的禮物選擇。

網站: https://giftwithlove.com.hk
Facebook: https://www.facebook.com/giftwithlovehk/
IG: https://www.instagram.com/giftwithlove_hk/

Github remove Weak cryptographic standards

Since 23 Feb 2018, I find one of my work operation keep failing. In my workspace I have a Jenkins checkout Git repo which further run bower and Gulp for dependencies. It keeps saying Github fail to connect. The error say the HTTP protocol is not support, or cannot make HTTP connection. And turn out we find we fall to one of the scenario that our Jenkins server no longer able to get things from Github because Github disconnect the support of the following weak cryptographic standards:

TLSv1/TLSv1.1
diffie-hellman-group1-sha1
diffie-hellman-group14-sha1

Ref: https://github.com/blog/2507-weak-cryptographic-standards-removed

Since the incident, I aware the linux server we have for our Jenkins is already kind of old.

Turn out we have to upgrade our Linux to have latest openssl, libcurl and git using `yum update openssl libcurl git`

I though the story is about to end after my colleagues upgraded the changes. Another side of the workspace dev buddies start complaining the failure of building the application. And they are actually working on VM which is CentOS 6.

After checking, our VM has CentOS 6 with openssl in 0.9, git with 1.7.2 version, both of them do not support TLS 1.2 (the version that supported by github from now on)

Therefore the way to fix the issue is to update these modules. Sadly, updating them in CentOS is not straight forward, and here are some command I ran to get them upgrade:

Update openssl (you may need sudo):

# cd /usr/src
# wget https://www.openssl.org/source/openssl-1.0.2-latest.tar.gz
# tar -zxf openssl-1.0.2-latest.tar.gz
# cd openssl-1.0.2a
# ./config
# make
# make test
# make install
# openssl version

If you still find the version is incorrect, check which openssl to find which openssl is pointing at

Update GIT:

# yum install http://opensource.wandisco.com/centos/6/git/x86_64/wandisco-git-release-6-1.noarch.rpm
# yum install git

Hope this helps.

ref:

協助開店/尋找有意合作伙伴

若果你經已以 Facebook 專頁經營網上商店業務，有商品圖片、簡單商品說明／SKU，但未有正式網站來管理下單、發貨；對 Shopify 有興趣，想了解應用此平台作為你的落單管理／POS系統的話，歡迎來信查詢，小弟正尋找有意合作之平台／網店，我提供技術建議，協助你透過 Shopify 來優化你的網店業務。

若有意了解更多，不彷留言或 PM 接洽。

Talk about hybid mobile app

For a mobile app development, it has 2 approaches: Native VS Hybid. In general the cost for building a native app is higher than a hybid app, especially for some e-commerce store they already have the site running, they want it also run in app to enable some feature like barcode scanning or wallet integration.

I am not a big fan of hybid app, but things not always go alone with your idea and sometimes showing respect to business decision is the way you need to go for. So I would share some of my lesson learn for such hybid app development:

The web and app development coupled

Once you decided to have the app run in hybid, you not only have to guarantee your app running, but also have to have the site the app ride on always up. If there is down-time, by accident or scheduled maintenance, you need ensure the app has proper handling or your app user will find the app fail to work.

Session sharing

As you may develop some part of the app as native, for some operation which require session sharing, you will have to deal with the sync of the session so it wont result in invalid session or fail to sync the session in native and that in webview

Provide information for the webview

For some case, even not ideal, your web may need to show some mobile app specific content, the way to tell the webview is by mean of user-agent. Modifying the web-view user agent with providing the hint of the web is being rendered in app’s webview, version information is also important. This allows you to run any targeted content by means of detecting the user agent string.

Performance about hybid app

This is not something new, rendering website in webview does not perform well comparing with using native approach. With descent API as the data source for the app, the payload for a request is likely smaller than loading a web page, this helps provide a better performance as you take shorter time to download the content. Sometime Webview needs to download all content in order to show the page.

Challenge on App vs webview tracking statistic (if deep link enabled)

If the web the app ride on is a e-commerce store, it oftens have many affiliate tracking. And if you have deep linking enabled. The traffic to your site will bring to the corresponding section of the app. This is actually breaking your affiliate tracking, having a reducion of traffic that execute your tracking as the web not even rendered. And even the tracking code can execute in webview, the data stored in the URL in form of param can lost, result in failure of getting the information that you need. Implementing tracking in app is far more complicate compare with the installation in web, the high cost and heavy effort demond to get the data right is far more complicate than you can think of.

It will never be complete native, and result in hybid forever

If you think of having the app run in hybid first, and turns it to native. I look forward your success, or you just planting a technical debt which never likely resolve, and this is a Tech Debt.

Therefore, if you take part in tech planning for app development, try not define your app to run as hybid unless you have really good plan to evolute it afterward.

Video playlist which help you understand more how to run a E-Commerce business

I often amazed by Shopify as it often offers various kind of documentation and support material to empower store owners / eCommerce merchants to know their business better and how to run their online store more effectively. Recently I receive a note from Shopify that there is a video series which is developed by Ezra Firestone of Smart Marketer, he shares his success business use-case and I find it does bring out some points that I lack of language power to illustrate, here you go:

Gain your domain control from Shopify / OpenSRS

You need a domain name for your website / online store. Like my site, gordon-chan.net is the domain. You have your domain share to people so they know how to reach your site.

For people who new from website / online store setup. When they register Shopify for their store, they could also purchase a domain through Shopify so as to get rid of having the store domain as xxxxx.myshopify.com .

Shopify sell a .com domain with USD $13/year, and they help you integrate the domain with the store seamlessly. It seems handy, and yet, you can actually have other choice.

Buying a domain from GoDaddy or some other domain service provider is very easy, and often offer you much more discount if you register for few-year package. Let say GoDaddy sell a .com domain $8 + $120 = $128 for 2 year ($8 for the first year). Of course, GoDaddy is famous with its poor / non-user-friendly interface. Yet it is the cheapest domain seller I ever see. Some other clients use Domain Discount 24 , again, the feature is detail but the interface is quite traditional.

So, having shared alternative option for domain purchase from cost perspective, any other reasons for not using Shopify domain? Answer this, you need to aware Shopify is actually working with OpenSRS, which is the real domain service provider. When you signup a domain through Shopify, you don’t receive any information about the domain management. Like any login information for domain panel. It is indeed when you need to get your domain integrate with GSuite / verify your domain ownership using domain CNAME records etc. You can get your domain panel information with a very simple and feature-less interface only if you call / live-chat with Shopify Support, which sounds weird to me.

Apart from that, domain renew fee is bundled with Shopify invoice, You cannot purchase the domain for X years, or add any additional protection to the domain.

So, I often recommend my clients, either buy domain from GoDaddy and seek for Shopify Expert help on the configuration (link up the domain with the Shopify store) or contact Shopify support to obtain the domain login information as soon as they can, in order to gain back the control of the domain.

References:

Shopify: Buy a domain: https://help.shopify.com/manual/domains/buying-domains/buying-a-domain

Shopify: Managing domains: https://help.shopify.com/manual/domains/managing-domains

GoDaddy: https://hk.godaddy.com/

Tips for Shopify Store setup

Here are some tips I would share with people who wanna setup a Shopify Store for their online business.

Seek for a Shopify Expert for help

Not attempt to but fine if you do treat me as sale-person for my own freelance business, just, there are quite fundamental benefit for finding help from Shopify Expert. Apart from the potential cost for consultation, you will definite save costs that you may not necessary need to pay for.

Some clients come to me for Shopify store setup, but they often already start paying Shopify for some time and they fail to get the store work in the way they like so seek for Shopify Expert. In fact, Shopify Experts are authorised to setup “Development store” which is Shopify Store that with majority features but no trial period limitation.

In general, Shopify Experts know how to assist you to technically achieve something you want, and what is technical infeasible before it comes to solid request. People who start paying Shopify while not knowing Shopify limitation will result in a waste of time and money. At worst, they are not satisfied with what Shopify provides and cannot utilise this platform for their business.

Cost for hiring a Shopify Expert can be minimal. Free of charge is not the way we go for, but Shopify Expert like me treat meeting potential clients as friend-making.

Cost for a Shopify Store Setup

There are few area you need to spend money for store setup or running a store in long run.

Consultant fee for hiring Shopify Expert
- Some Shopify Expert are fine to share with you the detail about Shopify, some other may impose a consultation fee. No matter what, look for multiple Shopify Experts and compare their service pricing models.
Shopify Store Monthly / Yearly subscription fee
- No doubt you need to pay Shopify for the service, but this cost cans be deferred. Apart from Paid Store, with feature depends on the subscription fee, there is another type of Store: “Development Store” which can be setup by Shopify Experts, having no 14-days trial limitation, but with few restrictions:
  - Cannot install Shopify App which incur fee
  - Cannot perform real payment transaction
  - Cannot link up with your domain (which mean need to stick with *.myshopify.com
Shopify App subscription fee
- Shopify App provides you features that not supported by Shopify out-of-the-box. Example: Some store wanna customer upload their logo / image as tailor-made T-Shirt. Shopify does not support this, but some app like Product Customizer can provide this capability; Shopify cannot do multilingal, it support translation but only single language can be shown. You can use Langify to achieve this feature.
- Shopify App can be:
  - Free
  - One-time subscription
  - Monthly subscription
  - On-demand subscription (charge per usage, like some image optimisation)
- Transaction fee
  - Whenever you receive an order and perform the transaction (captures the amount that customer pay), Shopify will have transaction fee. Additionally, the payment gateway service, like Paypal / BrainTree / Stripe / PayDollar, they will also have transaction fee.
Shopify Expert development fee
- This is different from the consultant fee. This cost is for the Shopify Expert help you develop the E-Store in the way you wish to. From theme styling to functional integration. The cost and the included services can be quite different among different type of Shopify Experts.

Start from simple, plan for longterm maintenance, evolute gradually as progressive enhancement

Shopify provides you the fundamental function for you to run a E-Commerce business. You need not worry about most technical concern. But it does have several factor that lack of flexibility or feasibility. Say:

It allows:
- You can manage Product / Collection / Page / Blog setup with its decent admin panel
- You can manage theme / possible to customise / switch from one to another them
- You can integrate with well known online payment gateway
- no effort on having your site’s media asset like images / files be delivered with the well-known Content Delivery Network (a.k.a CDN) to fasten the site loading
- Fundamental reporting allow you know how many sale / discounted amount / return amount reports
It is weak or no support on some factors:
- You cannot change url pattern (if you very keen on SEO), you cannot imagine to have multilingual site with different context path like {domain}/en/… for English, {domain}/tc for Traditional Chinese
- You may have low grade on some online SEO report saying there are many inline CSS/JS for which are Shopify needed scripting that you cannot remove
- You cannot change your checkout flow (unless joining the Shopify Plus! plan)
- You cannot expect your site can run very well in China region as Shopify is a foreign country where their servers located beyond China boundary.

(To be continue)

Mamedio Swimwear

This should be the most sexy project I get involved. A Brazil brand swimwear Shopify store is just launched:

It has various style for both Bikini and One Piece. And the site owner pays much effort on showing you how good fit their products are with modal wearing their products and having attractive shot from different perspectives:

The story of Mamedio is just begins, apart from assisting the store for initial launch (both Internation and Brasil site), I am going to strength the site by further enhancing the SEO aspect, and facilitate the site owner to manage their stores easier.