Hey everyone! Today, we’re tackling the most requested Firebase integration: Auth and Firestore are still dominating for quick, scalable backends. We’ll build a Notes app with email/password login and real-time Firestore sync while fixing common setup headaches along the way.
Watch the FULL Tutorial here: <a href="https://youtu.be/PaRqtZ9z-YI" target="_blank" rel="noopener nofollow">https://youtu.be/PaRqtZ9z-YI</a>
<h2>Set up and Why?</h2>
Why Firebase now? Real-time data, offline persistence, and auth in minutes - plus emerging AI tools like Firebase Genkit.
Setup:
<ol>
<li>
Go to <a href="https://console.firebase.google.com" target="_blank" rel="noopener nofollow">console.firebase.google.com</a> → Create a New Firebase project.
</li>
<li>
Click on add app → Select Flutter → Follow through the process
<img src="https://dev-to-uploads.s3.amazonaws.com/uploads/articles/j9ffjwwr1r4owlphw27m.png" alt="Add Firebase to your Flutter App">
</li>
<li>
Enable Auth methods (Email &amp; Password) and Firestore in the console.
<img src="https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hvgodl5w54dgs3rw94x9.png" alt="Firebase Authentication">
</li>
</ol>
Start with a new project or your counter app: <code>flutter create firebase_notes</code>.
pubspec.yaml:
<pre><code class="language-yaml"> firebase_core: ^4.3.0
 firebase_auth: ^6.1.3
 cloud_firestore: ^6.1.1
</code></pre>
<code>flutter pub get</code>.
Initialize Firebase (main.dart):
<pre><code class="language-dart">import &#x27;package:flutter/material.dart&#x27;;
import &#x27;package:flutter_firebase_tutorial/firebase_options.dart&#x27;;

void main() async {
 WidgetsFlutterBinding.ensureInitialized();

 await Firebase.initializeApp(options: DefaultFirebaseOptions.currentPlatform);

 runApp(const MyApp());
}
</code></pre>
Generate firebase_options.dart via FlutterFire CLI: <code>dart pub global pub global activate flutterfire_cli</code> then <code>flutterfire configure</code>.
Auth screen (login_signup.dart):
<pre><code class="language-dart">import &#x27;package:firebase_auth/firebase_auth.dart&#x27;;
import &#x27;package:flutter/material.dart&#x27;;
import &#x27;package:flutter_firebase_tutorial/home.dart&#x27;;

class LoginSignUp extends StatefulWidget {
 const LoginSignUp({super.key});

 @override
 State&lt;LoginSignUp&gt; createState() =&gt; _LoginSignUpState();
}

class _LoginSignUpState extends State&lt;LoginSignUp&gt; {
 final TextEditingController _emailController = TextEditingController();
 final TextEditingController _passwordController = TextEditingController();

 @override
 Widget build(BuildContext context) {
 return Scaffold(
 appBar: AppBar(title: Text(&#x27;Login SignUp Screen&#x27;)),
 body: Column(
 children: [
 Text(&#x27;Login SignUp Screen&#x27;),

 TextFormField(
 controller: _emailController,
 keyboardType: TextInputType.emailAddress,
 ),
 SizedBox(height: 16.0),
 TextFormField(controller: _passwordController, obscureText: true),
 SizedBox(height: 16.0),
 ElevatedButton(
 child: Text(&quot;Login&quot;),
 onPressed: () async {
 String email = _emailController.text.trim();
 String password = _passwordController.text.trim();

 try {
 // Try to sign in
 await FirebaseAuth.instance
 .signInWithEmailAndPassword(
 email: email,
 password: password,
 )
 .then((c) {
 if (!context.mounted) return;
 Navigator.push(
 context,
 MaterialPageRoute(builder: (_) =&gt; HomeScreen()),
 );
 });
 } on FirebaseAuthException catch (e) {
 if (e.code == &#x27;user-not-found&#x27;) {
 // If user not found, create a new account
 await FirebaseAuth.instance.createUserWithEmailAndPassword(
 email: email,
 password: password,
 );
 } else {
 // Handle other errors
 print(&#x27;Error: $e&#x27;);
 }
 }
 },
 ),
 SizedBox(height: 16.0),
 ElevatedButton(
 child: Text(&quot;Sign Up&quot;),
 onPressed: () async {
 String email = _emailController.text.trim();
 String password = _passwordController.text.trim();

 try {
 // Try to sign in
 await FirebaseAuth.instance
 .createUserWithEmailAndPassword(
 email: email,
 password: password,
 )
 .then((v) {
 if (!context.mounted) return;
 Navigator.push(
 context,
 MaterialPageRoute(builder: (_) =&gt; HomeScreen()),
 );
 });
 } on FirebaseAuthException catch (e) {
 if (e.code == &#x27;user-not-found&#x27;) {
 // If user not found, create a new account
 await FirebaseAuth.instance.createUserWithEmailAndPassword(
 email: email,
 password: password,
 );
 } else {
 // Handle other errors
 print(&#x27;Error: $e&#x27;);
 }
 }
 },
 ),
 ],
 ),
 );
 }
}
</code></pre>
Firestore: Collection ‘notes’ per user (users/{uid}/notes).
Stream notes:
<pre><code class="language-dart">FirebaseFirestore.instance
 .collection(&#x27;users&#x27;)
 .doc(uid)
 .collection(&#x27;notes&#x27;)
 .snapshots()
</code></pre>
Add notes:
<pre><code class="language-dart">await FirebaseFirestore.instance
 .collection(&#x27;users&#x27;)
 .doc(uid)
 .collection(&#x27;notes&#x27;)
 .add({&#x27;title&#x27;: title, &#x27;content&#x27;: content, &#x27;timestamp&#x27;: FieldValue.serverTimestamp()});
</code></pre>
Full Code (update the field where necessary). UI: ListView.builder with StreamBuilder.
<pre><code class="language-dart">import &#x27;package:cloud_firestore/cloud_firestore.dart&#x27;;
import &#x27;package:firebase_auth/firebase_auth.dart&#x27;;
import &#x27;package:flutter/material.dart&#x27;;

class HomeScreen extends StatefulWidget {
 const HomeScreen({super.key});

 @override
 State&lt;HomeScreen&gt; createState() =&gt; _HomeScreenState();
}

class _HomeScreenState extends State&lt;HomeScreen&gt; {
 User? user = FirebaseAuth.instance.currentUser;
 final db = FirebaseFirestore.instance;
 final TextEditingController _textController = TextEditingController();

 @override
 Widget build(BuildContext context) {
 return Scaffold(
 appBar: AppBar(title: Text(&#x27;Home Screen&#x27;)),
 body: Column(
 children: [
 Text(&#x27;Home Screen&#x27;),
 Expanded(
 child: StreamBuilder&lt;QuerySnapshot&gt;(
 stream: db
 .collection(&#x27;texts&#x27;)
 .doc(user!.uid)
 .collection(&#x27;user_texts&#x27;)
 .snapshots(),
 builder:
 (
 BuildContext context,
 AsyncSnapshot&lt;QuerySnapshot&gt; snapshot,
 ) {
 if (snapshot.hasError) {
 return Text(&#x27;Error: ${snapshot.error}&#x27;);
 }
 if (snapshot.connectionState == ConnectionState.waiting) {
 return Center(child: CircularProgressIndicator());
 }
 final data = snapshot.requireData;
 return ListView.builder(
 itemCount: data.size,
 itemBuilder: (context, index) {
 return ListTile(title: Text(data.docs[index][&#x27;text&#x27;]));
 },
 );
 },
 ),
 ),
 ],
 ),
 floatingActionButton: FloatingActionButton(
 onPressed: () {
 showModalBottomSheet(
 context: context,
 builder: (context) {
 return Container(
 color: Colors.white,
 child: Column(
 children: [
 SizedBox(height: 16.0),
 TextFormField(
 maxLines: 4,
 controller: _textController,
 decoration: InputDecoration(labelText: &#x27;Enter some text&#x27;),
 ),
 SizedBox(height: 16.0),
 ElevatedButton(
 child: Text(&quot;Submit&quot;),
 onPressed: () {
 String enteredText = _textController.text;
 print(&#x27;Entered Text: $enteredText&#x27;);
 db
 .collection(&#x27;texts&#x27;)
 .doc(user!.uid)
 .collection(&#x27;user_texts&#x27;)
 .add({&#x27;text&#x27;: enteredText});
 _textController.clear();
 Navigator.pop(context);
 },
 ),
 ],
 ),
 );
 },
 );
 },
 child: Icon(Icons.add),
 ),
 );
 }
}
</code></pre>
Basic Firestore Rules
<pre><code>rules_version = &#x27;2&#x27;;
service cloud.firestore {
 match /databases/{database}/documents {
 match /users/{userId}/{document=**} {
 allow read, write: if request.auth != null &amp;&amp; request.auth.uid == userId;
 }
 }
}
</code></pre>
That’s all! Test the app and see how it works.
I hope you’ve learn something incredible. Press that follow button if you’re not following me yet. Also, make sure to subscribe to the newsletter so you’re notified when I publish a new article.
🔗 Let’s Connect 🔗 → <a href="https://github.com/techwithsam" target="_blank" rel="noopener nofollow">Github</a> | <a href="https://twitter.com/techwithsam_" target="_blank" rel="noopener nofollow">Twitter</a> | <a href="https://www.linkedin.com/in/techwithsam/" target="_blank" rel="noopener nofollow">LinkedIn</a>.
Join my Community 👨‍💻👨‍💻 on Discord.
Subscribe to my <a href="https://youtube.com/@techwithsam" target="_blank" rel="noopener nofollow">YouTube channel</a>.
Happy Building! 🥰👨‍💻

Flutter Firebase Tutorial 2026: Complete Auth + Firestore Integration (Simple Notes App) 🔥