Flutter 3.0 & Rest API build a fully functional News app from scratch using 2 different Rest APIs
What you will learn
This Flutter course is a complete guide that helps learn and build a fully functioning Flutter application with Rest Api.
Rest API integration
CRUD operations
Teaching how to write Clean-code and avoid Boilerplate code
A fully functional app that is ready for use and deployment
Firebase real-time database Rest API
Description
This course cover how to make a Fully Functional app for Android in portrait mode. Moreover it also cover how to integrate the Rest API in a Flutter application.
The used API’s are:
- News Rest API
- Firebase real-time database Rest API
Course prerequisites:
- Basic knowledge in programming to get started
- Basic knowledge of Flutter and a good knowledge is recommended
How this course can be of help:
- Gaining more knowledge in Flutter and Rest API integration
- Http requests
- Json serialization
- Search using query, and get the results directly from the API
- Sorting by
- Pagination
- Add to Bookmarks
- Error Handling
- Learn how to make a News app with clear design
- A fully functional app that is ready for use and deployment
What’s in the course:
- Complex UI has done simply
- Provider State management
- Firebase Real-time database Rest API
- Clean code and avoid Boilerplate code
- State Management: setState, lifting state up via callbacks, global access, scoped access with Provider and ChangeNotifier
- Navigation & Custom navigation
- Animated Navigation
- Animation
- Managing and updating packages
- ListViews and multiple UI states
- Dart Programming Language – Fundamentals and intermediate&expert topics
- How to understand Flutter Mobile Development by building apps incrementally.
- How to design, build, debug Flutter apps
- How to get Flutter apps to communicate with a real-time database
- How to build robust apps with Flutter
- Flutter AppBar
- Flutter Material Design
- Flutter Row and Column
- Flutter ListView Builder
- Payment gateway
Course structure:
approximately 7 hours of content and updated regally
Requirements:
- Windows application development OR Mac application development
- Access to a computer with an internet connection.
- and you are ready for the journey
- Love learning about applying cutting-edge algorithms to practical cases!
What Should I Expect After this Course?:
- The ability to build a fully functional apps
- New information regarding Flutter And API integration
Note that the course builds on windows, so I didn’t have a chance to cover the IOS configurations! But feel free to ask anything about it. I will be there to help.
English
language
Content
Introduction
Introduction – About The Course&About Me&Couse requirements
App overview
Hints and tricks
Source code on Github
Reach me
Start coding
Setting up the Theme and app structure and starter source code on github
Create the drawer widget design
Add custom fonts, and finish the Appbar design
Start implementing the main screen tabs
Finish the tabs implementation
Implement the pagination buttons
Implement the pagination numbers widget
Finish the pagination control
Implement the dropdown Button
Implement the articles widget part 1
Finish the articles widget
Implement the article loading widget (Shimmer effect)
Finish the top trending widget
Finish the top trending shimmer effect widget
Implement the navigation with transition to the search screen
Imepelment the search screen top widgets
Implement the search suggestions widget
Implement the no results screen
Implement the Bookmarks screen
Show news details in a Webview widget
Add leading icon to navigate to the previous screen (Home screen)
Implement the modal bottom sheet in the webview screen
Implement the refresh webview method
24- Implement the Share Function
24- Implement the open in a browser Function
Create an error dialog
In app news details
Rest API
What is Rest API?
News rest api walkthorugh
Use the Postman to make request and generate dart model class
Create the news model class with Json serialization
Integrate the Rest api in our application
Appending the Rest api results to the model class
Enhance the get all news method with url segmentation
Start displaying the news in our app
Use the FutureBuilder aproach in order to fetch the news from the Rest Api
Display the other news details, and open the correct URL for the webView
Calculate the article reading time
Show the date in the Formatted way
Error handling
Enhance the error handling method
Handle errors using the status code
State management & Rest Api
Why do we need state management in this app?
Get started with the state management
Avoid using the dependency injection
Implement the pagination
Allow the user to sortBy the news
Display the correct news details in the news details screen
Implement the share method in the news details screen
Get the top headlines from the API and display it correctly on the screen
Implement the image HERO animation
Allow the user to search, and get the results from the api
Extra – Rest Api – Advanced to Expert
Get started with the Firebase Rest API
Create the Bookmarks model class
Send dummy data to Firebase real-time database using the Post method
Save the news data in the Firebase real-time database
Allow the user to delete from the Real-Time database
Start fetching the bookmarks data, and fix the deletion issue
Fetch and display bookmarks on the screen.mp4
Check if the current News is already in the bookmarks
Importance of the NotifyListener
Fix the delete function and finalize the app
Extra
Change the app launcher icon
Native splash screen