FLUTTER & STRIPE Charity App FULL TUTORIAL & Backend Setup | Clean Architecture, Bloc, Dio, Firebase
In this comprehensive tutorial, we’ll build a complete charity fundraising app from scratch using Flutter, complete with a backend setup. This app allows users to browse fundraisers, search and filter collections, and make secure donations through Stripe.
Here’s what you’ll learn in this video:
Setting up Firebase for user authentication with Google Sign-In.
Configuring a backend with Node.js and MongoDB.
Using Clean Architecture principles to structure the app.
Integrating Stripe for seamless payments.
Implementing BLoC for scalable state management.
Adding filters, search functionality, and pagination.
Designing a dynamic UI with custom themes and widgets.
Building features like donation history and detailed collection pages.
We’ll also guide you through setting up the backend, including MongoDB, Stripe CLI, and Firebase configuration. By the end of this video, you’ll have a fully functional charity app and a solid understanding of best practices in Flutter development.
Disclaimer: The code provided in this video is for educational purposes only. Commercial use without proper licensing is prohibited.
📂 Full Project Code:
📲 DM me "code charify" on Instagram: / devv1be
📂 Backend Code:
📲 DM me "code charify_backend" on Instagram: / devv1be
💡 Chapters:
0:00 Introduction
1:14 Firebase Setup
2:14 Stripe Setup
3:06 Importing dependencies
4:30 Connecting Firebase
7:30 Setup SHA keys
8:45 Either Model
10:25 Failure Model
11:15 User entity
14:00 Auth Repository
14:50 Auth Datasource
16:20 Auth Repository Impl
20:00 Importing assets
21:54 Theme Setup
26:46 Default Button
29:37 Auth Page
31:14 Go Router
33:22 Auth Page
37:30 User Bloc
42:08 Get It (Dependency Injection)
43:16 Api Client
50:00 User Repository & Datasource
54:10 Token Interceptor
59:40 Splash Page
1:03:03 Main Page
1:10:16 Log Out
1:15:07 Application Entity
1:19:05 Application Repository & Datasource
1:20:14 Category Entity
1:21:07 Category Repository & Datasource
1:30:17 Main Bloc
1:52:46 Main Page
2:51:52 Single Application Page
2:54:32 Single Application Bloc
3:01:10 Single Application Page
3:23:45 Payment Page
3:25:11 Payment Repository & Datasource
3:29:06 Payment Bloc
3:35:01 Stripe Setup
3:36:40 Payment Page
4:00:00 Donation Entity & User donations
4:09:20 History Repository & Datasource
4:14:30 History Page
4:15:12 History Page
4:22:35 History Page
4:37:32 Bugs fixing
4:40:00 Final Testing
4:41:24 Backend Setup
4:46:00 Finalizing
If you have questions or want detailed explanations of specific parts, let us know in the comments!
👍 Don’t forget to like, share, and subscribe for more tutorials!