What’s The Best Way to Learn New Framework?

By doing.

As simple as that.

For example, I don’t know the difference between Bootstrap 3 and 4.

So I created a project based on Bootstrap 4.

A simple dictionary website for people to find meaning of a word.

Super simple, right?

Basically it’s a place for people to search for meaning of a word in Malay.

To make it better, I also use Google Translate API to grab meaning in English and insert it into the DB. So it doesn’t have to query Google Translate all the time. It only query it one time and then I insert it into the DB.

The second time people visit the same page, the page won’t call Google Translate API again. Just have to query the database. I use MySQL for this project.

I originally use Vue with Axios for this website. Vue is after all the hottest thing right now. I first used it in one of the take-home coding interview and it seems quite interesting to use.

But the moment I saw the website in Google Index, it seems that Google doesn’t really crawl all the links inside.

So I turned back to using vanilla HTML website again.

I need to figure out a way how to make a Google-friendly Javascript-based website before I use Vue again.

At the website I also implemented a simple search suggestion using Bootstrap Typeahead so people can know what’s in the database before they click Cari.

As you can see, there are a lot of things that I am doing on the website under the hood. It’s pretty simple website, sure. But it means that I can learn how to use Bootstrap 4, Vue and Axios.

That’s how we can learn how to use a new programming framework — by using it. Every framework is a little bit different and the best way to learn about it is to implement it yourself.

So have a look at Makna Perkataan and tell me what you think!

My Silliest Mistake So Far (Maybe?)

My boss asked me to create a survey form for people to fill in and we can know how students feel and what kind of improvements that can be done in the university.

So I literally did that.

I created a form, a database, the script and all… just to create a survey form.

A waste of time.

There are a lot of system out there that are better than what I attempted to do. They already went through trials and errors and have improvised based on suggestions by their users.

I should have surveyed the market first through and through.

When there are so many survey tools out there. And there’s even an open source tool to do survey.

I can use Google Forms, or Survey Monkey and I achieve the same thing.

This is what I’ve created.

I use Metronic Admin Template to create this. And for the code, I use PHP.

Always survey and see what the market has. Or else you probably will miss what others have made that can make your life easier.

Thinking About Microservices Architecture

In the past 2 weeks I was so busy with many things. Had an interview with a well known media company. It was the longest interview process that I ever had.  and I was busy finishing a system I’m developing and collecting data for the green system here.

Right now, at AiU, I have to think a lot about how to implement IoT solution. How the overall of the architecture looks like.

And I chose microservice architecture.

From microservices.io:

Microservices – also known as the microservice architecture – is an architectural style that structures an application as a collection of loosely coupled services, which implement business capabilities. The microservice architecture enables the continuous delivery/deployment of large, complex applications. It also enables an organization to evolve its technology stack.

Why do I choose microservices architecture?

At AIU, I won’t be connecting just one type of device (the switch), but I’ll be connecting with the door and the solar, the battery and the grid.

I don’t like a single point of failure even though using just one system may make the system easier to make.

Another challenge that I have is that all these devices “speak” different languages. One is Java, another is C++ and another… Microsoft Access.

Since I have to connect to multiple types of devices with multiple languages at the same time, I doubt that a monolithic architecture is a good way to integrate all these devices.

From Wikipedia, monolithic applications are:

In software engineering, a monolithic application describes a single-tiered software application in which the user interface and data access code are combined into a single program from a single platform.

Drawbacks of Microservices Architecture

  1. To debug is quite hard. You have to write all the loggings for all the different services and it may have different languages
  2. Consumes more time to develop than a monolithic one. Each type of devices has its own so-called “controllers”. Instead of one big one that manages everything.

Pros of Microservices Architecture

  1. Easier to add new functions. If I wanted to add new function to the smart switch like scheduling, I just whip open the smart switch controller’s project, I can add that function.
  2. Know exactly what’s going on – instead of guessing, I know which device caused problem. Can’t get the data from solar panel, OK it’s autoswitch controller’s problem. I can debug from there.

Microservices is not a silver bullet to me. It’s just that I felt that using this architecture is the best for this situation of mine.

What I Learned Today While Making IOS Apps?

So today I learned how to use Page View Controller. It’s kinda different than making app for Android. You know, to make a pager kind of style.

Right now I am googling more and more about it. Right now, more often than not, I am trying to find if there is any similarities between using Java and Swift.

There are obviously some kind of similarities but there are a lot of differences.

Both are object oriented. (If my memory serves me correctly), but the important thing is: there’s no semicolon to end a statement! Hurray!

I also learned to play around with Cocoa Pods. How to install it. Just managed to get Google Maps SDK for IOS. Let’s play with Google Maps after this.

Today is Swift Day

At least for me. Today I am playing around with making iOS app. Making an app for IOS is a bit different than making for Android.

For starter, to develop a native app in Android, you would be using Java or Kotlin.

To make apps for IOS, you have to use either Objective-C or Swift.

The layout is also different. There is “Auto Layout” feature in XCode, but in Android you have more flexibility on how you want to achieve your desired layout.

Sometimes constraint is good too: you have to be creative with what you have. Hence you see the simplicity of IOS apps but it felt premium.

How to Create Web Service In Less Amount Of Time?

I want to talk to you about the stupid thing I do. How to avoid it.

I always create a HTML form to test all kinds of JSON response for the web service.

It’s easy, but it’s redundant.

I don’t need to do that every time.

Actually I can just use this: Advanced REST Client.

It is a Chrome app which you can download it into your browser.

So now, you can test your JSON response or you can test if you properly set your variable name and got the response you want.

You don’t need to recreate a form every time you want to test whether you named your variables properly or not.

Download it, use it. Maybe in the future I will create a tutorial based on that.

How to Install Laravel on Windows

Most tutorials on the Internet are using Linux/Ubuntu. However, in this post I will show you how to install the latest Laravel  on Windows. I will be using Microsoft Windows 8.1 and WAMP. I’m using Laravel 4.2 for this tutorial. But you don’t have to worry as long as it’s version 4 and above, you can use this tutorial.

Let’s begin.

1. Install WAMP first.

There are several things that you need to make sure in order to run Laravel successfuly.

– You have to make sure it’s PHP 5.3.7 or higher

To make sure of this, use the latest version available at WAMP Server website.

– mCrypt module enabled

mCrypt module comes enabled at default so you don’t have to worry about this.

2. Enable OpenSSL in PHP.ini

Update for Laravel 5.4.

Laravel version 5.4 require these:

PHP >= 5.6.4
OpenSSL PHP Extension
PDO PHP Extension
Mbstring PHP Extension
Tokenizer PHP Extension
XML PHP Extension

After you installed WAMP, you need to do this. This is how you make sure OpenSSL is enabled:

On your right hand side of your taskbar, click WAMP and then choose PHP.ini.

And then find php_openssl, and then remove the semicolon in front of php_openssl.

And then, save. Close that file and now go to wamp manager again, and now enable OpenSSL there just to be safe.

After you do that, restart Wamp.

3. Install Composer

Go to https://getcomposer.org/ and download Windows installer.

The setup will ask for your PHP. if you install your WAMP in default setting, it will usually end up in C:\wamp\bin\php\php5.4.12.

If your installation is successful, by running composer on command prompt, you will see all kinds of info just by running that command.

If you can see it, that means your Composer installation is complete. Let’s move to the next one.

4. Make sure that your htppd.conf includes httpd-vhosts.conf

Now let’s make sure that your htppd.conf also includes httpd-vhosts.conf. This is beneficial if you want to make a pretty URL just like this one:

Instead of writing up localhost/mylaravel, it would be “nicer” to have that pretty URL, right?

Anyway, let’s go on.

Go to C:\wamp\bin\apache\Apache2.4.4\conf and then open up httpd.conf.

After that, search for httpd-vhosts.conf and make sure that there is no ‘#’ (pound sign) in front of it. Save. After that restart Wamp just to be safe.

Now let’s begin the fun part: installing Laravel.

5. Install Laravel in specified folder

You usually want to install your Laravel in your www folder. (Obviously!)

So open up your command prompt, and then change directory to your WWW folder inside your wamp. For me it will be: C:\wamp\www

To change directory, just type cd c:\wamp\www

Basically you are changing folder to your www folder.

And then, you can install Laravel. Just use this in your command prompt:

composer create-project laravel/laravel your-project-name –prefer-dist

And then hit enter.

Just wait a while until it is finished downloading and installing.


Wait until… everything finished.

6. Create Virtual Host

Now let’s create your pretty URL. You have to go to C:\wamp\bin\apache\Apache2.4.4\conf\extra and then open up httpd-vhosts.conf.

After that, you just need to paste the following and change your laravel folder to appropriate ones.

<VirtualHost *:80>
DocumentRoot “c:/wamp/www/mylaravel/public”
ServerName laravel.dev

In my case, I used mylaravel for my laravel installation. You have to change it to something else. For server name, you can change it to whatever you want. In my case, I am using laravel.dev. (You don’t want to use google.com because if you do, you won’t be able to open up Google).

Obviously, you have to save and then restart your WAMP again.

7. Update Windows Hosts file

After you have changed your virtual host, you need to change your host file.

Go to C:\Windows\System32\drivers\etc and copy hosts and paste it on your Desktop. And click on the host file you have pasted on your Desktop. Open that up using Notepad.

Put this in that host file: laravel.dev

Change laravel.dev into what you already decided in your virtual host file. For me, mine will be laravel.dev.

Copy the one that you modified just now and put it back into your C:\Windows\System32\drivers\etc folder.

You’re done!

That’s it! That’s the way you can install Laravel and have a pretty sexy URL together. If you have any questions, please send your questions in the comment form below and I will try as best to answer your question.


Coding Days

Today I’m not going to talk about marketing. I talked a lot about it in this blog. Today I’m remiscing of the old days… of the system that I have built in the university. You can see it in its full glory below.

Sometimes when you go through your own stuffs, you realized that you have created a lot. Sometimes it’s mediocre, sometimes it’s good and sometimes it’s awesome.

Whatever you are in the past, you should try to be better in the future so that you can be proud of yourself and say, “I did this“. Be thankful that you are still alive today and possible for you to still do good job in whatever career you have chosen for yourself.