jQuery : Make Ajax Call PHP Script with JSON Return

User experience plays a vital role in excellent web design. AJAX allows you to run server-side validations, form submission, data retrieval, and other server-side stuff in the background (asynchronously) without interfering with the existing page where the request was made. It's a beautiful thing, but best of all it's not very difficult to do.

JSON its self is JavaScript Object Notation and a lightweight data-interchange format.Beside that JSON generate text-based open standard that readable for human. In this time, we'll try using JSON for data transfers and JQuery library for the tool and make AJAX connection.

Assume that we have structure file as below :

So let's move on to the script.

1. html

    
    
    


    

        


                
Nama
                
:
                

            

                
Alamat
                
:
                

            

                
 
                

                

            


Atribut yang sudah terset adalah : 

MySQL : Join Query

Cause lot of task in the office lately so I haven't had as much time to post any note, so here I would like to make a note about Join Query in MySQL.

The JOIN keyword is used in an SQL statement to query data from two or more tables, based on a relationship between certain columns in these tables. Tables in a database are often related to each other with keys. So we can get data easier to read as what we want.

Assume that we have table and we'll try to make a relation, we make a simple table which have structure as below :

Table user:

CREATE TABLE `user` (
`id_user` int(11) NOT NULL auto_increment,
`name` varchar(20) NOT NULL,
PRIMARY KEY  (`id_user`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;

Table user_description :

CREATE TABLE `user_description` (
`id_user` int(11) NOT NULL,
`address` varchar(50) NOT NULL,
`telephone` varchar(15) NOT NULL
) ENGINE=MyISAM DEFAULT CHARSET=latin1;

Data :

INSERT INTO `user` (`id_user`, `name`) VALUES
(1, 'anto purwanto'),
(2, 'johnny'),
(3, 'kartikarina');
INSERT INTO `user_description` (`id_user`, `address`, `telephone`) VALUES
(1, 'cimahi', '082550435544'),
(2, 'cibiru', '022 7823413'),
(4, 'tubagus ismail', '022 66224325');

Bola Karet dan Bola Kaca Kehidupan

Hidup ini seperti pemain circus yang harus memutar sejumlah bola di udara, hanya saja sebagian dari bola-bola itu adalah bola karet dan sebagian yang lain adalah bola kaca. Bola-bola dari karet boleh saja dikorbankan untuk jatuh bila dipandang perlu, karena dia akan memantul dengan sendirinya dan dapat diambil kembali saat dibutuhkan. Bola-bola dari kaca tidak boleh jatuh sama sekali – karena sekali jatuh dia hancur, jadi dia harus selalu tertangkap tangan dan tidak boleh dikorbankan. Memahami mana yang bola karet dan mana yang bola kaca akan menentukan apa yang menjadi prioritas hidup kita.

Misalkan, kita sendiri adalah pemain circus itu dan kita bermain dengan lima bola,  sebut saja : pekerjaan, keluarga, pertemanan, kesehatan, keimanan. Mana diantara lima ‘bola’ ini yang bola karet dan mana yang ‘bola’ kaca bagi Anda ?. Setiap orang akan memiliki pilihannya sendiri.

Idealnya adalah kita perlakukan semuanya sebagai ‘bola kaca’ sehingga tidak ada satupun yang boleh jatuh. ‘Pemain circus’ yang pinter mungkin saja bisa melakukan ini, tetapi kebanyakan orang suatu saat akan terpaksa membiarkan salah satunya jatuh. Bila ini yang harus dilakukan, maka hanya bola karet-lah yang boleh jatuh.

CSS : Vertical Centering Menu

Vertical centering has always been a fairly elusive goal when doing CSS layouts, but it’s still possible. Here, we'll make a simple center list menu where each list have centering orientation.

Then it's the preview of menu that would be made :

Firstly, we make html file :

menu 1
menu 2
menu 3
menu 4
menu 5
menu 6

After that, let's move out to make style :

body{
 font-size: 12px;
}
.menu{
 border: solid thin #f00;
 margin-top: 45px;
}
.wrapper{
 width: 960px;
 margin: auto;
}

ul#menu {
    text-align: center;
    height: 140px;
    display: table-cell;               /* make unorder list to be table-cell */
    margin: auto !important;
    width: 960px;
    background:  #8fcdea;
    margin: 0px;
    padding: 0px;
    vertical-align: middle;
}
#menu ul {
    display: table;
    margin: 0 auto;
}
#menu li {
    display: inline-block;            /* make list to inline-block */
    position: relative;
    width: auto;
}
#menu li li {
    display: block;
}
#menu ul {
    display: inline-block;
}
#menu li {
    display: inline;
}
#menu a {
    display: inline-block;
    border: solid thin #f00;
    height: 60px;
    display: table-cell;
    vertical-align: middle;    /* set list vertical align : middle */
}
#menu li:hover ul {
    left: 0;
    top: 1.3em;
}
#menu li {
    display: inline;
    margin-left: 0 !important;
    position: relative;
    width: auto;
}
#menu a {
    color: #000000;
    line-height: 1.6;
    padding: 0 2.5em;
    width: 6em;
    text-decoration: none;
}
#menu li li, #menu li li a {
    display: block;
    height: 1.5em;
}
#menu li li a {
    padding: 0;
    width: auto;
}
#menu li:hover ul {
    left: 0;
    top: 1.5em;
}

Note :

The simple way if you want to center certain content vertically :

.container {
   min-height: 10em;  /* set your own height */
   display: table-cell;
   vertical-align: middle;
}

Done !

GIT : Make Local Metadata Repository

When you want to develop your application efficiently with your team work. Git is the best way and it brings plenty of advantageous when build your application. Here, we would make local repository and use some command git that would be used frequently for your further or other project.

Repository contains metadata file that have complete history and full revision about everything that happen to your git working directory. Metadata can reduce the size in the repository. the metadata ussualy like the following:

Let's move out and configure in Terminal :

1. Make a repository

server@server-comp:~$ cd ~/repository
server@server-comp:~/repository$ mkdir contoh   // create dir as contoh
server@server-comp:~/repository$ cd contoh      // enter contoh directory
server@server-comp:~/repository/contoh$ ls -al  // view content in directory
total 8
drwxrwxr-x  2 server server 4096 Nov 20 11:24 .
drwxrwxrwx 36 server server 4096 Nov 20 11:24 ..
server@server-comp:~/repository/contoh$ git init   // initialize as git repo
Initialized empty Git repository in /home/server/repository/contoh/.git/
server@server-comp:~/repository/contoh$ ls -al
total 12
drwxrwxr-x  3 server server 4096 Nov 20 11:25 .
drwxrwxrwx 36 server server 4096 Nov 20 11:24 ..
drwxrwxr-x  7 server server 4096 Nov 20 11:25 .git
server@server-comp:~/repository/contoh$ vim contoh.txt  // create first file, fill with anything and save
server@server-comp:~/repository/contoh$ ls -al
total 16
drwxrwxr-x  3 server server 4096 Nov 20 11:25 .
drwxrwxrwx 36 server server 4096 Nov 20 11:24 ..
-rw-rw-r--  1 server server   20 Nov 20 11:25 contoh.txt
drwxrwxr-x  7 server server 4096 Nov 20 11:25 .git
server@server-comp:~/repository/contoh$ git add contoh.txt // add file(s) in directory
server@server-comp:~/repository/contoh$ git commit -m "bikin contoh.txt" -a // make a commit
[master (root-commit) 5852652] bikin contoh.txt
 1 file changed, 1 insertion(+)
 create mode 100644 contoh.txt

If you do it correctly, there must be a .git file. Then we move .git out into other folder that represent contoh repository , for example, contoh.git.

Zend Framework 2 : Use Composer & Packagist PHP

Introduction

Composer is a tool for depedency management in PHP. It allows you to declare the dependent libraries in your project needs and it will install them in your project.

Composer is not a package manager but composer manages them (packages or libary) on a per-project basis, installing them in a directory (e.g vendor) inside your project. By default it will never install anything globally. thus , it's a dependency manager.

The problem that composer can solve are :

a) You have a project that depends on a number of libraries.
b) Some of those libraries depend on other libraries.
c) You declare the things you depend on.
d) Composer finds out which versions of which packages need to be installed, and installs them (meaning it download them into your project like apt-get command in ubuntu).

Installation

First, you have to install curl on your pc by type command on your terminal :

 sudo apt-get install curl 

Then type command to get executetable composer.phar

 $ curl -s https://getcomposer.org/installer | php

This will just check a few PHP settings and then download composer.phar to your working directory. This file is the Composer binary. It is a PHAR (PHP archive), which is an archive format for PHP which can be run on the command line, amongst other things.

GIT : Introduction

GIT is an distributed modern version control system that designed to handle everything from small to very large projects with speed and efficiency. Git was designed and developed by Linus Torvalds for Linux kernel development. It has since been adopted by many other projects. Every Git working directory is a full-fledged repository with complete history and full revision tracking capabilities, not dependent on network access or a central server.

Version Control itself is a system that records changes to a file or set of files over time so that you can recall specific versions later. For examples, if you are a graphic or web designer and want to keep every version of an image or layout (which you would most certainly want to), a Version Control is a very wise thing to use. It allows you to revert files back to a previous state, revert the entire project back to a previous state, compare changes over time, see who last modified something that might be causing a problem, who introduced an issue and when, and sort of it.

So what git could do for us :

- Git could reverts files back to a previous state that you've made.
- Revert the entire project back to a previous state.
- Compare changes over time.
- See who last modified something that might be causing a problem.
- If you screw things up or lose file, you can easily recover that files.