Saturday, November 30, 2013

OAuth for dummies - Illustrating OAuth for User Joe

Disclaimer, this is not a training dot, but it's my attempt to understand OAuth in Plain English or with visual aids. Any suggestions are welcome. See this as published personal notes.

Thoughtworks gave an awesome overview:
 "OAuth is an open-source specification for building a framework for allowing a third-party app (the “client”) to access protected resources from another application (the “provider,” or “resource owner”) at the request of a “user” of the client app. Oauth allows the user to enter his user credentials (ex. username and password) only to the provider app, which then grants the client app permission to view the protected resources on behalf of the user."

There are a few "players" here.
The third-party app: say a newly launched startup app in beta, Facebook for dating F-Book
The user: you, an aspiring bachelor with a dream
The provider: Facebook, which has your profile, and friend list

When you want to log onto F-Book for the first time, you don't want to give an untested app all your favorite password. You saw the option to use Facebook login instead.

You choose that. A familiar blue popup shows up and ask for your Facebook username and password. Hooray, you do this everyday.

Click login. The popup disappears, you are directed to F-Book, which now has your profile picture, your friend list (tells you which friends already joined), and you can now start to use F-Book! Voila.

Actually there was another step after you used Facebook credentials to sign in: Facebook asks you are you sure you want to grant profile and friend list access to F-Book. You say okay or skip. If you skip, you likely will get a 404 from F-Book (oops, something went wrong). If you grant, then Facebook secretly sends a token over to F-Book and was like okay F-Book, you can now communicate with me. Remember to send over this token, when you want to retrieve information about this particular user. Remember to send over your app API token too, because I want to know you are F-Book for reals, not knockoff-FBook.

Now F-Book can use APIs like getUserProfilePic() getUserFriendList(), Facebook pukes out a JSON, everyone's happy.

Of course, this isn't quite how it works but you get the idea. I have grossly admitted important details about security and how secret and public keys work. I wrote this post because every time someone asks me about OAuth, my initial thought is always that I know nothing. But the reality is, since it has been popularly adopted all over the place, I have seen many manifestations of OAuth: Twitter, Facebook logins, Google Plus logins, GitHub (SSH secret keys), Yahoo YQL, Google Map.

Stripe on Shopify - First Try on Small Business Saturday

This blog post documents my very first try with Stripe on Shopify. I haven't read any tutorials or docs (my expectations is that the integration should be easy, given Stripe's reputation for easy install, as well as Shopify's reputation for easy install and integration). Here we go. 

Start time 10:42am
1. Log onto my ecommerce admin page on 
- - - I installed my own domain, so it will be
2. Select "Setting" on the left nav, that's my guess
3. Select "Checkout", though I was looking for "Payments"
4. Don't know what to select yet, saw PayPal jumped out right away, also saw Shopify payments. Scroll down, saw lots of texts, wow, ready to Control F find "stripe", then I noticed this 10:43 am

5. The moment of shock hits me. I have been using it without even knowing it!!!! Omg 10:45 a.m
6. Click on edit, two columns of options ajax into my view, I see my rate right away, and a link to lower it, I saw all the payment options that I need to set. And even a test-mode! If you are a developer, you test the sh*t out of everything, especially if you are a good developer. 

So rewind, a few months ago, I distinctly remember receiving a delightful Shopify email saying now I can send money directly to my bank without having to use PayPal Checkout. I signed up right away of course. The rate was also very favorable, because Shopify used to charge a fee, then PayPal, and one thing people always forget about PayPal is a huge cost of withdrawing your money and there are a lot of limits. I know from my ebay store that PayPal withdraw and verification (though personally my account has NEVER ever being frozen, I heard many accounts that have been at crucial times). As the time of this post, I saw some improvements. Overall, there are a lot of rules. I only use my PayPal account to pay for services that I use, as paying out money is easier than collecting. 

When Shopify Payment appeared, I signed up right away, the process took less than 5 minutes, and it was so short, I remembered everything! I couldn't find the announcement email but actually I found out that I was accepting payments, before I even finished signing up.

It's surprising that I still remember how I signed up the first time: a thought in the back of my head, oh this is like setting up the paycheck. You grab your checking account check, enter the bank number, then your account number yada yada yada... 

The funniest part is that I never left shopify to do this. This was just like a Shopify feature, a very well integrated feature too, newsletter -> click -> enter info -> enter check info -> first payment

My actual Stripe account was set up last month when an entrepreneur business founder who doesn't code asked me about prototyping with Stripe. I used the 4242 4242 4242 4242 (the famous Stripe test card VISA!). I intended to test the account, so I didn't even need to enter any sensitive info, it was test-ready. None of my Shopify info spilled over! Stripe to me was a new service. I totally credited Shopify Payments with the other feature. As a ecommerce platform, I am sure that Shopify was very happy. As a user, apparently I was very happy too. It was a pleasant signing up experience, I actually remember! 

A great design is transparent, is invisible. It contributes to a seamless User Experience.

It just took me longer to write a blog post than integrating Stripe with an existing service. I will explore Stripe under the hood soon. 

Another experiment that I did this morning is also note worthy: see on existing users include Karma (portable WIFI device with a social twist) uses stripe. Immediately logged into my account, and paid to add data, hoping to see stripe in action. Nope, not a hint. If Stripe is really integrated, that's some seriously beautiful seamless integration.

Sunday, November 17, 2013

Geek Talk for N00bs

n00bs or newbies are known as l33t speak, or leet, used to be a cool code speak to prevent easy parsing / deciphering

for those newer to the coding land, here are some geek talks

    • pound sign is now known as a hash
    • this vertical line is a pipe
    • ||
      • double pipe, means or
  • &
    • ampersand, just ampersand
    • &&
      • double ampersand, means and
  • !
    • a bang, or a not !human refers to not human, maybe you are a zombie or a robot
  • control flow
    • like an if else statement
    • switch, like a case
  • Predicate
    • if (predicate)
    • Predicate refers to the in parenthesis conditions of if else statements
  • This is a living document, it will be updated

Saturday, November 16, 2013

Basic JSON Format | JSON for Dummies

The basic JSON building block is a data attribute and value pair. It's a way to track data records in JavaScript.
{"attribute" : "value"}
e.g. {"name":"dilys"}

Every two building blocks are separated with a comma.
{"first name":"John","last name":"Doe"}

We can format the JSON better by displaying it hierarchically
"first name":"John",
"last name":"Doe"

To check if your JSON is correct you can use JSONLint auto checking

To see more complex examples of JSON and also compounded, nested JSON objects

JSON is more useful than ever because most APIs like Google Map can provide data in JSON format. Key-value data stores used in nosql is also similar: a key value pair. There are subtle and important differences. Since this is an intro blog, I won't go into details. Consider this a JSON cheat sheet. 

[Updated] JSONLint is especially helpful when we can easily confuse JSON notation with key-value stores, i.e. missing double quotes. Just caught a data analysis book messing up JSON format slight today.

Wednesday, November 13, 2013

Codes : Python control flow looping through dates and months

While practicing data analysis, I came across a small piece of algorithm. I don't usually use Python, but for data analysis, it is preferred, so this part is iterated in Python.

This post is not for teaching, it's just to showcase my thought process, and for my future preference. It's a writing practice too. It is meant to be updated in the future when better solutions become available.

The prompt is to iterate over all the dates in 2009 and the months. Python has some built in functions per StackOverflow

What if we are building it from scratch, how would you use control flow to iterate through, just the simple and crisp way.

How would you solve it? How do you get the console to automatically print out each month and date of 2009 without giving any month extra days. For example Feb can never have 31st.


It's a great control flow mini example because not all months are created equal.

  • February is unique, in 2009, it only has 28 days
  • For months equal to or below 7, odd months have 31 days, and even months have 30 days
  • For months greater than 7, odd months have 30 days, and even months have 31 days (so it's reversed)
So there are 5 cohorts / cases. But the terrible thing is that there are 5 check points for each of the months.

for x in range (1,13):
 print x
 if (x == 2):
  print "x equals to 2"
 elif (x <= 7 and x%2 == 0):
  print "x smaller than or equal to 7 and x is even"
 elif (x <= 7 and x%2 != 0):
  print "x smaller than or equal to 7 and x is odd"
 elif (x > 7 and x%2 == 0):
  print "x is greater than 7 and x is even"   
  print "x is greater than 7 and x is odd" 

Another Pythonist used some predefined scenarios instead of checking each:

for m in range(1,3):
 for d in range(1,32):
  if (m==2 and d > 28):
  elif(m in [4,6,9,11] and d > 30):

  timestamp = '2009' + str(m) + str(d)
  print timestamp

Now this is really a different way to solve it: one must iterate through the months then dates, finally cleverly break out of the dates when certain condition is met. But it's in certain sense more elegant, because the exceptions are clearer: m==2 and 4, 6, 9, 11. Versus the previous case, there were 5 cohorts, and you have to constantly think about which cohort to fall into, also more rooms for typos on > or < signs.

See more examples on Python control flow

The stackflow examples are better in many senses too, but seeing a date problem as a simple control flow example has its merits.

When I asked college friend Roger, he also used the datetime module. Except his answer is super crispy, I like it a lot! So I am sharing it here:

import datetime

startDate = 2009, 1, 1 )
endDate = 2010, 1, 1 )
dayDelta = datetime.timedelta( days=1 )

while startDate < endDate:
   print startDate
   startDate += dayDelta

Monday, November 11, 2013

The Surprising Sophistication of Corgi

I was supposed to practice my prototyping and wireframing skills and this happened ...

I really loved the cover: The Surprising Sophistication of Twitter

Then I thought about one famous business corgi


Then I couldn't resist, so I made my very own Sophisticated Corgi

Yeah, that shit is cute. Very cute.

All jokes aside, I think there's some really good lessons learnt from the article, so I will blog about it soon.

Sunday, November 10, 2013

Teach Your Kids How to Code | Book Recommendations for Young Adults

Disclaimer: this post is obviously laced with beloved not Amazon referral links. Use at your own... nah, all it means is that you are contributing about a few cents to CodeSumBlog yay for sustainable blogging.

Disclaimer 2: adults, don't be discouraged by the titles. I think the books recommended below are perfect for adults too. A much better alternative to dummy books on programming.

Time sensitive discount code: tech book publishing mogul O'reilly has a limited time discount for programming books or tech books for kids WKCODEKID
This deal expires November 14, 2013 at 5:00am PT and cannot be combined with other offers. Offer does not apply to or "Print & Ebook" bundle pricing.

I am a firm believer of alternative educations, because it just works for a lot of kids (and mainstream education too! I don't believe MOOC > school. I loved all my schools). Honestly, taking your young kids to watch Ender's Game or the Universal Studio's special effects show to see how minions come to life via CG and just how every movie and TV is green screen enabled ... probably works the magic! Hint hint, most of my Stanford friends who are superb engineers and founders have parents who already know engineering (and was taught math early on). Yup, get to it fast, if you are a happy fluffy person like me. My kids are definitely hanging out with engineers early on. Mark Zuckerberg said at 2013 Startup School, mostly he just built things when he was young (you know those garage fun times with daddies? working the toolbox? Now it's working on Ender's desk). By the time he quit Harvard, he already built multiple applications with thousands of users.

If you haven't already, allow your kids to try, whose users can range all ages and countries. It's gamified.  Get them to think about Minecraft but not just playing, but building plugins. Please don't make them read dummy books. Kids are very smart and capable to learn (hello the whole point of Ender's Game), let them learn from legit real books.

I recommend the No Starch Press (to support this blog you can purchase from this amazon referral). No Starch Press is closely tied with O'Reilly (all mighty Wikipedia talks about O'Reilly Media distributes and promotes No Starch Press titles in the U.S., and No Starch uses various distributors worldwide.)

In fact No Starch Press talks about Wikipedia, building with Legos and also

  • Linux
  • Command line
  • Internet protocols
  • HTML CSS JavaScript
  • Full stack
  • Photoshop
  • R (for data analysis, statistics and social science researches in general)
    • yes as an neotany economists (with only Bachelor of Arts), I can safely say, no future social science will be safely exempted from knowing how to conduct research and analyze the research
    • yup Economics + math, political science + math, journalism + math, law + math
When I first visited Cornell, they say I must have played Legos to be a sound engineer in the future. Now I think one needs to know how to program to succeed in all disciplines. Modern academic skills are : reading, writing, public speaking, searching (as in Google), programming, data analysis.

Dear parents, please start early. Kids are so capable of learning languages (natural, foreign and programming languages), do them a favor get them started early so they don't have to start late like me : ) cheers. And it's okay if you don't know how to program. Kids will figure it out. You don't know how to play Minecraft either. But you probably *read* Ender's Game so do something.

Sheryl Sandberg also recently said on Quora, breaking the gender imbalance early is an important step to get girls code more. Since many of us agree that programming is an important skills. Let's make sure girls have it early and solid.

Inspiring female coders early: YouNoodle showcasing amazing women's initiatives in the bay area hackbrightacademy Women Who Code Women 2.0 as female founder resources. In my opinion, these are some of the most important initiatives and community efforts, especially Women Who Code which is completely open to all for attendance. Featured video

Consumer Brand Predictions

Somewhere along the way, I found myself to be pretty good with Brand predictions. I really understand how consumer brands work, especially how affordable "luxurious" consumer brands can emerge: Starbucks (not Peet's), Jawbone, Mac, ... also software like Skype, Evernote ... Even RockMelt (when I did their user research, I was able to make some key observations on their strategies and tactics, then they got bought)

I'd like to discuss some of the brands here. Introduce them one by one week by week, and see how they perform in the future.

We should also consider predictions brain exercises. Scientists have proven that we perform no better than chimps when it comes to predicting stock. When the choices are so limited (binary: popular or not, Obama or Hillary or McCain), buy/sell/hold, no matter how informed our answers are, they just have such a good chance of being wrong. We are limited by the choices and also the models and tools we have.

I enjoy making product discoveries of physical products (that's why i own an online store and also web products (that's why i write a blog).

Twitter and eCommerce, Social Media and small business eCommerce
When I become a small retail business owner, my perception of Social Media completely changed. It became a marketing tool for small retail "hackers". SEO is all very great if you can land on the first page of search engine results. SEO is helpful if people actually know how to look you up (sorry as fancy as Google is, for small retailers, it is like a big Yellow Page booklet). Every clever Social Media post can become a small jolt to traffic. It is more of a guerrilla warfare than game changing advantage. Social Media is great for "spasm" shares, so we cannot expect the life time of each message to be long, unless you are a super star already (that's just selection bias). For all I am concerned, just having effective call-to-action templates that you can cycle through for small retailers will improve your website traffic quite a bit. And the more frequently (not the more quantity) you introduce your product, usage, product in action, the better result you can get.

Note, I am not talking about advertising via Twitter / Facebook / Pinterest / ... for small business owners, you best bet is user generated sincere contents, but frequent contents too. It will take a while to see results, but a $300 per week impression payment via Facebook advertising may just be too much for any small business budget. Small business owners are actually cheap, we have to be, our margin is already low.

[Updated on Nov 11] I love updating my posts. Info changes all the time. New info just become available. Here's an opinion from Growth Hacking site by Michael Ugino on why small business should avoid burning budget on advertisement even if it is on Social Media, and instead should focus on generating a critical mass of CONTENT. A rule of thumb is to have 1000/week unique visits before considering Return On Investment ROI of advertising with hefty amounts.

NativeUnion Monocle Headphones

NativeUnion made some debut in SoCal (seen most often in actual stores near Los Angeles, not so much San Francisco) with its Pop handheld, wired retro phone designs with vibrant colors. That was a good start. Then it reinvented the product and made it into a "Monocle", just the label itself is classy, hipster and artsy.

I use it to make calls, hang it around my neck or messenger bag for easy access, and easily switch between speaker mode (say I want to share Youtube videos with friends) and headphone mode (say I don't want to disturb others on my commute). The tangle free cord (literally cord, not like headphone cord) design is great (Dr. Dre's flat ribbon design was great, but the headphones broke super fast during my business travels. Can't last, hence not worth the price tag).

  • I loved the hip fashionable design
  • flat design intuitive manual
  • vibrant colors but also have solid black and metallic design options
  • cord-design wires
  • smart little hooks that adjust the length
  • It's not an easy product to find on amazon, ebay or a retailer hub ... yet
  • And yeah, I can pretend I am a DJ and dance to my monocle, that's pretty cool
  • Since DJs hold the headphones any way (as opposed to wearing), why not just make it a monocle duh, smart designs are sometimes too obvious and harsh when the status quo is broken
  • I can't imagine how cool the chaining option is
Re-novating a classical old design, a vintage old entrenched design is the hardest. Since the NativeUnion had breakthroughs multiple times, I think it will do very well. Just like when Jawbone first started.

A great product design that isn't obvious is the customer support and post-sales designs. NativeUnion allows you to register your product and interact with their well design website. The brand experience is very very obvious. When I check out the brand name again upon buying monocle, I immediately remembered my POP phone (my Asian parent is using it to reduce phone radiation effects in China. A great product for busy business people), and wonder if I can register my Monocle too. It's pretty hard for me to remember my previous purchase by the same brand given how many distractions there are in the world right now. Kudos for creating that brand consistency for physical products (very difficult).
POP Phones

On Monocles, this New Yorker cover on is pretty clever and epic.
The Surprising Sophistication of Twitter

React UI, UI UX, Reactstrap React Bootstrap

React UI MATERIAL  Install yarn add @material-ui/icons Reactstrap FORMS. Controlled Forms. Uncontrolled Forms.  Columns, grid