Fetching data from Supabase in flutter - flutter

Question

Anyone can help me with this, I'm trying to fetch data from a table in Supabase but it's showing error on the app screen.
I want to build an app that reads the data from Supabase without any authentication, only reading and displaying the data from the table, here I'm just testing before I start building my app.
a screenshot from the main page in the app
My code in main.dart
import 'package:flutter/material.dart';
import 'package:supabase_flutter/supabase_flutter.dart';
Future<void> main() async {
WidgetsFlutterBinding.ensureInitialized();
await Supabase.initialize(
url: '[https://bougcsiwnimbmnmvwjlb.supabase.co]',
anonKey: '[eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJyb2xlIjoiYW5vbiIsImlhdCI6MTY0Mzc5NzQyOCwiZXhwIjoxOTU5MzczNDI4fQ.Ac5s-ZOyUV-2rRoP_GUuPvdt7tGNocCSq-LU-ZtBVqQ]',
);
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.red,
),
home: const MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key, required this.title}) : super(key: key);
final String title;
#override
State<MyHomePage> createState() => _MyHomePageState();
}
// SuPabase
class _MyHomePageState extends State<MyHomePage> {
Future<void> _getProfile(String name) async {
late final _usernameController ;
#override
Future<Widget> build(BuildContext context) async {
final response = await Supabase.instance.client
.from('channels')
.select()
.single()
.execute();
if (response.error != null && response.status != null) {
ScaffoldMessenger.of(context)
.showSnackBar(SnackBar(content: Text(response.error!.message)));
}
if (response.data != null) {
_usernameController = response.data!['name'] as String;
}
return Scaffold(
appBar: AppBar(title: const Text('Profile')),
body: ListView(
padding: const EdgeInsets.symmetric(vertical: 18, horizontal: 12),
children: [
Text(_usernameController,
),
],
),
);
}
}
#override
Widget build(BuildContext context) {
throw UnimplementedError();
}
}
I really appetite if anyone can help in this.

Answer 1

I think I can spot few spots that you might want to fix.
First, you want to remove the [] around your Supabase URL and Supabase anon key like this.
await Supabase.initialize(
url: 'https://bougcsiwnimbmnmvwjlb.supabase.co',
anonKey: 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJyb2xlIjoiYW5vbiIsImlhdCI6MTY0Mzc5NzQyOCwiZXhwIjoxOTU5MzczNDI4fQ.Ac5s-ZOyUV-2rRoP_GUuPvdt7tGNocCSq-LU-ZtBVqQ',
);
Also, it seemed like you had some mismatch of brackets in your widget definition. I think this is along the line of what you wanted to do:
class _MyHomePageState extends State<MyHomePage> {
String? name;
Future<void> _getProfile() async {
final response = await Supabase.instance.client
.from('channels')
.select()
.single()
.execute();
if (response.error != null && response.status != null) {
ScaffoldMessenger.of(context)
.showSnackBar(SnackBar(content: Text(response.error!.message)));
}
if (response.data != null) {
setState(() {
name = response.data!['name'] as String;
});
}
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: const Text('Profile')),
body: ListView(
padding: const EdgeInsets.symmetric(vertical: 18, horizontal: 12),
children: [
name == null ? const Text('loading') : Text(name!),
],
),
);
}
#override
void initState() {
_getProfile();
super.initState();
}
}