DEV Community: Denyse

Exploring Python Objects: A Dive into Identity, Types, and Mutability

Denyse — Fri, 15 Mar 2024 20:45:16 +0000

Sup reader!!,

Introduction

Python, a dynamic and robust programming language, it opens the door to the captivating realm of objects. In this article, we are going to explore the fundamental concepts of identity, types, and mutability within Python's object-oriented paradigm. Mastery of these principles is essential for crafting optimized and error-free code.

What's id in Python?

In Python, the built-in function id() is a function that retrieves the unique integer representing an object's memory location. Every object in Python has a distinct identity, even if they share the same value.

What's type in Python?

In Python, the type() function is a function that reveals an object's class or type, aiding informed decisions on manipulation or interaction.

Mutable vs. Immutable Objects

In Python, mutable objects are those whose state or content can be changed after they are created whereas immutable objects are those objects that are essentially read-only any attempt to modify their content results in the creation of a
new object.

Here are the examples of mutable and immutable objects:

Mutable Objects:

Byte array
Dictionary
Set
List

Immutable Objects:

Numbers (int, float, complex)
String
Tuple
Bytes
Frozen Set

Understanding mutability is vital, as it impacts how objects behave during assignments and referencing.

Variable Assignment vs. Referencing in Python:

Assigning a value to a variable establishes a reference to the object. In Python, variables are names bound to objects, making it vital to distinguish between assignment and referencing to prevent unforeseen outcomes in your code.

Memory Storage of Immutable Objects:

Immutable objects, once initialized, remain unchangeable. A new object with the updated value is created if modifications are attempted. This approach preserves the integrity of the original object's value.

Examples with Memory Schema

Let's explore examples to understand the concepts we discussed earlier clearly.

Example 1: Immutable Object

name = "Alice"

name[0] = "B"  # Throws an error as strings are immutable.

In this example, trying to modify the first character of the string name results in an error, highlighting the immutability of strings.

Example 2: Mutable Object

colors = ["red", "green", "blue"]

colors[0] = "yellow"

Here, the first element of the list colors is successfully changed to "yellow", highlighting the mutability of lists.

Variable Value Management in Function Calls

When passing a variable to a function in Python, the mechanism used is known as "pass by assignment." This implies that the function receives a reference to the object, rather than a copy. It's essential to learn this mechanism for anticipating your function's behavior.

If you've read this far,

Streams in dart

Denyse — Sat, 02 Jul 2022 13:09:27 +0000

Sup folks, hope you are doing great 🤗, we are going to pass through many in one flutter concept 😂 concept called a stream.

Let's start with a simple case study.
Imagine yourself sitting by a creek, having a wonderful time. While watching the water flow, you see a piece of wood or a leaf floating down the stream and you decide to take it out of the water 😂 Funny right? You could even have someone upstream purposely float things down the creek for you to grab.

So we can imagine Dart in a similar way: as data flowing down a creek, waiting for someone to grab it. A stream can be like a pipe, you put a value on the one end and if there’s a listener on the other end that listener will receive that value. A Stream can have multiple listeners and all of those listeners will receive the same value when it’s put in the pipeline. The way you put values on a stream is by using a StreamController.

What are streams in dart?

A stream is a source of asynchronous data events. They provide a way to receive a sequence of events.

What can you do with a stream ?

With Dart streams, you can send one data event at a time while other parts of your app listen for those events. Such events can be collections, maps or any other type of data you’ve created.
Streams can send errors in addition to data thus you can also stop the stream, if you need to.

Important concepts of Streams in flutter

1. Stream Controller : A StreamController simplifies stream management, automatically creating a stream and sink, and providing methods for controlling a stream’s behavior. A StreamController object in Dart does exactly what the name suggests, it controls Dart Streams. The object is used to create streams and send data, errors, and done events on them. Controllers also help check a stream’s properties, such as how many subscribers it has or if it’s paused.

2. Stream Builders : StreamBuilder is a widget that uses stream operations and basically, it rebuilds its UI when it gets the new values that are passed via Stream it listens to.

StreamBuilder requires 2 parameters:

stream: A method that returns a stream object
builder: widgets that will be returned during different states of a streambuilder.

3. Sink: In Flutter Streams, a Sink is a point from where we can add data into the stream pipe.

4. Source: In Flutter Stream, a Source is a point from where we can keep listening to stream data or get the data that is been added into the stream.

How to create streams in flutter?

Let's first have a look at generators.

Generators can create sequence of values synchronously (by this we can create Iterable) and asynchronously (by this we can create Stream).
So, you can produce a stream by calling an async* function, which then returns a stream. Consuming that stream will lead the function to emit events until it ends, and the stream closes. You consume a stream either using an await for loop, which is available inside an async or async* function, or by forwarding its events directly using yield* inside an async* function.

Future<double> getRandomValue() async {
  var random = Random(2);
  await Future.delayed(Duration(seconds: 1));
  return random.nextDouble();
}

This code can be used and you’ll get a random value back once off and the function will be finished executing. This means if you want another random value you’ll have to call and await the function again. Like below.

var value1 = await getRandomValue();
var value2 = await getRandomValue();

And this is so tiresome right?

So if you want to call the function once and continuously get random values from that function without stopping it’s execution? That’s where async* and yield comes in. Hmm, interesting then lets make a function that returns a stream and every second will emit a new random value.

Stream<double> getRandomValues() async* {
    var random = Random(2);
    while (true) {
      await Future.delayed(Duration(seconds: 1));
      yield random.nextDouble();
    }
  }

Well if you are confused about the difference between the previous function and this one don't worry, let's clearly look at the differences:

The first thing to notice is that we now return a Streamand not a Future. That means instead of awaiting on the value we’ll have to subscribe to the stream.
The second difference is that async* instead of async. This tells the runtime that this code should be run asynchronously but execution will continue even after "returning" a value.
The last difference is the replacement of return with yield. This is basically a return function but it doesn't exit the function. Instead it continues executing the rest of the code after yield.

Welp, that was one way of creating streams 🤗 Tadaaa !!!!

Usually when you are creating streams, you use StreamController which holds both stream and StreamSink like below.

final streamController = StreamController<DateTime>();
    Timer.periodic(Duration(seconds: 2), (timer) {
      streamController.add(DateTime.now());
    });

Before we continue notice that we emitted a new value over a stream using add

How to use streams?

The next thing to do is to be able to get the values from a stream. This is commonly referred to as subscribing or listening to a stream. When you subscribe to a stream you will only get the values that are emitted (put onto the stream) after the subscription. You subscribe to the stream by calling the listen function and supplying it with a Function to call back to when there's a new value available, commonly referred to as a callback function, or just a callback.

streamController.stream.listen((event) {
      print(event);
    });

Managing a stream

The listen call returns a StreamSubscription of the type of your stream. We can use this to manage stream subscription. Notice that we have our subscription to the stream and it’s emitting over time. That’s great. But we’ve got a small bug with this implementation: we never disposed or cleaned up our subscription to the stream. And this means that even if the user goes to another part of our app or does something else, our app will still listen to this stream and process the results.
Basically we need to make sure there are no memory leaks. A subscription to a stream will stay active until its memory allocation is destroyed, usually the entire lifecycle of your app. This is perfectly fine in some cases and not fine in others. Let's look together how to cancel to a stream subscription.

  final streamController = StreamController<DateTime>();
    final unsubscribeAt = DateTime.now().add(Duration(seconds: 10));
    StreamSubscription<DateTime>? subscription;

    Timer.periodic(Duration(seconds: 2), (timer) {
      streamController.add(DateTime.now());
    });

    subscription = streamController.stream.listen((event) async {
      print(event);
      if (event.isAfter(unsubscribeAt)) {
        print("It's after ${unsubscribeAt}, cleaning up the stream");
        await subscription?.cancel();
      }
    });

Handling stream errors.

As we know 😂 when we are programming we often meet errors. So we are going to see how we can manage errors in our streams.

The reasons for these can be vast, but if your stream is connected for real-time updates from a server and the mobile device disconnects from the internet, then the stream disconnects as well and yields an error.

When this happens and we don’t handle the error, Flutter will throw an exception and the app can potentially be left in an unusable state.

Fortunately, it’s fairly easy to handle errors. Let’s make our stream yield an error if our seconds are divisible by three, and, for the sake of completeness, let’s also handle the event when the stream completes:

final streamController = StreamController<DateTime>();
    final unsubscribeAt = DateTime.now().add(Duration(seconds: 10));
    late StreamSubscription<DateTime> subscription;

    final timer = Timer.periodic(Duration(seconds: 2), (timer) {
      streamController.add(DateTime.now());
      if (DateTime.now().second % 3 == 0) {
        streamController.addError(() => Exception('Seconds are divisible by three.'));
      }
    });

    subscription = streamController.stream.listen((event) async {
      print(event);
      if (event.isAfter(unsubscribeAt)) {
        print("It's after ${unsubscribeAt}, cleaning up the stream");
        timer.cancel();
        await streamController.close();
        await subscription.cancel();
      }
    }, onError: (err, stack) {
      print('the stream had an error :(');
    }, onDone: () {
      print('the stream is done :)');
    });

The output will be

Bonus 🎉

What are the types of streams in dart?

There are two kinds of streams: "Single-subscription" streams and "broadcast" streams.

A single-subscription stream allows only a single listener during the whole lifetime of the stream. It doesn't start generating events until it has a listener, and it stops sending events when the listener is unsubscribed, even if the source of events could still provide more. The stream created by an async* function is a single-subscription stream, but each call to the function creates a new such stream.

Listening twice on a single-subscription stream is not allowed, even after the first subscription has been canceled.

Single-subscription streams are generally used for streaming chunks of larger contiguous data, like file I/O

A broadcast stream allows any number of listeners, and it fires its events when they are ready, whether there are listeners or not.

Broadcast streams are used for independent events/observers.

If several listeners want to listen to a single-subscription stream, use asBroadcastStream to create a broadcast stream on top of the non-broadcast stream.

Hoorraaay 😝 congrants you've read to this far. This was a lot. But hope you understand what a stream is, let's have a short recap about what we have covered.

How a basic stream works and what purpose they serve
How to clean up a subscription after we’ve used it
How to handle basic errors that come from the stream and capture them when a stream completes
Types of streams

So your task now is examine yourself and see how you can implement this in a flutter app 🔥 just give it a try.
Goodluck 🎉🎉

Flutter state management 🔥

Denyse — Fri, 24 Jun 2022 08:03:09 +0000

Sup reader!! How have you been? we going to go through different state management approaches in flutter, for sure they are a lot of state managements in flutter. We are just going through some of them. 😚 .... Tadaaaa !!

What is state management?

State management refers to the management of the state of one or more user interface controls such as text fields, OK buttons, animations, etc. in a graphical user interface. In this user interface programming technique, the state of one UI control depends on the state of other UI controls.

State management is a complex topic. If you feel that some of your questions haven’t been answered, or that the approach described in this blog is not viable for your use cases, you are probably right 😂.

Why do you need state management?

Think of an app that has two separate screens: a catalog, and a cart (represented by the MyCatalog, and MyCart widgets, respectively). It could be a shopping app, but you can imagine the same structure in a simple social networking app (replace catalog for “wall” and cart for “favorites”). You need to keep track of items that a user added to cart or favorites, the total price in cart and many other things ... So to keep track of all these events you got to manage your state using one of the state management approach.

If you’re coming to Flutter from an imperative framework (such as Android SDK or iOS UIKit), you need to start thinking about app development from a new perspective.

Many assumptions that you might have don’t apply to Flutter. For example, in Flutter it’s okay to rebuild parts of your UI from scratch instead of modifying it. Flutter is fast enough to do that, even on every frame if needed.

Flutter is declarative. This means that Flutter builds its user interface to reflect the current state of your app:

When the state of your app changes (for example, the user flips a switch in the settings screen), you change the state, and that triggers a redraw of the user interface. There is no imperative changing of the UI itself (like widget.setText)—you change the state, and the UI rebuilds from scratch.

So what are different state management approaches in Flutter ?

Bloc

A predictable state management library that helps implement the BLoC (Business Logic Component) design pattern.
This design pattern helps to separate presentation from business logic. Following the BLoC pattern facilitates testability and reusability. This package abstracts reactive aspects of the pattern allowing developers to focus on writing the business logic. Bloc makes it easy to separate presentation from business logic, making your code fast, easy to test, and reusable.

Bloc was designed with three core values in mind:

Simple: Easy to understand & can be used by developers with varying skill levels.
Powerful: Help make amazing, complex applications by composing them of smaller components.
Testable: Easily test every aspect of an application so that we can iterate with confidence.

You can use Bloc in flutter via flutter_bloc

2. Getx

A simplified reactive state management solution. It combines high-performance state management, intelligent dependency injection, and route management quickly and practically.

Three basic principles on which it is built:

Performance: focused on minimum consumption of memory and resources
Productivity: intuitive and efficient tool combined with simplicity and straightforward syntax that ultimately saves development time
Organization: decoupling business logic from view and presentation logic cannot get better than this. You do not need context to navigate between routes, nor do you need stateful widgets

You can use Getx in flutter via Getx

3. Redux

Redux is a unidirectional data flow architecture that helps a developer to develop and maintain an App easily.

Here are 4 components that redux generally contains:

Action: When an event is generated then it is represented as an action and is dispatched to the Reducer.
Reducer: When Reducer gets any update, it updates the store with a new state what it receives.
Store: When Store receives any update it notifies to the view.
View: It is recreated to show the changes which have been made.

How to use Redux in flutter?

Before using Redux, you should know that flutter SDK does not have support for Redux but by using the flutter_redux plugin, it can be implemented.

4. Provider

Provider was created by Remi Rousselet, aims to handle the state as cleanly as possible. In Provider, widgets listen to changes in the state and update as soon as they are notified.

You can use Provider via provider

5. Riverpod

A Reactive Caching and Data-binding Framework. Riverpod is a popular Flutter state management library that shares many of the advantages of Provider and brings many additional benefits. According to the official documentation: Riverpod is a complete rewrite of the Provider package to make improvements that would be otherwise impossible.

Riverpod also has 3 basic principles:

easily create, access, and combine providers with minimal boilerplate code
write testable code and keep your logic outside the widget tree
catch programming errors at compile-time rather than at runtime

You can use riverpod via riverpod

6. MobX

MobX is a battle tested library that makes state management simple and scalable by transparently applying functional reactive programming (TFRP).

The philosophy behind MobX is simple:

Straightforward: Write minimalistic, boilerplate free code that captures your intent. Trying to update a record field? Use the good old JavaScript assignment. Updating data in an asynchronous process? No special tools are required, the reactivity system will detect all your changes and propagate them out to where they are being used.
Effortless optimal rendering: All changes to and uses of your data are tracked at runtime, building a dependency tree that captures all relations between state and output. This guarantees that computations depending on your state, like React components, run only when strictly needed. There is no need to manually optimize components with error-prone and sub-optimal techniques like memoization and selectors.
Architectural freedom: MobX is unopinionated and allows you to manage your application state outside of any UI framework. This makes your code decoupled, portable, and above all, easily testable

What's my preferred state management and why? 🤔

My preferred state management is bloc🔥 why ?

Bloc is great for modularity and has an amazing documentation. Also Bloc has a bunch of extensions like bloc_concurrency, hydrated_bloc etc. That make things like caching, denouncing, throttling easy, in addition to that, error handling in bloc is amazing, you can use BlocObserver to capture changes, events or errors you can then plug Crashlytics or Sentry only in your observer and you’re good to go with logging.
I have been also using bloc in a team of many people but it was interesting how all of us seamlessly worked within a single code base following the same patterns and conventions. 🤗
Overall, Bloc attempts to make state changes predictable by regulating when a state change can occur and enforcing a single way to change state throughout an entire application.

These are some but you can find more on the Flutter. There are many state management solutions and deciding which one to use can be a daunting task. There is no one perfect state management solution! What's important is that you pick the one that works best for your team and your project.

Tadaaa!!!!

Dive deep in flutter widgets 💥

Denyse — Fri, 10 Jun 2022 07:55:19 +0000

Sup reader!, this is the second chapter in the series of flutter assuming that you have already setup your flutter editor now let's go...

If you haven't read the previous blog about introduction to flutter I strongly recommend to read it before reading this one.

Flutter is Google’s UI toolkit for crafting beautiful, natively compiled iOS and Android apps from a single code base. To build any application we start with widgets – The building block of flutter applications. Widgets describe what their view should look like given their current configuration and state. It includes a text widget, row widget, column widget, container widget, and many more.

What's a widget in flutter 🤔?

Widgets are the central class hierarchy in the Flutter framework. A widget is an immutable description of part of a user interface. Widgets can be inflated into elements, which manage the underlying render tree. Widgets themselves have no mutable state (all their fields must be final).

hunnnn, What are the types of widgets in flutter?

There are broadly two types of widgets in the flutter:

Stateless widgets is a widget that describes part of the user interface by building a constellation of other widgets that describe the user interface more concretely.
Stateful widgets are sensitive to what happens within its boundaries and gets rebuilt when a state change is detected. Conversely, Stateless widgets are not state sensitive and remain static throughout its life cycle.

okay, now you know you what a widget is, so what's next?

How do we write widgets in flutter ?

1. Write a stateless widget

class School extends StatelessWidget {
  const School({ Key key }) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return Container(
          color: const Color(0xFF2DBD3A), 
          child: Text("My school is Rwanda Coding Academy")
    );
 }
}

This will render a simple screen with a text My school is Rwanda Coding Academy

Well that was short and simple right?

2. Write a stateful widget

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key, required this.title}) : super(key: key);

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Test'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            const Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.headline4,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: const Icon(Icons.add),
      ), 
    );
  }
}

Let's see magic happening 😂

As you can see from the above image, whenever we click the button at bottom the number of times that we have clicked increases by one.

wooh, in a stateful widget you got to write a bit more lines than in stateless widgets. In a stateful widget you've got to add some more components. Well, a stateful widget is a bit complicated compared to stateless widget.

Let's talk more about a statefull widget.

First of all being a stateful widget that means that it has a mutable state. The state is information that can be read synchronously when the widget is built and might change during a widget’s lifetime. It is the responsibility of the widget implementer to ensure that the State is promptly notified when such state changes, using the State.setState method.

Here are some few concepts that you'll need to know about a stateful widget.

The concept of a state

The data used by the widget might change
The data can't be read synchronously when the widget is built. (All state must be established by the time the build method is called).

Take a close look on our stateful widget, probably you have recognized that MyHomePageclass is separate from _MyHomePageState😕 Why is that so?

The simple answer is that it's because of perfomance 🤗. How ?

Widgets are immutable. Since StatefulWidget extends Widget it therefore must be immutable too. Splitting the declaration into two classes allows both StatefulWidget to be immutable and State to be mutable.
Widgets are instantiated using the syntax new MyWidget(). If we merged both classes into one, new MyWidget() would reset all the properties of the state every time its parent update.

As for the further explanation of class _MyStatefulState extends State<MyStateful>
That is because the State class can access to it's Stateful part using the this.widget field. The generic is here to make that field of type MyStateful instead of just StatefulWidget. As you may want to access MyStateful properties.
Woww, clear now 🤗.

Lifecycle of a stateful widget

Hey, take a note on this !!!

1. createState()

When Flutter is instructed to build a StatefulWidget, it immediately calls createState(). This method must exist.

2. mounted is true

When createState creates your state class, a buildContext is assigned to that state. buildContextis, overly simplified, the place in the widget tree in which this widget is placed. All widgets have a bool this.mounted property. It is turned true when the buildContext is assigned. It is an error to call setState when a widget is unmounted.

3. initState()

This is the first method called when the widget is created (after the class constructor, of course.) initState is called once and only once. It must call super.initState()

4. didChangeDependencies()

This method is called immediately after initState on the first time the widget is built.

5. build()

This method is called often. It is required, and it must return a Widget 🤗.

6. didUpdateWidget(Widget oldWidget)

If the parent widget changes and has to rebuild this widget (because it needs to give it different data), but it's being rebuilt with the same runtimeType, then this method is called. This is because Flutter is re-using the state, which is long lived. In this case, you may want to initialize some data again, as you would in initState.

7. setState()

This method is called often from the framework itself and from the developer. Its used to notify the framework that data has changed

8. deactivate()

Deactivate is called when State is removed from the tree, but it might be reinserted before the current frame change is finished. This method exists basically because State objects can be moved from one point in a tree to another.

9. dispose()

dispose() is called when the State object is removed, which is permanent. This method is where you should unsubscribe and cancel all animations, streams, etc.

10. mounted is false()

The state object can never remount, and error will be thrown if setState is called.

Woww, wowww thanks for reading to this far 🔥 from now you can go ahead and start playing with flutter changes 😂 try writing as many as you can.
for more widgets please head to Flutter

Get started with flutter 🔥

Denyse — Sat, 28 May 2022 08:30:13 +0000

Sup !!!!, It's been a couple of days when making a dart tour, I strongly recommend to watch the previous serie before starting with this one. We are going to tackle on the key points in flutter thus give a short overview. I am now exciting to start getting our hands dirty with flutter 😊 Let's make this tour together.

What is flutter 🤔?

Flutter is an open source framework by Google and released around May 2017 it is for building beautiful, natively compiled, multi-platform applications from a single codebase.
This means that you can use one programming language and one codebase to create two different apps (mobile, web, desktop, and embedded devices).

So regarding to previous series, flutter is a framework of Dart and since Dart is exciting that means that flutter is interesting and easy to learn too 😝 woww this sounds interesting right?

What are the two main parts of flutter ?

An SDK (Software Development Kit): A collection of tools that are going to help you develop your applications. This includes tools to compile your code into native machine code (code for iOS and Android)
A Framework (UI Library based on widgets): A collection of reusable UI elements (buttons, text inputs, sliders, and so on) that you can personalize for your own needs.

moving forward ...

Why should you learn and use flutter?

I am going to select this from my own experience 😉

Flutter is simple and easy to use:

Flutter is a modern framework, and you can feel it since I've first used React native and Java it was kinda tiresome but then when I shifted to flutter booommmm 💥 things were different I didn't feel the sweetness of mobile development before using flutter 😂 . One thing that I liked is that you can build native apps without a bunch of codes.

Flutter is fast:

Being fast I mean compared to other cross-platform development applications like React Native that require bridges between their code and native elements, Flutter eliminates additional processing steps that decrease performance making it noticeably faster.

Flutter is productive:

But how does Flutter support productivity 🤔? Mainly by build-in features that go with Flutter: Widgets, Animations and Hot reload. Hot reload allows developers to see in real-time all changes they have made to an application. In that way, all concerns that arise can be efficiently managed. Significant modifications force you to reload the app. But if you do work like design, for example, and change the size of an element, it’s in real-time!! My best part 😂

Flutter is flexible:

Flexible is a built-in widget in flutter which controls how a child of base flex widgets that are Row, Column, and Flex will fill the space available to it. The Expanded widget in flutter is shorthand of Flexible with the default fit of FlexFit.

Flutter has got good documentation:

To be honest, I learnt flutter through their documentation, everything is very detailed with easy examples for basic use cases. Each time I’ve had a problem with one of my widgets in my code, I have been able to check the documentation and the answer was there

Flutter is ideal for startup MVPs:

If you want to develop your app quickly please use flutter since it is cheaper thus you don't need to develop different apps for different devices hence with flutter you will build one beatiful app for all 😊.

Flutter has got a growing community 😎 and furthermore it is supported by Vs Code 😂 our very own best Code editor.

What are the flutter principles ?

Everything is a widget!!! so because of this principle when you hear flutter, all you hear is that every one is talking about widget, so what is a widget ?

Widgets are the central class hierarchy in the Flutter framework. A widget is an immutable description of part of a user interface. Widgets can be inflated into elements, which manage the underlying render tree. Widgets themselves have no mutable state (all their fields must be final).

Composition inheritance Inheritance is the capacity of a class to inherit properties and strategies from a superclass and the's superclass, etc. It is exemplified in Dart by the @override metatag. With it, a subclass's execution of inherited conduct can be particular to be proper to its more explicit subtype.
Widget tree The widget tree is how you create your UI; you position widgets within each other to build simple and complex layouts. Since just about everything in the Flutter framework is a widget, and as you start nesting them, the code can become harder to follow.

Flutter architecture

Aside from the core concepts that we have previously discussed, Flutter delivers the basic architecture that you can apply to your application and manage its state easily. The architecture that is used in Flutter is called the Business Logic Component (BLOC). Basically, it is an event-state based approach that allows you to trigger events and handle state changes based on them. The BLOC is a good approach that separates your business logic from the user interface and oversees business logic key points by testing. The core ideas that were used for BLOC architecture are simplicity, scalability, and testability, and all these goals were definitely achieved within the BLOC architecture. But this is a very huge separate topic that we will discuss at a later date.

For more information on how to install and setup flutter editor please head to: Install and setup flutter editor

Thank you 🔥 for reading this far .. it was interesting right?
Wanna dive deep into widgets 😝 stay tuned for more articles ...
for more information about flutter please head to flutter.dev

7 Hot 🔥 features that will get you started with dart ⏭️

Denyse — Wed, 25 May 2022 05:35:42 +0000

Hello folks, In this series, this is the 3rd chapter of what to know about dart before getting started to flutter have a look :
Before that I strongly recommend the previous chapters to help you get a clear vision of what dart is...

1. Difference between const, final and var 🤔

Final means single-assignment: a final variable or field must have an initializer. Once assigned a value, a final variable's value cannot be changed. final modifies variables. Final value can only be determined at run time. Thus like when using DateTime.now() since the current date and time can only be
determined at runtime, not at compile time.
Const has a meaning that's a bit more complex 😯 and subtle in Dart. const modifies values. You can use it when creating collections, like const [1, 2, 3], and when constructing objects (instead of new) like const Point(2, 3). Here, const means that the object's entire deep state can be determined entirely at compile time and that the object will be frozen and completely immutable.
Then for var is completely mutable as its value can be reassigned at any point. final variables can only be assigned once, but by using objects, you can change the value of its fields. const variables are compile-time constants and are fully immutable; nothing about these variables can be changed once
they've been assigned.

2.Why should we use immutable data types ?

There are two primary benefits of using immutable data types which are:

It's faster. When you declare a const value, the compiler has less work to do. It only has to allocate memory for that variable once and doesn't need to worry about reallocating if the variable is reassigned. This may seem like an infinitesimal gain, but as your programs grow, your performance gain grows as well.
Immutable data does not have side effects. One of the most common sources of bugs in programming is where value is changed in one place, and it causes an unexpected cascade of changes. If the data cannot change, then there will be no cascade. And in practice, most variables tend to only be assigned once anyway, so why not take advantage of immutability?

3. String buffer in dart

The first interesting thing about strings in dart is that it's okay if you use single quotes or double quotes they both work 😝
It's probably worth mentioning another way to perform concatenation tasks, which is using the StringBufferobject. Consider the following code:

List fruits = ['Strawberry', 'Coconut', 'Orange', 'Mango', 'Apple'];
StringBuffer buffer = StringBuffer();
for (String fruit in fruits) {
 buffer.write(fruit);
 buffer.write(' ');
}
print (buffer.toString()); // prints: Strawberry Coconut Orange Mango Apple

As you can use a StringBuffer to incrementally build a string. This is better than using
string concatenation as it performs better. You add content to a StringBuffer by calling
its write method. Then, once it's been created, you can transform it into a String with the
toString method.

4. Types of parameters in dart
Dart has two types of parameters which are > named and positional parameters.

**Positional optional parameters **are those parameters that are used if you wrap your function's parameter list in square brackets [ ], then those parameters can be omitted without the compiler throwing errors. The question mark after a parameter, such as in String? name, tells the Dart compiler that the parameter itself can be null. Remember we covered this in the previous chapter 😝 so here by they are used like this:

void unnamed([String? name, int? age]) {
 final actualName = name ?? 'Unknown';
 final actualAge = age ?? 0;
 print('$actualName is $actualAge years old.');
}

One more thing to add also supports named optional parameters with curly braces. Then When calling a function with named parameters, you need to specify the
parameter name. You can call the parameters in any order; for
example, named(greeting: 'hello!');. And Dart also supports default values for parameters.

5. Closures

Closures, also known as first-class functions, are an interesting language feature that emerged from lambda calculus in the 1930s. The basic idea is that a function is also a value that can be passed around to other functions as a parameter. These types of functions are called closures, but there is really no difference between a function and a closure. Closures can be saved to variables and used as parameters for other functions. They are
even written inline when consuming a function that expects a closure as a property.
We can optimise the use of closures using typedef keyword have a look:

typedef NumberGetter = int Function();
int powerOfTwo(NumberGetter getter) {
 return getter() * getter();
}

6. Relationships between classes in dart

7. Grouping data and manipulating data in dart

Now as you are familiar with other languages you know that each language has a way to organize data, you can use one of these collections:

Lists are linear collections where the order of the elements is maintained.
Maps are a non-linear collection of values that can be accessed by a unique key.
Sets are a non-linear collection of unique values where the order is not maintained If Dart is not your first programming language, then this matrix should help you correlate collections to equivalent concepts in other languages:

One thing that these collections have in common is a subscript syntax. Subscripts are a way to quickly access elements in a collection, and they tend to work identically from language to
language.
like:

numbers[1] = 15;

Horrayyy!!!! ✈️ Thanks fo reading to this far now you're good to go with dart this marks the end of our series about the introduction to dart. Thank you 😉, stay tuned for more articles 🎉
And for further explanation please head to dart.dev.

Null safety and asynchronous programming in dart 😊

Denyse — Mon, 23 May 2022 09:12:53 +0000

Hey folks, in this series is second chapter, here we are going to go through major dart features with the assumption that you already know how to program in another language😉

As you learn Dart you have to keep these concepts in mind:

Null safety in Dart

Dart offers sound null safety, that is to say types in your code are non-nullable by default, meaning that variables can’t contain null unless you say they can. With sound null safety, Dart can protect you from null exceptions at runtime through static code analysis. Unlike many other null-safe languages, when Dart determines that a variable is non-nullable, that variable is always non-nullable. If you inspect your running code in the debugger, you’ll see that non-nullability is retained at runtime (hence sound null safety).

// In null-safe Dart, none of these can ever be null.
var i = 50; // Inferred to be an int.
String name = getFileName();
final b = Foo();

To indicate that a variable may be null you can use ?

int? aNullableInt = null;

Generally speaking, variables that have no value are null, and this may lead to errors in your code. If you have been programming for any length of time, you are probably already
familiar with null exceptions in your code. The goal of null safety is to help you prevent execution errors raised by the improper use of null. With null safety, by default, your variables cannot be assigned a null value.

So how can one use dart null safety ? 🤔
It's simple dart null safety is avaiable in Dart ^2.12 or Flutter 2 as well as Flutter 3.
But also if you want to migrate your app to null safety you can
use:

$ dart create -t console my_cli
$ cd my_cli
$ dart migrate --apply-changes

⚠️ But wait.. Before migrating your app to null safety check this first:

Wait for the packages that you depend on to migrate

//Get the migration state of your package’s dependencies, using the following command:
$ dart pub outdated --mode=null-safety

Migrate your package's code, preferably using the interactive migration tool. You can also migrate using

dart migrate

or migrate your code by hand.

Statically analyze your package’s code.

$ dart pub get
$ dart analyze

Test to make sure your changes work.

dart test

Publish ✨

If the package is already on pub.dev, publish the null-safe version as a prerelease version. 🎉 If you have reached this step kudos to you 😉

Asynchronous programming in dart

Asynchronous operations let your program complete work while waiting for another operation to finish. There are some common asynchronous operations which are :

Fetching data over a network.
Writing to a database.
Reading data from a file.

It works in situations when you are searching for straightforwardness over productivity. To deal with basic and autonomous information, asynchronous programming is an extraordinary decision.

Why should we use asynchronous programming 🤔

Improvement in performance and responsiveness of your application, especially when you have long-running activities that don’t need to block the execution. For this situation, you can perform other work while waiting for the outcome from the long-running undertaking.
Assemble your code in a flawless and comprehensible manner fundamentally better than the standard code of the conventional thread creation and taking care of it with async / await , you compose less code and your code will be more viable than utilizing the past asynchronous programming strategies like utilizing plain assignment.

Such asynchronous computations usually provide their result as a Future or, if the result has multiple parts, as a Stream. These computations introduce asynchrony into a program. To accommodate that initial asynchrony, other plain Dart functions also need to become asynchronous.

To interact with these asynchronous results, you can use the async and await keywords. Most asynchronous functions are just async Dart functions that depend, possibly deep down, on an inherently asynchronous computation.

hummm, Then what's a future in dart?

A future represents the result of an asynchronous operation, and can have two states: uncompleted or completed

So how can you work with futures ?

The async and await keywords provide a declarative way to define asynchronous functions and use their results. Remember these two basic guidelines when using async and await:

To define an async function, add async before the function body:
Here is an example
The await keyword works only in async functions.

void main() async {
await flutter();
print('flutter Devs done');
}

KUDOSS ✈️, you are now capable of some of the major concepts in dart

For more details about the null safety and asynchronous programming please head to dart.dev
Thank you 🎉

A brief introduction to Dart

Denyse — Sat, 21 May 2022 06:37:12 +0000

Hey folks 👋 I am Denyse, this series is first chapter I want to write about flutter in the future i'll write more and more cool things about Dart and Flutter we'll spend a little time to take a look into Dart programming languages.
I wanted to jump straight to flutter ... but wait 🤔 I couldn't talk about flutter without talking about dart first

So what is Dart?

Dart is a programming language designed for client development, such as for web and mobile apps. It is designed by a huge and powerful company ✨ company called Google and also can be used to build server and desktop applications. It is a class-based, garbage-collected language with C-style syntax.
Dart is a client-optimized language for developing fast apps on any platform. Dart was created by Google and first time it appeared was October 10, 2011.

Fun fact about it 😂, first stable version of Dart wasn't 1.0.0, it was 0.8.10-rev.3.29803.

In Dart SDK Tools contain these tools that necessary for development applications:

DartVM - Dart Virtual Machine.
dart2js- Dart to javascript (web use only) for deployable Javascript.
dartdevc - Dart to javascript(web use only) for testing purpose.
dartfmt - Tools formatter dart code
dartanalyzer - Tools help analyze warning and error code that are specified in dart language. DartPad and IDEs such as Android Studio or VS Code are use the same analysis engine that dartanalyzer provide
DartDoc - The API documentation generator (using for write package mostly)
pub - Dart package manager (it's like npm or yarn or pnpm). We can use pub tools for manage Dart packages.

What do we mean by Dart fast apps , here we mean Dart's speed to mean Dart can compile at both Run time(JIT) and Ahead of Time (AOT)

What is AOT or JIT ?

The JIT means or development mode Flutter provide cools features which are hot-reload and hot-restart 😊 that help you see UI changes when you change on code. With that is lots of tools that help you debug.
The AOT or release mode your code is compiled to native code for better performance, minimum app size and remove other stuff that useful in dev mode.

Wanna know more about dart? head to Dart documentation and stay tuned to get more updates about flutter and dart ...