Welcome to my Flutter and Dart learning journey! This README serves as a log to track my daily progress as I explore and improve my skills in app development using Flutter and Dart. Feel free to follow along or provide any feedback.
- Learn basic Dart and its syntaxes.
- Build a basic Flutter app
- Understand state management in Flutter
- Explore UI design with Flutter widgets
- Create a simple CRUD app using Flutter and Dart
Today's Progress:
- Set up Flutter development environment and Installation
- Created my first Dart program
- Explored basic Dart Datatypes like String, Integers, Booleans
Thoughts: Getting started was exciting! Dart's syntax feels familiar like C++ and Java syntax.
Link to Code: Day 1 Code
Today's Progress:
- Started with Loops in Dart
- Taking User Inputs in Dart
- Started using List Data Structure in Dart
- Learned to run Dart program in Terminal rather than Debug Console.
- Solved two question of List but was struggling with dividion operator as we have int as data type and division gives double as output but then discovered this ~/ truncated division operator that worked 🥳🥳
Thoughts: Consistency is important and will try to mantain the consistency
Today's Progress:
- Got to know about ?? in Dart. It Called also null operator. This operator returns expression on its left, except if it is null, and if so, it returns right expression.
- Started with HashMaps in Dart.
- Wrote Basic Array element frequency code. [PS - C++ is better in Dart all those null value errors and type checks make things horrible]
- Solved 2 question on HashMaps [Twice_Counter and Word_With_Max_Freq]
- Learnt Sorting of HashMaps on Value.
Thoughts: Getting resources on Data Structures in Dart is damn difficult. But somehow articles and blogs help me a lot
Today's Progress:
- Started learning Sets in Dart
- Solved 2 Problems in Set - Common Sum and Distinct Difference
- Made problems user input centric and tested for different testcases too.
Thoughts: Today it was easy to find things and getting accquainted to the learning process.
Today's Progress:
- Learned about Classes and Object in Dart.
- This helped me deign Node Class for LinkedList.
- Created basic code for Insertion at Beginning and Insertion at End in Dart.
- Solved 2 Questions Reverse LinkedList and Find Nth Node from End.
- Also did basics of Stack and Queue in Dart
Thoughts:
- To start of with LinkedList was a bit tough. Got to serach for proper source but then it became easier to code.
Today's Progress:
- Learned about different Folders in a dart project and what happens in each of them.
- Tried to play around with the main.dart file which is the starting point of the flutter app
Thoughts:
- It was nice to start with flutter and run the basic app on emulator.
Today's Progress:
- main.dart is parsed from top to bottom when we run the project.
- the parsed code is compiled to target platform code some native android code or IOS Code.
- Tried to write the main.dart from scratch.
- runApp() is the funcetion that starts the app and its main function is to show some UI on the screen
- We can Manage 3rd party dependencies in the pubspec.yaml files
- For rendering UI on Flutter App we Use Widgets
- Explored Flutter Widget Catalogue and tried the basic text widget
Thoughts:
- Emulator is giving me some issue need to fix that rest all was pretty good !!
Today's Progress:
- Last App was just using Single Widget the Text() Widget.
- Now i tried using Nested widgets like scaffold, Container, Box Decoration, Center etc for
- Tried Adding Gradients, Font Size, Font Weight
This is how the image looks
Thoughts:
- Ui building is Fun but encounterd some errors too.
Today's Progress:
- Learnt to make Custom Widgets and use them into code.
- We can use these Widgets as reusable widgets.
- Tried Making the Linktree Clone in UI aspect in Flutter
- Used Widget Nesting, Learnt adding Network Images, Using Google Fonts, Custom Widgets, Scaffold, Column etc Widgets.
Thoughts:
- This is same as the React.js component reusing and quite similar too. UI Building in Flutter is a bit Tough
Today's Progress:
- Learned to make Buttons and redirect them to a website. any External Links.
- Tried Nesting widgets like InkWell, Containers, etc on child and children modes.
- Made the UI a bit more good looking.
Thoughts:
- Flutter seems a bit difficult UI wise but still googling and finding stuff on internet helps me a lot.
Today's Progress:
- Splitting of Code into readable packages was implemented in both projects. Thoughts:
- Got into some erros but perished to integrate all splitted components.
Today's Progress:
- Learned about making Custom Widgets and how to use them in code.
- Learneabout a new Data Type the Dynamic Datatype. This is like it doesnot know abiut the datatype and evaluates it at run time
- Learned about using class and its constructor to reuse compnents and make them more dynamic.
Today's Progress:
- Learned About Buttons, Column widgets
- Anonymous functions for the onPressed feature of Button.
- Types of Buttons - TextButton, OutlinedButton and ElevatedButtons
- Learned about MainAxix.min for the Column Widget Sizing
- .StyleFrom() helps you to override the default styles
- Introduction to Stateful Widget and how to use them.
- Learnt about SetSate()
Today's Progress:
- Learnt Using the random() function and completed the Roller Application.
Today's Progress:
- Completed Dice Roller Application and added animation to it.
Today's Progress:
- Started with the Quiz App as instructed in the course.
- Created the very First Screen by myself.
Today's Progress:
- Completed the First Screen and learnt abot adding Opacity to images, Overlay colors to an image
Today's Progress:
- Deepdived into conditional rendering of components. State and its rendering
- Learned about State Uplifting anf moving from one screen to another.
Today's Progress:
- Learned about Ternary Operator and how we use it to conditionally render content.
- Render content render conditionally using if-statement
- Progressed with further screens in Quiz App
Today's Progress:
- Moved on wih the Quiz app and created reusable components like Options menu, Question Screen
- applied the Constructor methods for reusing components and passing values to them
Today's Progress:
- Studied State Lifecycle
- Got to know about Mapping and spread operator in Flutter.
- Used map() to render answerButton Dynamically
Today's Progress:
- Moved along with the course and learned about shuffling a list and preserve the order so that we can identify correct answers.
Today's Progress:
- Improved the styling of the overall aplication and worked on State uplifting of the Answers Component
- Applied External Google Fonts in the application
- Added the next question feature when any answer is chosen
Today's Progress:
- Completed the selection of answer logic where we are passing functions from onw widget to another just as we do with props in react.
- Designed the basic Result Screen and will be working on the Summary of the result screen.
- Used States widely within the project.
-
Create State Method: When a Stateful Widget is created, the createState method is called, which creates an associated State object.
-
Init State Method: After the State object is created, the initState method is called. This method is used for initializing the widget before it is built. It's called every time a state is created.
-
Build Method: The build method is responsible for creating the UI of the widget. It returns a widget tree that defines how the widget should look. This method is called whenever the widget needs to be rebuilt, such as when the state changes.
-
Dispose Method: The dispose method is called when the widget is removed from the widget tree or when it's no longer needed. Developers can use this method to clean up resources and perform necessary cleanup tasks.
-
Set State Method: The setState method is a critical part of the Flutter Stateful Widget. When called, it informs Flutter that the widget's internal state has changed, and it should be rebuilt. This is how developers update the UI in response to user interactions or data changes.
-
Did Update Widget Method: The didUpdateWidget method is called when a widget's parent rebuilds and supplies a new configuration. Developers can use this method to respond to changes in the widget's properties.
-
Did Change Dependencies Method and Deactivate Method: These methods are rarely used in Flutter and are typically only utilized by the Flutter SDK or certain plugins.
- Flutter Documentation
- Dart Documentation
- Flutter Community
- Awesome Flutter
- Article on What are ??, ??=, ?., …? in Dart
- Border to a Container
Feel free to connect with me on Twitter or LinkedIn.
- ✅ Completed
- 🚧 In Progress
- ❌ Not Started