Integrasi AdminLTE 3.0.5 Laravel 7 Dan React JS

Integrasi AdminLTE 3.0.5 Laravel 7 Dan React JS  – Pada artikel kali ini kita akan membuat Integrasi AdminLTE 3.0.5 Laravel 7 Dan React JS.

 

Integrasi AdminLTE 3.0.5 Laravel 7 Dan React JS

Create Laravel Project

Buat project baru dengan nama lara7react-adminlte-3.0.5. Dari command prompt ketikkan perintah berikut:

 

Install Dependency

Dari command prompt ketikkan perintah berikut:

Selanjutnya jalankan perintah berikut:

 

Download AdminLTE 3.0.5

Selanjutnya kita download AdminLTE 3.0.5 disini:

Kemudian kita ekstrak file AdminLTE 3.0.5.zip ke directory project kita pada folder public. Setelah itu rename folder AdminLTE 3.0.5 menjadi assets.

 

Routes

Buka file web.php pada folder routers dan kemudian edit menjadi seperti berikut:

Simpan file web.php

 

app.blade.php

Buat file baru dengan nama app.blade.php pada folder resource\views dan kemudian ketikkan script berikut:

Simpan file app.blade.php

 

RouterPath.js

Selanjutnya buat file baru dengan nama RouterPath.js pada folder resources\js\components. Kemudian ketikkan script berikut:

Simpan file RouterPath.js

 

app.js

Buka file app.js pada folder resources\js kemudian edit menjadi seperti berikut:

Simpan file app.js

 

Components

App.js

Buka file App.js pada folder resources\js\components kemudian ketikkan script berikut:

Simpan file App.js

 

Templates

Buat folder baru dengan nama _layouts pada direktori resources\js\components.

Header.js

Buat file baru dengan nama Header.js pada folder resources\js\components\_layouts kemudian ketikkan script berikut:

Simpan file Header.js

 
Sidebar.js

Buat file baru dengan nama Sidebar.js pada folder resources\js\components\_layouts kemudian ketikkan script berikut:

Simpan file Sidebar.js

 
Footer.js

Buat file baru dengan nama Footer.js pada folder resources\js\components\_layouts kemudian ketikkan script berikut:

Simpan file Footer.js

 

Home.js

Buat file baru dengan nama Home.js pada folder resources\js\components kemudian ketikkan script berikut:

Simpan file Home.js

 

Blank.js

Buat file baru dengan nama Blank.js pada folder resources\js\components kemudian ketikkan script berikut:

Simpan file Blank.js

 

About.js

Buat file baru dengan nama About.js pada folder resources\js\components kemudian ketikkan script berikut:

Simpan file About.js

 

Testing Integrasi AdminLTE 3.0.5 Laravel 7 Dan React JS

Dari command prompt compile dengan menggunakan perintah berikut:

Kemudian jalankan Laravel 7 menggunakan perintah berikut:

Selanjutnya buka browser dan ketikkan URL http://localhost:8000/

Gbr1 Integrasi AdminLTE 3.0.5 Laravel 7 Dan React JS – Testing
Gbr1 Integrasi AdminLTE 3.0.5 Laravel 7 Dan React JS – Testing

Sampai sini kita sudah berhasil membuat Integrasi AdminLTE 3.0.5 Laravel 7 Dan React JS. Para artikel selanjutnya kita akan bahas Laravel 7 dan React JS lebih jauh lagi.

Semoga bermanfaat.

Source Code bisa anda download disini:

Dewaweb Gives Your Website Only the Best!

You may also like...

Leave a Reply

Your email address will not be published. Required fields are marked *