Eat, Pray, Code

MEAN (MongoDB, Express, Angular, Node) Stack : Kick Start First Project Using Generator

7:48 PM

Hello everyone, I am going to share my experience in settting up MEAN stack project for the first time.

So firstly, before we go further, what is MEAN stack ? MEAN stands for Mongo DB, Express, Angular, and Node. It is combination of modern and light technologies. Mongo DB as NoSQL database provider, Express JS as a Node JS web application framework, Angular JS as HTML and UI framework and Node JS, a lightweight and efficient JavaScript runtime, as the foundation of our web application.

Let's start installing MEAN stack framework.
I am going to use framework called Generator Angular Fullstack.
What is that ? Generator Angular Fullstack is,

Yeoman generator for creating MEAN stack applications, using MongoDB, Express, AngularJS, and Node - lets you quickly set up a project following best practices.

Let's do M stuff from MEAN, which is installing Mongo DB.

Download MongoDB from this source. Choose your platform whether Windows, Linux, or OSX.
Do the installation,

for Windows user, please see https://docs.mongodb.org/v3.0/tutorial/install-mongodb-on-windows
for Linux Ubuntu user, please see https://www.digitalocean.com/community/tutorials/how-to-install-mongodb-on-ubuntu-14-04
for OSX user, please see https://docs.mongodb.org/v3.0/tutorial/install-mongodb-on-os-x

Run your MongoDB

Create the default /data/db directory, by typing below command in your terminal or command prompt,

mkdir -p /data/db

Run without specifying paths,

If your system PATH variable includes the location of the mongod binary and if you use the default data directory (i.e., /data/db), simply enter mongod at the system prompt:

mongod

Specify the path of the data directory,

If you do not use the default data directory (i.e., /data/db), specify the path to the data directory using the --dbpath option:

mongod --dbpath

Mongo DB is now running, and you can start making a connection

Next, continue installing Node JS.
Download the latest Node JS in this source.
Do the installation.
After installation is finished, check if the Node JS already installed by typing below command,

node -v

The output will be the version of Node JS for example v5.2.0.
Now, we begin downloading tools needed by Generator Angular Fullstack and Generator Angular Fullstack it self.
Installing yeoman, bower, grunt-cli, gulp-cli, Generator Angular Fullstack by typing the command below

npm install -g yo grunt-cli gulp-cli bower generator-angular-fullstack

-g flag on above command indicated that we want installed it globally.
After installation has completed, we can start using Generator Angular Fullstack.
We want to make a directory for our project so let's make a new directory, and cd into it :

mkdir my-new-project && cd $_

Run yo angular-fullstack, optionally passing an app name :

yo angular-fullstack [app-name]

Run grunt for building, grunt serve for preview, and grunt serve:dist for a preview of the built app.
Done, we are done installing Generator Angular Fullstack.
Now, before we run our project. Let's see the project structure below,

├── client
│   ├── app                 - All of our app specific components go in here
│   ├── assets              - Custom assets: fonts, images, etc…
│   ├── components          - Our reusable components, non-specific to to our app
│
├── e2e                     - Our protractor end to end tests
│
└── server
    ├── api                 - Our apps server api
    ├── auth                - For handling authentication with different auth strategies
    ├── components          - Our reusable or app-wide components
    ├── config              - Where we do the bulk of our apps configuration
    │   └── local.env.js    - Keep our environment variables out of source control
    │   └── environment     - Configuration specific to the node environment
    └── views               - Server rendered views

An example client component in client/app

main
├── main.js                 - Routes
├── main.controller.js      - Controller for our main route
├── main.controller.spec.js - Test
├── main.html               - View
└── main.less               - Styles

An example server component in server/api

thing
├── index.js                - Routes
├── thing.controller.js     - Controller for our `thing` endpoint
├── thing.model.js          - Database model
├── thing.socket.js         - Register socket events
└── thing.spec.js           - Test

Now, open server/config/environment/development.js in your favorite text editor.

'use strict';

// Development specific configuration
// ==================================
module.exports = {

  // MongoDB connection options
  mongo: {
    uri: 'mongodb://localhost/alphafullstack-dev'
  },

  // Seed database on startup
  seedDB: true

};

Look at mongo uri, it refers to our database in our currently running mongo. Don't worry I just want to let you know, you don't need to create the database with name of that. Once you run this project, it will automatically create a database with name of that.
Now, look at server/config/environment/index.js.

// Server port
port: process.env.PORT || 9000,

by default if we don't specify NODE_ENV to production, our app will use port 9000. So, let's try running our app by typing below command

grunt serve

and here it is what we got, our project is running.

Membuat Program JAVA : Penambahan Dua Angka dengan Digit Tak Terbatas (BigAdder)

9:22 PM

Dalam tulisan kali ini saya ingin mendokumentasikan jawaban dari praktikum mata kuliah Algoritma dan Pemrograman yang sudah saya alami di semester empat (sekarang saya semester 7). Selain mendokumentasikan saya juga ingin sekaligus berbagi tentang bagaimana membuat program yang benar untuk menyelesaikan masalah yang diberikan.

Dalam praktikum ini masalah atau problem yang diberikan adalah tentang bagaimana membuat sebuah program yang dapat menjumlahkan dua angka yang mempunyai digit tidak terbatas. Lebih jelasnya begini, saya punya angka pertama dengan nilai 12345678 dan angka kedua dengan nilai 12345. Kemudian kedua angka tersebut saya jumlahkan dan akan menghasilkan hasil. Jika kita lihat angka pertama mempunyai 8 digit angka dan angka kedua mempunyai 5 digit angka. Nah, yang menjadi fokus dari masalah ini adalah bagaimana kita bisa menjumlahkan angka yang mempunyai digit yang tidak terbatas. Untuk diketahui bahwa jika menjumlahkan angka dengan tipe data Integer maka hanya terbatas sampai 2^31-1. Sedangkan jika menggunakan tipe data Long maka akan terbatas sampai 263-1. Jadi dalam implementasinya nanti kita tidak bisa menggunakan tipe data integer maupun long dalam menjumlahkan kedua angka. Untuk dapat menyelesaikan masalah tersebut kita perlu menggunakan algoritma tersendiri yang dapat mengakomodasi penjumlahan angka dengan digit tak hingga. Lebih jelasnya, teori dari algoritma tersebut adalah seperti ini, “setiap penambahan 2 n-digit integer memerlukan n primitive operation dan hasilnya adalah n + 1 integer”.

Daripada bingung dengan teorinya lebih baik kita langsung saja mengimplementasikannya dengan kode. Berikut ini adalah kode program yang benar yang pernah saya buat.

File Bilangan.java

/**
*
* @author Yoga
*/
public class Bilangan {
private String number;
public Bilangan(){
this.setNilai(0);
}
public Bilangan(String nilai){
this.setNilai(nilai);
}
public Bilangan(int nilai){
this.setNilai(nilai);
}
private void setNilai(String nilai){
number = nilai;
}
private void setNilai(int nilai){
number = Integer.toString(nilai);
}
public String getNilai(){
return number;
}
public void Add(Bilangan bil){
int a, b, r, c=0;
String hasil="";
String bil1 = this.getNilai();
String bil2 = bil.getNilai();
int al = bil1.length();
int bl = bil2.length();
if(bil1.length() < bil2.length()){
for(int i=0;i<bl-al;i++){
bil1 = "0" + bil1;
}
}else if(bil1.length() > bil2.length()){
for(int j=0;j<al-bl;j++){
bil2 = "0" + bil2;
}
}
for(int i=Math.max(al, bl)-1;i>=0;i--){
a = Integer.parseInt(""+bil1.charAt(i));
b = Integer.parseInt(""+bil2.charAt(i));
r = (a + b + c)%10;
c = (a + b + c)/10;
hasil = r + hasil;
}
if(c>0){
hasil = Integer.toString(c)+hasil;
}
//int ab = Integer.parseInt(bil1.substring(9));
System.out.println(bil1+" + "+bil2);
System.out.println(hasil);
}
}

Biar ngga bingung, saya akan jelaskan maksud setiap baris dari source code di atas,
Kita mulai dari baris yang paling atas.

public class Bilangan {

}

kode diatas merupkan format penamaan kelas pada java, di sini nama kelas adalah Bilangan dengan modifier public

private String number;

atribut atau field atau variable yang menjadi komponen dari kelas. Disini nama variable adalah number dengan tipe data string dan mempunyai modifier private. Private disini maksudnya adalah variable ini hanya bisa diakses oleh kelas ini saja.

public Bilangan(){

this.setNilai(0);

}

Konstruktor yang tidak mempunyai parameter. Konstruktor tak berparameter ini berfungsi untuk memberikan nilai default jika user tidak menentukan nilai awal dari variable ketika melakukan instansiasi objek.

public Bilangan(String nilai){
this.setNilai(nilai);
}

Kosntruktor diatas mempunyai parameter berupa variable dengan nama nilai yang bertipe data string. Konstruktor ini berfungsi untuk mengakomodasi user yang ingin mendefinisikan nilai awal variable dengan tipe data string.

public Bilangan(int nilai){

this.setNilai(nilai);

}

Konstruktor diatas mempunyai parameter berupa variable dengan nama nilai yang bertipe data integer. Konstruktor ini berfungsi untuk mengakomodasi user yang ingin mendefinisikan nilai awal variable dengan tipe data integer.

private void setNilai(String nilai){

number = nilai;

}

Kode di atas adalah sebuah method atau fungsi. Method diatas tidak mempunyai nilai kembalian atau void. Modifier private pada method ini artinya adalah method ini hanya bisa diakses dalam kelas ini saja. Kemudian method ini mempunyai parameter dengan tipe data String. Parameter tersebut akan digunakan untuk mendefinisikan variable number yang sudah di buat diatas. Dapat dilihat pada kode diatas variable number mempunyai value yang diambil dari parameter nilai.

private void setNilai(int nilai){

number = Integer.toString(nilai);

}

Kode di atas adalah sebuah method atau fungsi. Method diatas tidak mempunyai nilai kembalian atau void. Modifier private pada method ini artinya adalah method ini hanya bisa diakses dalam kelas ini saja. Kemudian method ini mempunyai parameter dengan tipe data integer. Parameter tersebut akan digunakan untuk mendefinisikan variable number yang sudah di buat diatas. Integer.toString(nilai) digunakan untuk mengubah nilai dari tipe data integer menjadi bentuk string.

public String getNilai(){

return number;

}

Kode diatas adalah method yang mempunyai modifier public dan mempunyai kembalian nilai bertipe string. Method diatas digunakan untuk mendapatkan nilai dari variable number. Kenapa harus public? Karena method ini akan dipanggil oleh kelas lain yang membutuhkan nilai dari variable number.

1. public void Add(Bilangan bil){

2. int a, b, r, c=0;

3. String hasil="";

4. String bil1 = this.getNilai();

5. String bil2 = bil.getNilai();

6. int al = bil1.length();

7. int bl = bil2.length();

8. if(bil1.length() < bil2.length()){

9. for(int i=0;i<bl-al;i++){

10. bil1 = "0" + bil1;

11. }

12. }else if(bil1.length() > bil2.length()){

13. for(int j=0;j<al-bl;j++){

14. bil2 = "0" + bil2;

15. }

16. }

17. for(int i=Math.max(al, bl)-1;i>=0;i--){

18. a = Integer.parseInt(""+bil1.charAt(i));

19. b = Integer.parseInt(""+bil2.charAt(i));

20. r = (a + b + c)%10;

21. c = (a + b + c)/10;

22. hasil = r + hasil;

23. }

24. if(c>0){

25. hasil = Integer.toString(c)+hasil;

26. }

27. //int ab = Integer.parseInt(bil1.substring(9));

28. System.out.println(bil1+" + "+bil2);

29. System.out.println(hasil);

30. }

31. }

Method diatas adalah core dari class ini. Artinya algoritma penghitungan kedua bilangan dengan digit tak hingga ada dalam method ini. Method ini mempunyai parameter dengan tipe data objek Bilangan dan mempunyai modifier public agar bisa diakses oleh kelas dan package lain. Oke selanjutnya akan saya jelaskan baris demi baris dari method ditas.

Sebelumnya akan saya jelaskan dulu jalannya algoritma yang menjadi core method ini

Pada gambar diatas angka yang ditandai warna kuning adalah nilai yang akan ditampung variabel int a. kemudian angka yang ditandai warna biru adalah nilai yang akan ditampung variable int b. yang terakhir angka yang ditandai warna hijau adalah nilai yang akan ditampung variable int r.

Proses penghitungan angka – angka diatas dilakukan satu persatu berjalan mulai dari yang paling kanan sampai yang paling kiri. Dapat dilihat pada gambar diatas angka 4 ditambahkan dengan angka 8 menghasilkan nilai 12. Yang artinya variable a ditambah dengan variable b menghasilkan variable r yang dimodulo 10. angka yang dihasilkan variable r yaitu 12 membawa nilai yang disebut carry sebanyak 1. Oleh karena itu nilai carry perlu ditampung divariabel tersendiri, disini saya membuat variable carry adalah int c yang diinisialisasi nilai awal 0.

gambar diatas menunjukkan bahwa nilai dari variable r adalah hasil dari penjumlahan variable a ditambah variable b kemudian dimodulo 10. Kemudian untuk nilai carry-nya adalah hasil dari penjumlahan variable a ditambah variable b yang dibagi 10. Sehingga variable menghasilkan nilai 2 dan variable c menghasilkan nilai 1.

int a, b, r, c=0;

inisialisasi variable yang digunakan untuk menampung nilai – nilai yang sudah saya jelaskan diatas.

String hasil="";

Inisialisasi variable hasil dengan tipe data string yang digunakan untuk menampung hasil akhir penjumlahan kedua bilangan dengan digit tak terbatas.

String bil1 = this.getNilai();

String bil2 = bil.getNilai();

Inisialisasi variable bil1 dengan tipe data string yang digunakan untuk menampung nilai bilangan pertama. Kemudian dibawahnya juga sama tapi variable bil2 digunakan untuk menampung nilai bilangan kedua.

int al = bil1.length();

int bl = bil2.length();

inisialisasi variable al dengan tipe data integer yang digunakan untuk menampung panjang digit dari bilangan pertama. Kemudian dibawahnya juga sama tapi variable bl digunakan untuk menampung panjang digit dari bilangan kedua. Nilai panjang digit dari tiap bilangan diperlukan oleh kode dibawah ini

8. if(bil1.length() < bil2.length()){

9. for(int i=0;i<bl-al;i++){

10. bil1 = "0" + bil1;

11. }

12. }else if(bil1.length() > bil2.length()){

13. for(int j=0;j<al-bl;j++){

14. bil2 = "0" + bil2;

15. }

16. }

Kode diatas maksudnya adalah melakukan pengecekan apakah jumlah digit kedua bilangan sama atau tidak. Jika kedua bilangan mempunyai jumlah digit yang tidak sama maka jumlah digitnya harus disamakan dengan menambahkan angka 0 sampai jumlah digitnya sama dengan jumlah digit dari bilangan yang mempunyai jumlah digit terbanyak. Lebih jelasnya bisa dilihat pada gambar dibawah ini,

Kenapa harus ditambahkan dengan angka 0? Jawabannya adalah agar bisa dihitung oleh java. Jadi jika variable a mempunyai nilai sedangkan variable tidak mempunyai nilai alias null maka java tidak bisa menghitungnya. Sehingga diperlukan angka 0 untuk mewakili nilai null tersebut agar dapat menghasilkan nilai.

for(int i=Math.max(al, bl)-1;i>=0;i--){
a = Integer.parseInt(""+bil1.charAt(i));
b = Integer.parseInt(""+bil2.charAt(i));
r = (a + b + c)%10;
c = (a + b + c)/10;
hasil = r + hasil;
}

Kode diatas maksudnya adalah melakukan penghitungan penjumlahan dimulai dari digit paling belakang dari bilangan pertama dengan digit paling belakang dari bilangan kedua. Penjumlahan tersebut terus berjalan hingga digit paling depan dari kedua bilangan. Untuk mengetahui sampai kapan program berhenti menghitung maka perlu diberikan batasan yaitu sebanyak digit terbanyak dari kedua bilangan. Oleh karena itu pada int i didefinisikan dengan pencarian nilai terbesar dari kedua bilangan menggunakan fungsi Math.max(). Setiap digit dari bilangan pertama ditampung dalam variable a dan variable b untuk setiap digit bilangan kedua. Variable a dan b perlu diparsing menjadi integer karena pada awalnya variable a dan b adalah string, dimana variable yang bertipe string tidak dapat dilakukan operasi penghitungan. Variable r digunakan untuk menampung hasil dari penjumlahan variable a, b, dan c yang dimodulo 10. Mengapa harus dimodulo 10? Karena disini seperti kita menjumlahkan bilangan pada umumnya dengan cara yang manual pasti jika hasil dari angka yang dijumlahkan lebih dari 10 maka yang ditulis hanya angka belakangnya, misalnya jika hasilnya 12 maka yang ditulis hanya angka 2 sedangkan angka 1 menjadi nilai carry. Kemudian Variable c adalah variable yang digunakan untuk menampung nilai carry yang dimana rumusnya adalah penjumlahan variable a, b, dan c dibagi dengan 10. Variable c awalnya didefinisikan dengan 0. Selanjutnya variable hasil adalah variable bertipe string yang digunakan untuk menampung hasil akhir dari penjumlahan kedua bilangan.

if(c>0){

hasil = Integer.toString(c)+hasil;

}

Kode diatas maksudnya adalah jika nilai carry lebih dari 0 maka di bagian paling depan pada hasil akhir penjumlahan kedua bilangan tersebut akan ditambahkan nilai carry tersebut.

System.out.println(bil1+" + "+bil2);

System.out.println(hasil);

Kode diatas maksudnya adalah mencetak output bilangan 1 + bilangan 2 dan mencetak hasil dari penjumlahan bilangan 1 dan bilangan 2.

Selanjutnya untuk melakukan pengujian terhadap program yang sudah dibuat kita perlu untuk membuat class test-nya. Nah dibawah ini sudah saya sediakan class test-nya, silahkan dicoba.

File Main.java

* To change this template, choose Tools | Templates

* and open the template in the editor.

package spoj;

import java.util.Scanner;

/**

* @author Yoga

public class Main {

public static void main(String[] arg) {

Scanner sc = new Scanner(System.in);

String input1 = sc.nextLine();

String input2 = sc.nextLine();

Bilangan bil1 = new Bilangan(input1);

Bilangan bil2 = new Bilangan(input2);

bil1.Add(bil2);

}

Eat, Pray, Code

MEAN (MongoDB, Express, Angular, Node) Stack : Kick Start First Project Using Generator

Membuat Program JAVA : Penambahan Dua Angka dengan Digit Tak Terbatas (BigAdder)

About me

Follow Us

Labels

recent posts

Blog Archive

Popular Posts

Like us on Facebook

Flickr Images