Cara Penginstalan dan Konfigurasi MongoDB - Coding Rakitan

MongoDB merupakan salah satu jenis database NoSQL yang menyimpan datanya dalam bentuk json. MongoDB hadir dengan menyediakan skema database yang tidak kaku, artinya pengguna dapat dengan mudah menambahkan field dan isinya tanpa mendeklarasikan field terlebih dahulu.

Contohnya dalam MySQL untuk dapat menyimpan data terlebih dahulu harus membuat Tabel, kemudian mendeklarasikan isi field dalam tabel tersebut seperti nama field, panjang karakter, jenis karakter, sedangkan pada MongoDB hanya tinggal membuat nama databse lalu membuat tabel atau dalam hal ini disebut Collection. Setelah membuat Collection anda tinggal mengisinya dengan data yang di inginkan.

Karena bentuk penyimpanannya berupa JSON anda bebas menentukan nama dan isi data yang satu dengan yang lainnya. Contoh data yang akan disimpan dalam collection "user" seperti berikut.

 
[{
"nama" : "User 1",
"id" : 2,
"kota" : "Makassar"

},
{
 "nama": "User 2",
 "id": 3,
 "foto": null,
 "alamat":[{
  "kecamata": null,
  "kabupaten": null,
  "kota" : null
 }]
}
]

 

Pada contoh di atas bisa dilihat, meskipun berada dalam collection yang sama, akan tetapi field user1 dan user2 sedikit berbeda. Inilah yang menjadi salah satu keuntungan menggunakan MongoDB, yaitu bebas mendeklarasikan data tanpa harus mengikuti data yang sudah ada.

Untuk menggunakan MongoDB terlebih dahulu download aplikasi MongoDB di https://www.mongodb.com/. Klik tombol "Try Free" pada pojok kanan atas halaman web. Setelah itu akan muncul halaman baru silahkan klik "server seperti gambar di bawah" lalu pilih versio, OS, Package, sesuai kebutuhan anda, dan terakhir klik download.

Instal MongoDB

Setelah file berhasil di download silahkan klik dua kali pada file MongoDB tadi, trus lakukan penginstalan seperti pada umumnya.

Konfigurasi Path Database

Agar dapat menyimpan data, lakukan konfigurasi tempat penyimpanan database terlebih dahulu. Caranya, buat folder baru di "C:\data\db" atau silahkan buat sesuai keinginan anda.

Masuk ke folder bin MongoDB anda "C:\Program File\MongoDB\Server\4.0\bin" (Sesuaikan dengan folder MongoDB anda) kemudian pada address path silahkan ketikkan cmd sehingga nantinya cmd akan terbuka dengan direktori seperti gambar di bawah.

Selanjutnya pada layar cmd ketikkan perintah mongod.exe --dbpath "C:\data\db" lalu tekan enter dan tunggu hingga proses selesai. Folder "C:\data\db" adalah folder yang sudah dibuat sebelumnya. Setelah proses selesai, masih dalam tampilan cmd silahkan ketikkan perintah "mongo.exe". Jika muncul tampilan seperti gambar di bawah, tandanya MongoDB siap digunakan.

https://codingrakitan.blogspot.com/2019/

Read More

Cara Membuat Slide Page Menggunakan Tab Layout dan View Pager di Android Studio - Coding Rakitan

Pada tutorial kali ini kita akan membuat Slide Page yang dibuat menggunakan kombinasi antara tab layout dengan view pager. Slide Page ini sudah biasa kita lihat pada aplikasi-aplikasi terkenal seperti WhatsApp, Youtube, google adsense, dan masih banyak lagi.

Untuk membuat Slide Page kita bisa memanfaatkan widget yang disediakan Android Studio yaitu Tab Layout dan View Pager. Tampilan yang nantinya kita buat akan tampak seperti berikut :

Sebelum memulai ada baiknya anda mengetahui struktur class, layout, drawable yang akan kita buat nantinya. Terdapat 4 class yang akan dibuat, satu class utama atau activity dan tiga class fragment yang nantinya akan dipanggil kedalam activity. Layout yang dibutuhkan ada 4 yaitu layout utama (activity_main) dan tiga layout fragment. Didalam drawable kita juga menambahkan ikon back untuk yang akan dipasang pada toolbar aplikasi nantinya, untuk menambahkan icon ini anda bisa menggunakan Vector Asset yang disediakan Android Studio.

Lanjut ke tahap pembuatan project baru :

Sebelum memulai menambahkan dan mengedit file, edit terlebih dahulu dependencies pada file build.grandle (Module.app) dan tambahkan kode dibawah.

 
dependencies {
        ...
        implementation 'com.android.support:design:28.0.0'
        implementation 'com.android.support:support-v4:28.0.0'
 ...
}
 

Hal ini dimaksudkan untuk mengimport/mendownload library dari android studio sehingga widget Tab Layout dan View Pager dapat digunakan.

Buat FragmentSatu.java

 
public class FragmentSatu extends Fragment {
    public FragmentSatu(){

    }
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState){
        View view = inflater.inflate(R.layout.fragment_satu, container, false);

        return view;
    }
}
 

Buat FragmentDua.java

 
public class FragmentDua extends Fragment {
    public FragmentDua(){

    }
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState){
        View view = inflater.inflate(R.layout.fragment_dua, container, false);

        return view;
    }

}
 

Buat FragmentTiga.java

 
public class FragmentTiga extends Fragment {
    public FragmentTiga(){

    }
    @Override
    public View onCreateView (LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState){
        View view = inflater.inflate(R.layout.fragment_tiga, container, false);
        return view;
    }
}
 

Buat Layout fragment_satu.xml

 
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/satu">


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:orientation="vertical">

        <TextView
            android:id="@+id/textView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Ini dalah tampilan"
            android:textColor="@color/white" />

        <TextView
            android:id="@+id/textView4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="FRAGMENT SATU"
            android:textColor="@color/white"
            android:textSize="18sp"
            android:textStyle="bold" />
    </LinearLayout>

</RelativeLayout>
 

Buat Layout fragment_dua.xml

 
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/dua">


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:orientation="vertical">

        <TextView
            android:id="@+id/textView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Ini dalah tampilan"
            android:textColor="@color/white" />

        <TextView
            android:id="@+id/textView4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="FRAGMENT DUA"
            android:textColor="@color/white"
            android:textSize="18sp"
            android:textStyle="bold" />
    </LinearLayout>

</RelativeLayout>
 

Buat Layout fragment_tiga.xml

 
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/tiga"
    android:gravity="center"
    android:orientation="vertical">

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Ini dalah tampilan"
        android:textColor="@color/white" />

    <TextView
        android:id="@+id/textView4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="FRAGMENT TIGA"
        android:textColor="@color/white"
        android:textSize="18sp"
        android:textStyle="bold" />
</LinearLayout>
 

Edit activity_main.xml

 
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <android.support.design.widget.AppBarLayout
            android:id="@+id/appbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/biru">

            <android.support.v7.widget.Toolbar
                android:id="@+id/tol"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:theme="@style/ToolbarStyle"
                app:layout_scrollFlags="scroll|enterAlways"
                app:titleTextAppearance="@style/ToolbarStyle"></android.support.v7.widget.Toolbar>

            <android.support.design.widget.TabLayout
                android:id="@+id/tab"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:layout_scrollFlags="scroll|enterAlways"
                app:tabIndicatorColor="@android:color/white"
                app:tabMode="fixed"
                app:tabSelectedTextColor="@android:color/white"
                app:tabTextColor="@color/grey">

                <android.support.design.widget.TabItem
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Tab1" />

                <android.support.design.widget.TabItem
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Tab2" />

                <android.support.design.widget.TabItem
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Tab3" />
            </android.support.design.widget.TabLayout>
        </android.support.design.widget.AppBarLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">

            <android.support.v4.view.ViewPager
                android:id="@+id/view_pager"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />
        </LinearLayout>

    </LinearLayout>

</android.support.design.widget.CoordinatorLayout>
 

Edit MainActivity.java

 
public class MainActivity extends AppCompatActivity {

    private TabLayout tab;
    private ViewPager viewPager;
    private Toolbar toolbar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        tab = findViewById(R.id.tab);
        viewPager = findViewById(R.id.view_pager);
        toolbar = findViewById(R.id.tol);

        setSupportActionBar(toolbar);
        toolbar.setTitle(R.string.app_name);
        toolbar.setNavigationIcon(getResources().getDrawable(R.drawable.ic_back));


        tab.setupWithViewPager(viewPager);
        SetupViewPager();
        tab.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
            @Override
            public void onTabSelected(TabLayout.Tab tab) {
                viewPager.setCurrentItem(tab.getPosition());
            }

            @Override
            public void onTabUnselected(TabLayout.Tab tab) {

            }

            @Override
            public void onTabReselected(TabLayout.Tab tab) {

            }
        });
    }

    private void SetupViewPager() {
        MyViewPagerAdapter adapter = new MyViewPagerAdapter(getSupportFragmentManager());
        adapter.AddFragment(new FragmentSatu(), "Tab1");
        adapter.AddFragment(new FragmentDua(), "Tab2");
        adapter.AddFragment(new FragmentTiga(), "Tab3");
        viewPager.setAdapter(adapter);
    }

    private class MyViewPagerAdapter extends FragmentPagerAdapter {
        private List<Fragment> fr = new ArrayList<>();
        private List<String> title = new ArrayList<>();
        public MyViewPagerAdapter(FragmentManager manager) {
            super(manager);
        }

        public void AddFragment(Fragment fragment, String jd) {
            fr.add(fragment);
            this.title.add(jd);
        }

        @Override
        public Fragment getItem(int position){
            return fr.get(position);
        }

        @Override
        public CharSequence getPageTitle(int position){
            return title.get(position);
        }

        @Override
        public int getCount() {
            return 3;
        }
    }
}

 

Edit colors.xml

 
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#008577</color>
    <color name="colorPrimaryDark">#00574B</color>
    <color name="colorAccent">#D81B60</color>
    <color name="biru">#0056FF</color>
    <color name="grey">#DDDDDD</color>
    <color name="white">#FFFFFF</color>
    <color name="satu">#810000</color>
    <color name="dua">#E6AA00</color>
    <color name="tiga">#003091</color>
</resources>


 

Edit style.xml

 
<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="windowActionBar">false</item>

    </style>
    <style name="ToolbarStyle" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="titleTextColor">@color/white</item>
        <item name="android:tint">@color/white</item>
        <item name="android:textSize">18sp</item>

    </style>

</resources>

 

Run Aplikasi

https://codingrakitan.blogspot.com/2019/

Read More

Pengenalan Route dan View Laravel Plus Membuat Tampilan Website Pertama Dengan Laravel - Coding Rakitan

 (Source : Dokumentasi Pribadi)

Hallo sobat CODING RAKITAN, bagaimana kabarnya? Semoga semuanya sehat ya :). Pada artikel kali ini, saya akan membagikan tentang Route dan View pada Laravel dengan membuat halaman website sederhana. Tujuan akhirnya adalah agar teman-teman tahu konsep Route dan view pada Laravel.

Bagi teman-teman yang belum menginstal Laravel-nya, silahkan diinstal dulu artikel saya sebelumnya. (Baca : Cara Install Laravel Terbaru Via Composer).

Okey, saya akan bahas dulu satu persatu apa itu Route dan View.

Route

Route kalau diterjemahkan jadi rute atau jalan. Rute atau jalan itu merupakan alur yang bisa kita lalui untuk menuju ke tempat tujuan kita. Jadi kita harus melewati jalan tertentu untuk sampai pada tujuan tertentu. Hehehe. Ah, gitulah! :) Intinya Route ini digunakan untuk memaping atau memetakan atau membuat peta url yang bisa kita gunakan untuk mengakses website Laravel kita.

View

View dalam laravel artinya tampilan, yaitu tempat dimana kita menyimpan semua file tampilan website laravel kita. Disinilah file HTML, CSS bahkan JAVASCRIPT disimpan. intinya semua yang berkaitan dengan user interface ada semua dalam folder view ini. Dalam laravel, kalau kita membuat sebuah file view, kita harus menambahkan namaFile.blade.php. Inilah yang disebut dengan blade template. Blade template ini merupakan template engine bawaan laravel yang mempermudah kita dalam membuat website dengan laravel, karena code atau syntax-nya yang sangat singkat tapi sangat powerfull.

Membuat Route

Route pada laravel terletak didalam folder routes/web.php. Pada saat teman-teman membuka file web.php, kalian akan mendapati code seperti ini.
Code ini memanggil sebuah view dengan nama welcome. Kalau teman-teman pertama kali menjalankan file laravel maka teman-teman akan mendapati tampilan seperti dibawah ini.

 (Source : Dokumentasi Pribadi)

Tampilan ini berasal dari view dengan nama welcome ini. Ayo kita buktikan. Kita buka folder resources/views/welcome.blade.php. Lihat code-nya guys. Code itulah yang ditampilkan oleh laravel saat pertama kali kita membuka file laravel setelah berhasil menginstall laravel. Untuk membuktikan, mari kita ubah tulisannya. OK :).

Kita ubah tulisan Laravel dengan tulisan CODING RAKITAN dalam class content :

File welcome.blade.php sebelum diubah (Source : Dokumentasi Pribadi)

File welcome.blade.php sesudah diubah (Source : Dokumentasi Pribadi)

Setelah diubah, maka tampilan website kita akan seperti dibawah ini :

 (Source : Dokumentasi Pribadi)

Nah, sudah berubahkan,jadi betul file welome itulah yang dipanggil pertama kali saat kita membuka website laravel kita (Secara Default).

Namun muncul pertanyaan, bagaimana nih guys aku ingin ubah tampilannya dengan tampilan yang saya buat sendiri, bukan seperti itu. Nah, itulah tujuan belajar kita kali ini yaitu bagaimana memanipulasi website tersebut menjadi seperti yang kita inginkan.

Untuk mengubahnya, teman-teman buka folder routes/web.php terus kita ubah route-nya. Misalnya teman-teman ingin membuat route-nya menjadi nama teman-teman sendiri. Monggo Silahkan, ayo!

Silahkan tambahkan code seperti dibawah ini.

Penjelasan :

---

/elfrid merupakan nama route yang akan kita panggil dalam url kita agar menampilkan tulisan Hello Elfrid, Welcome To Laravel. Sedangkan return (Kalau tulisannya cuma return itu berarti return true) digunakan untuk memberikan perintah untuk menjalankan atau biasa disebut mengembalikan nilai dari sebuah fungsi yang telah kita buat. Jadi dalam hal ini function tersebut mengembalikan nilai berupa string dengan tulisan Hello Elfrid, Welcome To Laravel.

Untuk melihat hasilnya, mari kita jalankan laravel kita dengan perintah php artisan serve maka akan kita akan mendapatkan sebuah url yang bisa kita gunakan untuk mengakses website kita yaitu http://127.0.0.1:8000. Untuk memanggil route yang telah kita buat tadi, tinggal tambahkan http://127.0.0.1:8000/elfrid



Warning :

---

Nama url sesuaikan dengan yang teman-teman buat). Kalau sudah benar, maka akan tampil seperti dibawah ini.

 (Source : Dokumentasi Pribadi)

Untuk memanggil tampilan dari resources/views, kita buatkan dulu sebuah file difolder resources/views dengan nama home misalnya. Teman-teman bebas mau gunakan nama file apa. Jadi filenya menjadi home.blade.php

Kemudian tambahkan code seperti dibawah ini (Saya menambahkan Code bootstrap untuk mempercantik tampilan website kita).


Kemudian kita buat route baru di folder routes/web dengan nama home. Seperti code dibawah ini.

 (Source : Dokumentasi Pribadi)

Kemudian buka url http://127.0.0.1:8000/home maka akan tampil seperti dibawah ini.

 (Source : Dokumentasi Pribadi)

Terus bagaimana caranya kalau kita mau supaya tampilan awal website kita bukan views/welcome tapi views/home. Caranya cukup sederhana kita tinggal hapus route yang memanggil view welcome dan dan kita ubah route home seperti dibawah ini.

 (Source : Dokumentasi Pribadi)

Jadi setiap kali kita buka website kita yang pertama muncul adalah views/home. Untuk membuktikannya, silahkan buka http://127.0.0.1:8000 maka tampilan home yang telah kita buat langung otomatis terpanggil.

Saya rasa untuk postingan kali ini sampai disini saja ya teman-teman, semoga apa yang saya bagikan bermanfaat. Kalau masih bingung silahkan tanyakan langsung dikolom komentar.

Terima Kasih,
Salam dari admin CODING RAKITAN,
Keep learning - Keep Sharing

https://codingrakitan.blogspot.com/2019/

Read More

Cara Menginstall Laravel 6 Terbaru Menggunakan Composer - Coding Rakitan

(Source : Dokumentasi Pribadi)

Halo teman-teman CODINGRAKITAN, bagaimana kabarnya? Semoga kalian semua pada sehat ya teman-teman. Pada artikel kali ini, saya akan membahas tentang cara menginstall Laravel 6. (Baca : Pengertian Laravel) Untuk menginstal laravel 6, kita harus tahu dulu apa persyaratan yang digunakan sebelum menginstal Laravel 6 ini, agar tidak terjadi ERROR yang tidak diinginkan nantinya.

Yang teman-teman perlu persiapkan adalah :
- Menginstall Composer (Lihat : Apa Itu Composer dan Cara Penginstallannya?)
- Menggunakan PHP Versi 7.2.0 atau versi terbarunya

Setelah memenuhi semua persayaratan itu, teman-teman bisa lanjut ketahap penginstalan Laravel.

Untuk menginstall Laravel ini ada 3 cara yaitu lewat laravel installer, install langsung project menggunakan composer dan juga clone dari github. Namun pada tutorial kali ini, saya hanya akan jelaskan cara menginstall laravel menggunakan laravel installer dan juga install langsung project via composer.

Okey, let's go!

Via Laravel Installer

Pertama-tama, kita buat dulu sebuah folder di direktori kita. Saya disini menginstall laravel di drive E saya.

Untuk membuat folder, kita bisa buat foldernya secara manual, bisa juga menggunakan cmd, saya disini mencoba membuat foldernya dengan cmd, hehe, biar kelihatan lebih greget gitu, heheh. Sekalian belajar.

Teman-teman silahkan buka CMD (Command Prompat) dengan menekan tombol Logo windows + R dikeyboard kita. Kemudian ketikan cmd lalu tekan ENTER atau klik OK saja.

(Source : Dokumentasi Pribadi)

Kemudian, pilih drive yang teman-teman inginkan untuk menginstall laravelnya. Kebetulan saya menggunakan drive E saya. Langsung ketik E: pada CMD-nya, maka akan otomatis diarahkan ke drive yang kita pilih.

(Source : Dokumentasi Pribadi)

Kemudian ketika mkdir diikuti dengan nama folder yang teman-teman ingin buat. Contohnya mkdir nama folder (Saya membuat folder dengan nama laravel installer jadi perintahnya menjadi mkdir laravel-installer). Teman-teman bisa ganti namanya dengan nama folder yang teman-teman suka artinya bebas. Setelah itu maka teman-teman akan melihat ada folder laravel-installer didrive yang teman-teman sudah pilih sebelumnya.

(Source : Dokumentasi Pribadi)

Selanjutnya, kita menuju kepenginstallan laravelnya, pastikan teman-teman terhubung ke internet ya teman-teman.

Ketikan perintah : composer global require laravel/installer

(Source : Dokumentasi Pribadi)

Karena saya sudah menginstal laravel installer sebelumnya, maka tampilannya akan seperti ini, teman-teman mungkin tampilanya berbeda, tunggu sampai prosesnya selesai. Kemudian kita buat project kita dengan nama yang kita suka. Masuk dulu ke folder laravel-installernya dengan mengetikan cd laravel-installer kemudian ENTER.

(Source : Dokumentasi Pribadi)

Setelah itu ketikan perintah laravel new nama-project kita (Saya menggunakan nama folder blog. Maka perintahnya menjadi laravel new blog kemudian tekan ENTER). Seperti sebelumnya teman-teman bebas membuat nama project sesuai keinginan teman-teman.

(Source : Dokumentasi Pribadi)

Setelah muncul tulisan seperti dibawah ini, berarti teman-teman sudah berhasil menginstall laravel via laravel installer. Kemudian masuk dulu difolder blog dengan mengetikan perintah cd blog setelah itu jalankan perintah php artisan serve.

(Source : Dokumentasi Pribadi)

Untuk menjalankannya, teman-teman tinggal ketikan perintah php artisan serve

(Source : Dokumentasi Pribadi)

Kemudian copykan alamat local server http://127.0.0.1:8000 ke browser kita maka akan tampil seperti dibawah ini. Hore, cara pertama sudah berhasil.

Via Composer Create-Project

Cara kedua cukup mudah, teman-teman tinggal arahkan file installan teman-teman ke drive yang kalian inginkan. ikuti langkah sebelumnya diatas. Kemudian ketikan langsung perintah composer create-project --prefer-dist laravel/laravel blog (blog merupakan nama folder). Kemudian tekan ENTER.

(Source : Dokumentasi Pribadi)

Tunggu sampai proses penginstallannya selesai, seperti gambar dibawah ini.

(Source : Dokumentasi Pribadi)

Kemudian, jalankan perintah, php artisan serve untuk menjalankannya,maka akan muncul alamat local servernya yaitu http://127.0.0.1:8000 . Copykan alamatnya ke browser dan kalau tampilannya seperti dibawah ini, berarti teman-teman sudah berhasil menginstall laravel via composer.

(Source : Dokumentasi Pribadi)

Okey teman-teman, itulah cara yang bisa kita gunakan untuk menginstall laravel dikomputer kita. Teman-teman bisa pakai salah satu cara diatas untuk menginstallnya. Semoga berhasil ya teman-teman. Kalaupun ada yang bermasalah dalam proses penginstallannya, teman-teman bisa tanyakan dikolom komentar.

Sampai jumpa dipostingan LARAVEL selanjutnya.

Terima Kasih,
Keep Learning - Keep Sharing

https://codingrakitan.blogspot.com/2019/

Read More

Cara Membuat Project Baru Django - Coding Rakitan

Sebelumnya dalam postingan Mengenal Apa itu Django dan Cara Penginstalannya kita telah menginstall django. Pertanyaan yang muncul selanjutnya adalah bagaimana cara memulai membuat project dengan django.

Caranya sangat mudah anda tinggal membuka CMD atau Command Promt lalu arahkan ke folder mana anda ingin membuat project baru. Setelah itu ketikkan perintah dibawah pada cmd.

 
django-admin startproject nama_web
 

Nama_web bisa anda ganti sesuai keinginan anda. Jika proses pembuatan selesai maka di folder yang tadinya anda arahkan untuk membuat project baru akan muncul direktori dengan struktur seperti berikut.

gambar

Pada contoh struktur di atas saya membuat project baru dengan nama belajar sehingga muncul folder baru dengan nama belajar. Berikut adalah penjelasannya.

• Belajar - merupakan folder root atau utama yang menampung semua kebutuhan project web yang dibuat.
• manage.py - file ini merupakan server yang akan mengolah project web yang dibuat. Agar server web dapat berjalan file inilah yang pertama kali di eksekusi ke CMD.
• belajar/__init__.py - file ini merupakan file kosong yang menandai bahwa direktori ini adalah sebuah paket (python package).
• belajar/settings.py - Seperti namanya file ini berisi konfigurasi project seperti database, auth, hingga language code.
• belajar/url.py - file ini adalah tempat untuk mendeklarasikan url fungsinya sama dengan web.php pada routes laravel.
• belajar/wsgi.py

Setelah project baru selesai dibuat maka pelajaran selanjutnya yang perlu diketahui adalah cara menjalankan project yang telah dibuat. Caranya sangat mudah anda tinggal menjalankan file manage.py dengan mengetikkan perintah python manage.py runserver dan tekan enter. Selanjutnya buka browser anda dan masukkan url "localhost:8000" dan tampilan pertama akan muncul seperti berikut.

https://codingrakitan.blogspot.com/2019/

Read More

Mengenal Apa itu Django dan Cara Penginstalannya - Coding Rakitan

Python merupakan salah satu bahasa pemrograman yang populer di kalangan para programer. Tidak hanya dapat digunakan untuk membangun aplikasi desktop, Python juga dapat digunakan untuk membangun aplikasi berbasis web. Salah satu framework website yang menggunakan bahasa python adalah Django.

Django adalah sebuah framework full-stack yaitu istilah yang berarti django meliputi sisi front-end dan juga back-end. Susunan tahapan yang harus anda lalui untuk dapat menggunakan framework django : Install python -> Install PIP -> Install Django.

Install Python

Agar dapat membangun web dengan framework django terlebih dahulu anda harus menginstall python. Anda dapat mendownload di halaman resminya disini. Setelah anda berhasil menginstall python, silahkan lakukan pengecekan untuk memastikan phyton sudah siap digunakan. Caranya buka Command Promt atau CMD lalu ketik "python --version", jika berhasil akan muncul informasi versi python seperti gambar dibawah.

Install PIP

Lanjut ke tahap penginstalan PIP yaitu sebuah pengolah package untuk python. PIP ini sama fungsinya seperti Composer untuk php atau NPM pada Node js. Pengolah package ini nantinya diperlukan untuk mendownload Django. Cara penginstalan PIP cukup mudah, silahkan download file get-pip.py, setelah itu buka cmd dan arahkan ke folder file get-pip.py berada. Selanjutnya ketik perintah "python get-pip.py" di cmd dan tunggu hingga proses instalasi selesai. Untuk dokumentasi lengkap penginstalan PIP dapat anda lihat disini.

Install Django

Tahap terakhir adalah menginstall Django cara sangat mudah anda tinggal buka CMD lalu ketik "pip install django" lalu tunggu hingga proses selesai. Untuk memastikan django telah terpasang, ketikkan perintah "django-admin --version" di CMD, jika muncul versi django seperti gambar di bawah maka selamat django anda siap digunakan.

Sekarang anda bisa memulai untuk membuat project dengan django. Untuk cara pembuatan project baru menggunakan django anda bisa melihatnya di Postingan : Cara Membuat Project Baru Django.

https://codingrakitan.blogspot.com/2019/

Read More

Cara Membuat View Pager di Android Studio - Coding Rakitan

Hai Sobat Coding Rakitan kali ini kita akan belajar menggunakan View Pager di Android Studio. View Pager sendiri merupakan sebuah widget yang disediakan oleh Android Studio untuk membuat tampilan list yang keren pada aplikasi. Dengan menggunakan PagerView kita dapat membuat tampilan aplikasi seperti slide, list file horizontal, dan masih banyak lagi.

Berikut contoh tampilan yang bisa dibuat dengan memanfaatkan widget View Pager.

Sedangkan untuk tampilan yang akan kita buat nantinya akan tampak seperti berikut.

Berikut adalah daftar file baik Class, layout, ataupun drawable yang akan dibuat dalam tutorial kali ini.

Selain itu ada beberapa data berupa array yang diperlukan dalam mengisi card yang akan di tampilkan dalam View Pager nantinya. Cara membuat array ini anda tinggal klik kanan pada folder values -> New -> Value resources file, lalu beri nama array. Selanjutnya isi dengan kode seperti dibawah ini.

 
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string-array name="judul">
        <item>Google</item>
        <item>Coding Rakitan</item>
        <item>Facebook</item>
    </string-array>
    <string-array name="text">
        <item>Google merupakan website mesin pencari ...</item>
        <item>Coding Rakitan merupakan sebuah blog. . . </item>
        <item>Salah satu media sosial yang paling . . .</item>
    </string-array>
    <string-array name="gambar">
        <item>a</item>
        <item>b</item>
        <item>c</item>
    </string-array>
</resources>
 

Langsung saja untuk membuat tampilan seperti di atas menggunakan View Pager silahkan buka Android Studio anda. Buat sebuah project baru dengan format sperti dibawah.

• Name : Belajar Pagerview
• Package name : codingrakitan.blogspot.com.belajarpagerview (Atur sesuai keinginan)
• Language : Java
• Minimum API Level : API17 Android 4.2 (Jelly Bean)
• Chose Your Project : Empty Activity

Bagi pemula yang belum tahu cara membuat project baru silahkan kunjungi Cara Membuat Project Baru di Android Studio.

Setelah project baru selesai dibuat, lanjut ke tahap menambahkan dependencies yaitu "implementation 'com.android.support:support-v4:28.0.0'" kedalam file build.grandle (Module.app). Sehingga nantinya dependencies kita akan tampak seperti berikut.

 
  dependencies {
       implementation fileTree(dir: 'libs', include: ['*.jar'])
       implementation 'com.android.support:appcompat-v7:28.0.0'
       implementation 'com.android.support.constraint:constraint-layout:1.1.3'
       testImplementation 'junit:junit:4.12'
       androidTestImplementation 'com.android.support.test:runner:1.0.2'
       androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'
       implementation 'com.android.support:support-v4:28.0.0'
   }

 

Atau cara cepatnya silahkan klik ikon download seperti pada gambar di bawah.

MainActivity

 
public class MainActivity extends AppCompatActivity {

    TextView a, b;
    ViewPager pagerView;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        a = findViewById(R.id.a);
        b = findViewById(R.id.b);
        pagerView = findViewById(R.id.pager);
        isiViewPager();
    }

    private void isiViewPager() {
        Resources res = getResources();
        String[] judul = res.getStringArray(R.array.judul);
        String[] text = res.getStringArray(R.array.text);
        String[] gambar = res.getStringArray(R.array.gambar);
        AdapterViewPager adapter = new AdapterViewPager();
        b.setText(""+judul.length);
        for (int i=0;i<judul.length;i++){
            adapter.addCardItem(new ModelItem(judul[i], text[i], gambar[i]));
        }
        pagerView.setAdapter(adapter);
        pagerView.setOffscreenPageLimit(3);
        pagerView.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int i, float v, int i1) {

            }

            @Override
            public void onPageSelected(int i) {
                int p = i+1;
                a.setText(""+p);
            }

            @Override
            public void onPageScrollStateChanged(int i) {

            }
        });
    }
}
 

AdapterViewPager

 
public class AdapterViewPager extends PagerAdapter {


    private List<ModelItem> mData;


    private Context context;
    public AdapterViewPager() {
        mData = new ArrayList<>();
    }



    public void addCardItem(ModelItem item) {
        mData.add(item);
    }


    @Override
    public int getCount() {
        return mData.size();
    }

    @Override
    public boolean isViewFromObject(View view, Object object) {
        return view == object;
    }

    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        View view = LayoutInflater.from(container.getContext())
                .inflate(R.layout.cardw, container, false);
        TextView judul = view.findViewById(R.id.tv_judul);
        TextView text = view.findViewById(R.id.tv_text);

        judul.setText(mData.get(position).getJudul());
        text.setText(mData.get(position).getText());


            container.addView(view);
        return view;
    }

    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        container.removeView((View) object);
    }


}


 

ModelItem

 
public class ModelItem{

    String judul, text, gambar;
    public ModelItem(String judul, String text, String gambar){
        this.judul = judul;
        this.text = text;
        this.gambar = gambar;
    }

    public String getJudul() {
        return judul;
    }

    public void setJudul(String judul) {
        this.judul = judul;
    }

    public String getText() {
        return text;
    }

    public void setText(String text) {
        this.text = text;
    }

    public String getGambar() {
        return gambar;
    }

    public void setGambar(String gambar) {
        this.gambar = gambar;
    }
}
 

activity_main.xml

 
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#E8E8E8"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="horizontal"
        android:padding="10dp">

        <TextView
            android:id="@+id/a"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="1"
            android:textColor="@android:color/black"
            android:textSize="24sp" />

        <TextView
            android:id="@+id/textView4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="5dp"
            android:layout_marginRight="5dp"
            android:text="/"
            android:textColor="@android:color/black"
            android:textSize="24sp" />

        <TextView
            android:id="@+id/b"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="-"
            android:textColor="@android:color/black"
            android:textSize="24sp" />
    </LinearLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:clipToPadding="false"
        android:overScrollMode="never"
        android:paddingLeft="50dp"
        android:paddingEnd="50dp"
        android:paddingRight="50dp" />
</LinearLayout>
 

cardw.xml

 
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:padding="10dp">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="370dp"
        android:background="@android:color/white"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="200dp"
            android:background="@android:color/holo_blue_dark"
            android:orientation="vertical" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:padding="20dp">

            <TextView
                android:id="@+id/tv_judul"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="TextView"
                android:textColor="@android:color/black"
                android:textSize="18sp"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/tv_text"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="7dp"
                android:text="TextView" />
        </LinearLayout>

        <Button
            android:id="@+id/button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|right"
            android:layout_margin="10dp"
            android:background="@color/colorAccent"
            android:text="More"
            android:textColor="@android:color/white" />

    </LinearLayout>

</LinearLayout>
 

https://codingrakitan.blogspot.com/2019/

Read More