0% found this document useful (0 votes)
69 views3 pages

Laravel - Flutter

This document provides an example of setting up routes in Laravel to connect a Flutter mobile app to a Laravel API. It describes creating a model and controller in Laravel, defining an API route to the controller method, calling the API from a Flutter app using HTTP, and displaying the response in a Flutter ListView.

Uploaded by

hendri kusuma
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
69 views3 pages

Laravel - Flutter

This document provides an example of setting up routes in Laravel to connect a Flutter mobile app to a Laravel API. It describes creating a model and controller in Laravel, defining an API route to the controller method, calling the API from a Flutter app using HTTP, and displaying the response in a Flutter ListView.

Uploaded by

hendri kusuma
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 3

// Contoh route di Laravel

PERTAMA BUAT MODELNYA

php artisan make:model Data

<?php

namespace App\Models;

use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;

class Data extends Model


{
use HasFactory;

protected $fillable = [
'name', 'description'
];
}

php artisan make:controller DataController

<?php

namespace App\Http\Controllers;

use App\Models\Data;
use Illuminate\Http\Request;

class DataController extends Controller


{
public function index()
{
$data = Data::all();

return response()->json($data, 200);


}
}

Selanjutnya, tentukan rute API di dalam file routes/api.php:

<?php

use Illuminate\Http\Request;
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\DataController;

Route::get('/data', [DataController::class, 'index']);


================================================================== DI
routes/api.php
<?php

use Illuminate\Http\Request;
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\DataController;

Route::middleware('auth:api')->get('/user', function (Request $request) {


return $request->user();
});

// Contoh endpoint API sederhana


Route::get('/data', [DataController::class, 'index']);

====================================================================
import 'package:http/http.dart' as http;
import 'dart:convert';

Future<List<dynamic>> fetchData() async {


var url = Uri.parse('https://example.com/api/data'); // Ganti dengan URL API
Laravel Anda atau
//var response = await http.get(Uri.parse('http://192.168.1.100/api/data'));

var response = await http.get(url);

if (response.statusCode == 200) {
// Jika permintaan sukses, ubah respons JSON menjadi list di Dart
List<dynamic> data = json.decode(response.body);
return data;
} else {
// Jika permintaan gagal, lemparkan error
throw Exception('Failed to load data');
}
}

====================================================================
import 'package:flutter/material.dart';

void main() {
runApp(MyApp());
}

class MyApp extends StatelessWidget {


@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('Flutter-Laravel Connection'),
),
body: Center(
child: FutureBuilder<List<dynamic>>(
future: fetchData(),
builder: (context, snapshot) {
if (snapshot.hasData) {
// Tampilkan data dalam daftar
return ListView.builder(
itemCount: snapshot.data!.length,
itemBuilder: (context, index) {
return ListTile(
title: Text(snapshot.data![index]['name']),
subtitle: Text(snapshot.data![index]['description']),
);
},
);
} else if (snapshot.hasError) {
// Tangani jika ada error
return Text('Error: ${snapshot.error}');
}

// Menampilkan loading jika belum ada respons


return CircularProgressIndicator();
},
),
),
),
);
}
}

You might also like