Tutorial Membuat Halaman Website Pertama dengan Laravel
Assalamualaikum wr.wb
Laravel merupakan framework yang dibangun oleh Taylor Otwell sejak tanggal 22 Februari 2012. Ini merupakan salah satu framework Open Source yang bebas dikembangkan oleh siapa saja dengan konsep MVC (Model- View - Controller). Yang digunakan para developer untuk membangun Website.
Sebelum kita memulai mengintal framework Laravel, pastikan pada komputer kalian sudah terinstal aplikasi seperti WARM ataupun XAMPP sebagai servernya. Pada artikel kali ini admin memakai aplikasi XAMPP sebagai servernya.
Sebetulnya ada beberapa cara untuk menginstall framework Laravel, namun pada artikel ini kita akan menginstallnya menggunakan cara Composer yaitu dengan mengetikan printah composer create-project pada command prompt. Nah metode ini sangat direkomendasikan dikarenakan Composer adalah sebuah alat yang sangat mendukung serta mengurus segala ketergantungan yang ada dalam laravel serta library lainnya. Dengan kata lain dapat dikatakang, kita tidak perlu mengunduh lagi satu - persatu library yang akan kita butuhkan nanti.
Install Composer
Bagi kalian yang menggunakan windows bisa kalian langsung mengunduh Composer Installer.
Untuk langkah - langkahnya, silahkan buka aplikasi yang sudah kalian unduh kemudian lakukanlah proses instalasi sampai selesai.
Pada saat proses instalasi composer, maka akan mncul tampilan yang meminta letak penyimpanan lokasi PHP yang kalian install sebelumnya, Karena pada tulisan ini admin menggunakan aplikasi XAMPP maka lokasinya berada di D:.xampp/php/php.exe. Jika kalian tidak menggunakan aplikasi XAMPP silahkan kalian cari lokasi penyimpanan PHP pada komputer masing - masing.
Install Laravel
Setelah kalian selesai menginstall Composer pada PC anda, selanjutnya kita akan menginstal Framework Laravel dengan mengetikan perintah composer create-project pada Command Prompt (CMD). Pada artikel ini saya menjelaskan menggunakan XAMPP, maka kita akan menginstal Framework Laravel pada folder C:/xampp/htdocs/.
Langkah-langkah instalasi
Silahkan buka Command Prompt dan arahkan lokasi instalasi pada folder htdocs.
Selanjutnya ketikan perintah composer create-project laravel/laravel nama-project –prefer-dist
nama-project adalah nama aplikasi atau proyek yang akan kita buat, sesuaikan nama project tersebut sesuai aplikasi yang ingin anda buat. pada kesempatan ini saya mencontohkan dengan nama proyek belajarlaravel.
proses instalasi Framework Laravel ini membutuhkan koneksi internet, tunggu hingga Framework laravel berhasil terpasang pada PC kita degan nama proyek yang kita buat.
Jangan lupa untuk mengaktifkan web server Apache pada aplikasi XAMPP.
Pastikan Apache dan MySql anda running.
Setelah proses instalasi selesai, silahkan masuk ke direktori instalasi lalu ketikan perintah php artisan serve.
Setelah itu akan muncul tulisan Laravel development server started: <127.0.0.1:8000>, selanjutnya ketikaan pada URL 127.0.0.1:8000.
Di bawah ini tampilan pertama ketika kita berhasil menginstal Laravel.
Selamat anda berhasil menampilkan aplikasi pertama anda.
Mengganti Tulisan Laravel dengan "Hello World"
Setelah kalian berhasil mengisntall atau membuat projct laravel, selanjutnya kita akan membuat melakukan perubahan pada tampilan pertama framework laravel. Saat kita belajar bahasa pemrograman apapun maka kita akan diperintah untuk menampilkan tulisan Hello World. Maka kita akan mengubah tulisan bawaan dari Laravel dengan Hello World.
Jika teman - teman ingin menulisankan kata yang berbeda silahkan saja, program tidak akan error. Tapi admin mencontohkan akan menampilkan kata Hello World
Jika teman - teman ingin menulisankan kata yang berbeda silahkan saja, program tidak akan error. Tapi admin mencontohkan akan menampilkan kata Hello World
Untuk dapat membuat seperti tampilan diatas, silahkan kalian buka project laravel yang sudah kalian buat sebelumnya mengunakan text editor seperti Notepade++, sublime dan lainnya. Framework laravel sendiri mempunyai konsep MVC yaitu singkatan dari (Model View Controller). untuk dapat membuat tampilannya kita buat pada folder View, Untuk data yang berhubungan dengan database kita simpan pada Model, serta untuk logikanya kita akan simpan pada file Controller.
Langkah pertama kita akan mengubah tampilannya pada file welcome.blade.php
Kode bawaan dari laravel
<!doctype html>
<html lang="{{ app()->getLocale() }}">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Laravel</title>
<!-- Fonts -->
<link href="" rel="stylesheet" type="text/css">
<!-- Styles -->
<style>
html, body {
background-color: #fff;
color: #636b6f;
font-family: 'Raleway', sans-serif;
font-weight: 100;
height: 100vh;
margin: 0;
}
.full-height {
height: 100vh;
}
.flex-center {
align-items: center;
display: flex;
justify-content: center;
}
.position-ref {
position: relative;
}
.top-right {
position: absolute;
right: 10px;
top: 18px;
}
.content {
text-align: center;
}
.title {
font-size: 84px;
}
.links > a {
color: #636b6f;
padding: 0 25px;
font-size: 12px;
font-weight: 600;
letter-spacing: .1rem;
text-decoration: none;
text-transform: uppercase;
}
.m-b-md {
margin-bottom: 30px;
}
</style>
</head>
<body>
<div class="flex-center position-ref full-height">
<div class="content">
<div class="title m-b-md">
Laravel
</div>
<div class="links">
<a href="">Documentation</a>
<a href="">Laracasts</a>
<a href="">News</a>
<a href="">Forge</a>
<a href="">GitHub</a>
</div>
</div>
</div>
</body>
</html>
Ubah scriptnya menjadi seperti dibawah ini
<!doctype html>
<html lang="{{ app()->getLocale() }}">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Laravel</title>
<!-- Fonts -->
<link href="" rel="stylesheet" type="text/css">
<!-- Styles -->
<style>
html, body {
background-color: #fff;
color: #636b6f;
font-family: 'Raleway', sans-serif;
font-weight: 100;
height: 100vh;
margin: 0;
}
.full-height {
height: 100vh;
}
.flex-center {
align-items: center;
display: flex;
justify-content: center;
}
.position-ref {
position: relative;
}
.top-right {
position: absolute;
right: 10px;
top: 18px;
}
.content {
text-align: center;
}
.title {
font-size: 84px;
}
.links > a {
color: #636b6f;
padding: 0 25px;
font-size: 12px;
font-weight: 600;
letter-spacing: .1rem;
text-decoration: none;
text-transform: uppercase;
}
.m-b-md {
margin-bottom: 30px;
}
</style>
</head>
<body>
<div class="flex-center position-ref full-height">
<div class="content">
<div class="title m-b-md">
Hello World
</div>
</div>
</div>
</body>
</html>
Terimakasih teman - teman telah membaca artikel ini mengenai Tutorial Membuat Halaman Website Pertama dengan Laravel
Semoga bermanfaat -- Salam success :)
Posting Komentar untuk "Tutorial Membuat Halaman Website Pertama dengan Laravel"