Download Source Code Aplikasi Website Portofolio
Hi teman-teman kali ini saya akan bagikan source code aplikasi website portofolio gratis kepada teman-teman yang setia dengan blog ini, aplikasi website portofolio ini dibuat dengan integrasi antara Codeigniter 3 dan template Freelancer dari Strartbotstrap.
Aplikasi website ini masih bersifat statis belum terhubung dengan database, tetapi hanya menggunakan template frontend Freelancer dengan backend Codeigniter 3.
Sebelumnya teman-teman jangan lupa untuk di sesuaikan seting base_url dengan nama foldernya di file config.php sesuai dengan nama folder di httdocs komputernya masing-masing :
$config['base_url'] = 'http://localhost/portofolio_ilmuweb/';
Berikut adalah fitur template Freecancer dari Startbotstrap :
Fitur Template Freelancer V. 7.0.6 :
1. Responsive Web Design
2. Flat Design
3. Fixed Navigation
4. Bootstrap 5.1.3
5. Mobile Friendly
6. SB Form & Validation
7. Font Awsome Icon
1. Responsive Web Design
Atau yang lebih kita kenal dengan web responsif adalah teknik yang digunakan oleh desainer web / frontend web developer membuat layout website dapat secara otomatis menyesuaikan ukuran layar pengguna, baik dari ukuran interface, gambar dan tata letak dengan lebar layar atau resolusi perangkat pengguna.
Selain mempengaruhi tampilan dengan menggunakan teknik atau tampilan yang responsive dapat meningkatkan kenyamanan pengunjung website.
2. Flat Design
Flat design merupakan bagian dari desain grafis yang cukup popular saat ini, karena tampilan desain yang sederhana, tapi tetap modern, atau bisa disebut juga dengan desain grafis yang bersifat minimalis.
Flat desain merupakan tren desain minimalis desain antarmuka (UI) ataupun desain halaman pengguna (UX) dengan menggunakan pendekatan elemen sederhana seperti icon datar, sehingga desain ini kian popular dengan konsentrasi pada pengalaman pengguna.
3. Fixed Navigation
Navigasi merupakan bagian yang penting pada sebuah aplikasi/website, dengan navigasi yang baik pengunjung akan nyaman dan mudah didalam mencari konten yang dicari.
Itulah sebabnya seorang web desainer perlu untuk memperhatikan menu navigasi pada sebuah aplikasi sehingga user dapat dengan mudah memahami produk dan layanan yang ditawarkan kepada pengunjung website.
Fixed Navigasi dimana menu navigasi akan tetap berada pada posisi atas, tanpa kita croll halaman kebawah dengan klik navigasi/ menu tersebut akan secara otomatis scroll halaman ke posisi yang ditentukan, shingga kita tidak meload kembali hamana website tersebut.
4. Bootstrap V. 5
Bootstrap 5 yang dirilis 5 Mei 2021 memiliki beberapa komponen yang telah diupdate sehingga mempermudah frontend developer mengembangkan website.
Sebagai salah satu Framework CSS populer di dunia, bootstrap khususnya versi 5 ini memiliki kelebihan mampu mempercepat proses coding serta integrasi ke website yang kita kembangkan dan berjalan dengan baik pada berbagai Framework modern saat ini.
5. Mobile Friendly
Perkembangan perangkat mobile saat ini begitu pesat sehingga pencarian website dengan menggunakan mobile begitu tinggi, karena dengan smartphone kita bisa mencari halaman website lebih mudah walaupun saat dalam perjalanan, saat mengerjakan tugas dan lainnya.
Hal tersebut lebih mudah dibanding dengan membawa laptop, sehingga webdeveloper merancang agar website kita dapat tampil dengan baik pada saat diakses menggunakan perangkat mobile sehingga dapat menjangkau user yang mengakses website dengan perangkat mobile.
6. SB Form & Validation
Adalah tampilan form yang sudah disediakan oleh template Freelancer yang menarik, kita tinggal menggunakannya tidak perlu membuat form dari awal.
7. Font Awsome Icon
Font Awsome adalah framework CSS berfungsi membuat icon ataupun simbol, dengan menggunakannya sangat membantu developer dalam membuat icon, karena tidak membuat icon secara manual, saat ini sudah masuk pada versi 6.
Adapun manfaat dan kelebihannya font awesome memiliki banyak icon gratis yang bisa kita gunakan sesuai dengan kebutuhan, ada juga yang bersifat berbayar apabila dibutuhkan, proses instalasi dan penggunaannya yang mudah tidak membutuhkan Javascript tambahan, dapat bekerja dengan framework css lain seperti dengan bootstrap, serta kompatibel dengan berbagai jenis browser, dan paling penting ringan tidak memberatkan pada saat loading website.
Baca juga artikel menarik lainya :
1. Tutorial Belajar Bootstrap: Membuat Carousel/Slideshow Dengan Bootstrap (Source Code)
2. Tutorial Belajar Bootstrap: Membuat Tombol (Button) Dengan Bootstrap
3. Cara Mudah Belajar Bootsrap Untuk Pemula
Tampilan Website Portofolio
Berikut adalah hasil tampilan website portofolio setelah kita integrasikan template Frelancer dengan Codeigniter 3 :
Dengan terintegrasi Framework Codeigniter 3 dan template Freelancer ini diharapkan dapat mempermudah teman-teman dalam mengembangkan aplikasi website portofolio dengan fitur-fitur yang menarik dengan efektif dan efisien.
Untuk lebih lengkapnya silahkan teman-teman download source codenya pada link berikut :
