{"componentChunkName":"component---src-templates-post-post-tsx","path":"/blog/ml-in-flutter","webpackCompilationHash":"fe35ccc6182ca6999393","result":{"data":{"markdownRemark":{"id":"73a795f8-4137-5957-a3e3-aed978d759f7","html":"

What is Machine Learning?

\n

Machine learning is a branch of artificial intelligence (AI) focused on building applications that learn from data and improve their accuracy over time without being programmed to do so.

\n

In flutter with help of ML Kit we can integrate our app with various smart features such as:

\n\n

To enable the use of ML Kit we need to connect the app with the firebase. We will be using two dependencies firebase_ml_vision: ^0.9.7\nfor ML Kit and image_picker: ^0.6.7+11 to get the image using a gallery or camera.

\n

Let's Start

\n

Configure your app

\n\n

Creating UserImagePicker Class:

\n

ImagePicker is one of the most frequently used functionality when we try to get the user images as an input to perform authentication, profile image upload, etc. This widget provides us the flexibility to chose images from our phone gallery or using a phone camera. Here also we are trying to achieve the same.

\n\n
void _pickImage(ImageSource imageSource) async {\n  final pickedImageFile = await picker.getImage(\n    source: imageSource,\n  );
\n\n

This container with rounded corners shows the image picked by the user. If there is no image then Please Add Image text will be displayed in the center.

\n
Padding(\n  padding: const EdgeInsets.all(18.0),\n  child: ClipRRect(\n    borderRadius: BorderRadius.circular(10),\n    child: Container(\n      color: Colors.orangeAccent.withOpacity(0.3),\n      width: MediaQuery.of(context).size.width,\n      height: 300,\n      child: _pickedImage != null\n          ? Image(\n              image: FileImage(_pickedImage),\n            )\n          : Center(\n              child: Text("Please Add Image"),\n            ),\n    ),\n  ),\n),
\n\n

On pressing FlatButton.icon a AlertDialog will appear that will contain two options to choose from the image source.

\n
FlatButton.icon(\n  onPressed: () {\n    showDialog(\n        context: context,\n        builder: (_) {\n          return AlertDialog(\n            title: Text(\n              "Complete your action using..",\n            ),\n            actions: [\n              FlatButton(\n                onPressed: () {\n                  Navigator.of(context).pop();\n                },\n                child: Text(\n                  "Cancel",\n                ),\n              ),\n            ],\n            content: Container(\n              height: 120,\n              child: Column(\n                children: [\n                  ListTile(\n                    leading: Icon(Icons.camera),\n                    title: Text(\n                      "Camera",\n                    ),\n                    onTap: () {\n                      _pickImage(ImageSource.camera);\n                      Navigator.of(context).pop();\n                    },\n                  ),\n                  Divider(\n                    height: 1,\n                    color: Colors.black,\n                  ),\n                  ListTile(\n                    leading: Icon(Icons.image),\n                    title: Text(\n                      "Gallery",\n                    ),\n                    onTap: () {\n                      _pickImage(ImageSource.gallery);\n                      Navigator.of(context).pop();\n                    },\n                  ),\n                ],\n              ),\n            ),\n          );\n        });\n  },\n  icon: Icon(Icons.add),\n  label: Text(\n    'Add Image',\n  ),\n)
\n

Your UserImagePicker.dart file will look like this:

\n
import 'dart:io';\n\nimport 'package:flutter/material.dart';\nimport 'package:image_picker/image_picker.dart';\n\nclass UserImagePicker extends StatefulWidget {\n  UserImagePicker(\n    this.imagePickFn,\n  );\n\n  final void Function(File pickedImage) imagePickFn;\n\n  @override\n  _UserImagePickerState createState() => _UserImagePickerState();\n}\n\nclass _UserImagePickerState extends State<UserImagePicker> {\n  File _pickedImage;\n  ImagePicker picker = ImagePicker();\n\n  void _pickImage(ImageSource imageSource) async {\n    final pickedImageFile = await picker.getImage(\n      source: imageSource,\n    );\n\n    setState(() {\n      _pickedImage = File(pickedImageFile.path);\n    });\n    widget.imagePickFn(File(pickedImageFile.path));\n  }\n\n  @override\n  Widget build(BuildContext context) {\n    return Column(\n      children: <Widget>[\n        Padding(\n          padding: const EdgeInsets.all(18.0),\n          child: ClipRRect(\n            borderRadius: BorderRadius.circular(10),\n            child: Container(\n              color: Colors.orangeAccent.withOpacity(0.3),\n              width: MediaQuery.of(context).size.width,\n              height: 300,\n              child: _pickedImage != null\n                  ? Image(\n                      image: FileImage(_pickedImage),\n                    )\n                  : Center(\n                      child: Text("Please Add Image"),\n                    ),\n            ),\n          ),\n        ),\n        SizedBox(\n          height: 10,\n        ),\n        FlatButton.icon(\n          onPressed: () {\n            showDialog(\n                context: context,\n                builder: (_) {\n                  return AlertDialog(\n                    title: Text(\n                      "Complete your action using..",\n                    ),\n                    actions: [\n                      FlatButton(\n                        onPressed: () {\n                          Navigator.of(context).pop();\n                        },\n                        child: Text(\n                          "Cancel",\n                        ),\n                      ),\n                    ],\n                    content: Container(\n                      height: 120,\n                      child: Column(\n                        children: [\n                          ListTile(\n                            leading: Icon(Icons.camera),\n                            title: Text(\n                              "Camera",\n                            ),\n                            onTap: () {\n                              _pickImage(ImageSource.camera);\n                              Navigator.of(context).pop();\n                            },\n                          ),\n                          Divider(\n                            height: 1,\n                            color: Colors.black,\n                          ),\n                          ListTile(\n                            leading: Icon(Icons.image),\n                            title: Text(\n                              "Gallery",\n                            ),\n                            onTap: () {\n                              _pickImage(ImageSource.gallery);\n                              Navigator.of(context).pop();\n                            },\n                          ),\n                        ],\n                      ),\n                    ),\n                  );\n                });\n          },\n          icon: Icon(Icons.add),\n          label: Text(\n            'Add Image',\n          ),\n        )\n      ],\n    );\n  }\n}
\n

Creating a imageLabeler function

\n\n
FirebaseVisionImage myImage = FirebaseVisionImage.fromFile(_userImageFile);\nImageLabeler labeler = FirebaseVision.instance.imageLabeler();
\n

FirebaseVisionImage is an object that represents an image object used for both on-device and cloud API detectors.imagLabeler() method creates an on-device instance of ImageLabeler .

\n

Processing image

\n
_imageLabels = await labeler.processImage(myImage);
\n

ImageLabeler provides us processImage() method that takes an FirebaseVisionImage object. Here _imageLables is a list of ImageLabel.

\n\n
for (ImageLabel imageLabel in _imageLabels) {\n  setState(() {\n    result = result +\n        imageLabel.text +\n        ":" +\n        imageLabel.confidence.toString() +\n        "\\n";\n  });\n}
\n\n
processImageLabels() async {\n  FirebaseVisionImage myImage = FirebaseVisionImage.fromFile(_userImageFile);\n  ImageLabeler labeler = FirebaseVision.instance.imageLabeler();\n  _imageLabels = await labeler.processImage(myImage);\n  result = "";\n  for (ImageLabel imageLabel in _imageLabels) {\n    setState(() {\n      result = result +\n          imageLabel.text +\n          ":" +\n          imageLabel.confidence.toString() +\n          "\\n";\n    });\n  }\n}
\n
\n \n \n \"Final\n \n
Final Result will look something similar
\n
\n

Resources for help

\n\n

Thanks for Reading .If I got something wrong? Let me know in the comments. I would love to improve.

","timeToRead":5,"fileAbsolutePath":"/opt/build/repo/content/2021-flutter -ml/index.md","frontmatter":{"title":"How to integrate Machine Learning in flutter apps","date":"2020-10-20","tags":["flutter"],"path":"blog/ml-in-flutter","excerpt":"Let's see how to use ML kit in flutter and make an Image labeling app","cover":{"childImageSharp":{"fluid":{"aspectRatio":1.7241379310344827,"src":"/static/f5e228c31c5f2f4ed65912e83683066f/b1d21/preview.png","srcSet":"/static/f5e228c31c5f2f4ed65912e83683066f/f4545/preview.png 250w,\n/static/f5e228c31c5f2f4ed65912e83683066f/e25f7/preview.png 500w,\n/static/f5e228c31c5f2f4ed65912e83683066f/b1d21/preview.png 1000w,\n/static/f5e228c31c5f2f4ed65912e83683066f/55230/preview.png 1200w","sizes":"(max-width: 1000px) 100vw, 1000px"}}}}},"allMarkdownRemark":{"edges":[{"node":{"fileAbsolutePath":"/opt/build/repo/content/2021-about-nft/index.md","frontmatter":{"path":"blog/about-nft","title":"What is an NFT (Non-Fungible Tokens)","tags":["blockchain"],"excerpt":"NFTs known as a non-fungible token, meaning that each token is unique, one-of-one. It cannot be traded and is exclusive to the owner.","cover":{"childImageSharp":{"fluid":{"tracedSVG":"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='400'%20height='267'%3e%3cpath%20d='M0%2075v74h4a10410%2010410%200%2000144%202l4%201c3%200%204%200%204%202l4%201h4v6c0%204%200%205-2%205l-3%202-3%203h-16l-9-1-8%201h-16l-9-1-8%201-9%201-7-1-8-1-8%201-8%201-8-1-9-1-8%201-8%201-8-1-5-1H0v17c0%2015%200%2018%202%2019v3c-2%201-2%206-2%2030v28h174l172-1-2-1%202-1%202-2%201-1%201%202%202%201c2%200%201%202-1%202-1%201%2010%201%2024%201h26v-49a479%20479%200%2000-2-49l-2-2-2-1h2l3-3%201-83V0H293a1400%201400%200%2000-109%201L91%200H0v75m171%2032l-1%201c-2%200-2%204-2%2028l1%2027%202%202c1%202%202%202%2022%202s21%200%2021-2l-1-2-2-2-2-2c-2%200-2-1-2-10s0-10%202-10%202-1%202-7%200-8%202-8l1%208-1%208c-2%200-2%202-2%209s0%209%202%209l1%202%202%202c2%200%203%201%203%203%200%203%2038%202%2038-1l2-2%202-1%202-2c2%200%202-1%202-9%200-9%200-10-2-10s-2-1-2-8v-8h-3c-3%200-4%200-4%202l-2%202-2%202-2%202-2%202c-1%203-16%203-16%200l-2-2-2-3c0-2%200-2-2-2-1%201-1%200-2-1%200-2-1-2-4-2s-4%200-4-2%201-2%204-2%204%200%204%202c1%202%204%203%204%201l2-2%202%201-2%201-1%202%202%202%201%202c0%202%201%202%206%202h5v-11l-1-12-2-1c0-2-4-2-33-2-30%200-34%200-34%202m-26%2033c0%202%200%203%202%203l2%202c0%201%201%202%204%202s4%201%204%203%201%202%203%202c3%200%204-1%204-4v-4h-12v-4c0-4%200-4-3-4-4%200-4%200-4%204m81%2019v4h28v-4c0-4%200-5-2-5l-3%202c0%201-1%202-3%202-3%200-4-1-4-2l-2-2-2%202c0%202-1%202-4%202s-4%200-4-2l-2-2c-2%200-2%201-2%205'%20fill='%23d3d3d3'%20fill-rule='evenodd'/%3e%3c/svg%3e","aspectRatio":1.5003750937734435,"src":"/static/9563277ca4f0c8833911b2b70eb3fcec/bd9e5/preview.png","srcSet":"/static/9563277ca4f0c8833911b2b70eb3fcec/9eb9c/preview.png 150w,\n/static/9563277ca4f0c8833911b2b70eb3fcec/566d0/preview.png 300w,\n/static/9563277ca4f0c8833911b2b70eb3fcec/bd9e5/preview.png 600w,\n/static/9563277ca4f0c8833911b2b70eb3fcec/11803/preview.png 900w,\n/static/9563277ca4f0c8833911b2b70eb3fcec/55230/preview.png 1200w,\n/static/9563277ca4f0c8833911b2b70eb3fcec/81612/preview.png 2000w","sizes":"(max-width: 600px) 100vw, 600px"}}}}}},{"node":{"fileAbsolutePath":"/opt/build/repo/content/2021-flutter/index.md","frontmatter":{"path":"blog/more-on-flutter","title":"What is flutter and why it's getting too popular","tags":["flutter"],"excerpt":"New to Flutter let's see what are the advantages of using flutter for your development.","cover":{"childImageSharp":{"fluid":{"tracedSVG":"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='400'%20height='232'%3e%3cpath%20d='M144%2023h-1l-1%201-1%201c-1-1-7%202-7%203l-1%201h-1c0%201-7%204-10%204l-1%201-1%201c-1-1-5%201-5%202l-1%201h-1l-1%201h-1l-1%201h-1l-1%201h-1l-5%203-5%202-13%207-1%201-14%209-3%203-4%202-1%201-5%204-6%204-2%201-1%201-3%203c-2%201-3%202-2%203l-2%204c-2%202-3%207-1%206h1l-1%201v1h12l-3%201-2%201-2%201c-1%200-2%201-1%202%200%201%200%202-1%201%200-1-3-2-3%200l1%202c2%202%202%202%203%200h3v9h1c2-2%205%200%204%202-1%201%201%202%204%201l8-1%203-1h1l1-1%201-1%204-3c4-4%205-5%208-5%202%200%203%200%205-2l3-4%203-1%204-1%201-1c-1%200%204-4%206-4l5-2%204-1%205-4%205-3%202-2%202-1%204-2%209-5%205-3h1l1-1%201-1%205-3%206-3v-1l2-2%203-2%202-1%203-1c2-1%204-2%205-1l1%201v-1l3-2%202-2c-2%200-2%200-1-1%202%200%201-1-2-5-2-2-3-3-4-2h-2c0-2-1-2-3-2l-3-3c1-1-3-5-5-5l-3-2-3-3-4-2c-3-2-4-2-5-1m-6%2067c-3%204-10%209-11%208l-1%201-1%201h-1l-2%201-2%201-1%201-4%201-8%205-2%201-1%201h-1l-1%201-2%201-1%201-6%203-3%202-4%202-1%201h-1l-2%201-3%202-1%201-2%202-2%204-2%204-1%203%201%202v2c-1%202-2%203-1%204h3c1%201%202%203%201%205l1%202%202%201%201%201c2%200%203%201%207%205%204%203%206%203%2010%201l4-2%201-1%201-1c1%201%205-1%205-2h1l1-1%202-1%203-1%202-1%201-1%202-1%201-1%205-3%204-3%202-1%202-1%202-2%202-2%203-2%202-2%202-2c2%200%2012-11%2012-13l1-2%201-1v-1c2-5%202-10%200-11v-2l-1-2-2-1-6-4-4-2-4-2h-3m47%2011l-19%206c-1%202%200%204%202%207%203%202%202%205-2%205-2%200-5%202-5%204l2%203%201%207c0%203%200%204%203%206s5%200%205-5c1-5%202-6%209-6%209-2%2012-4%2010-8-1-2-2-2-7-1-7%200-7%200-5-5%202-4%205-5%2019-6%204-1%204-1%200%2011-4%2011-5%2014-2%2018%201%203%201%203%207%202l16-1%202-2c0-4-5-6-13-6l-6%201%201-3%203-9c4-8%203-11-2-12l-3-1c0-5-8-7-16-5m91%205l-3%201-15%202-8-1c-2-2-3-1-5%206-2%209-8%2015-13%2015-1%200-2-4-1-7s1-4-1-7l-1-4v-2l-3-2v4c-5%205-4%2023%200%2027%203%202%2010%201%2014-2%201-1%203-2%204-1v-1c-1-1-1-1%200%200l1-1v-1c2%201%205-6%207-12%201-3%201-3%206-3h5l-2%206c-4%209-4%2014%200%2017%203%202%207-2%204-5v-3c1-2%201-2%201%201v3l2-4c1-5%201-6-1-4-1%203-2%201%200-2l3-6c2-5%207-7%209-4l6%201h4l-1%203c-4%206-5%2012-4%2015%201%204%205%207%207%205v-4l-1-2c0-2%200-2%201%200%201%201%201%201%202-2v-4c-1%200%203-11%205-12l4-1c6-1%207%203%203%2010-5%2010-1%2016%2012%2015%2010-1%2015-4%2011-8-1-2-2-2-7-1-9%202-10%201-9-1%201-3%202-3%206-3s9-2%209-4-4-4-8-4c-6%200-4-1%204-3s9-3%209-5c-1-4-3-4-12-3-7%202-8%202-9%200-2-1-18-1-24%201l-4-2c-2-2-9-3-7-1m66%204l-5%205c-4%200-7%2022-4%2024%202%201%203%201%205-2%201-3%202-3%203-2%203%204%2017%207%2018%204%202-3-4-9-8-7l-4-1-2-2%202-1%204-1c2%200%206-4%206-7%200-4-3-9-7-12l-3-2-5%204m-212%2038l-2%202h-2v1l-1%201c-1-1-9%203-9%204%201%201-1%203-4%202-3%200-12%205-12%207l1%201%201%203c0%201%200%202-1%201-2-1%200%208%202%2010v3c-1%202-1%202%202%204l3%202%202%201h2c2%200%201%202-1%202-2%201%205%208%207%208%203%200%204%201%203%203s9%203%2020%200h24l3-4%202-4-4-6-4-7-3-4-3-2-2-2c-1-3-5-7-8-7-2-1-4-5-3-8v-6c-1-2-2-4-1-5%200-1-8-2-12%200'%20fill='%23d3d3d3'%20fill-rule='evenodd'/%3e%3c/svg%3e","aspectRatio":1.7241379310344827,"src":"/static/f5e228c31c5f2f4ed65912e83683066f/bd9e5/preview.png","srcSet":"/static/f5e228c31c5f2f4ed65912e83683066f/9eb9c/preview.png 150w,\n/static/f5e228c31c5f2f4ed65912e83683066f/566d0/preview.png 300w,\n/static/f5e228c31c5f2f4ed65912e83683066f/bd9e5/preview.png 600w,\n/static/f5e228c31c5f2f4ed65912e83683066f/11803/preview.png 900w,\n/static/f5e228c31c5f2f4ed65912e83683066f/55230/preview.png 1200w","sizes":"(max-width: 600px) 100vw, 600px"}}}}}},{"node":{"fileAbsolutePath":"/opt/build/repo/content/2021-flutter -ml/index.md","frontmatter":{"path":"blog/ml-in-flutter","title":"How to integrate Machine Learning in flutter apps","tags":["flutter"],"excerpt":"Let's see how to use ML kit in flutter and make an Image labeling app","cover":{"childImageSharp":{"fluid":{"tracedSVG":"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='400'%20height='232'%3e%3cpath%20d='M144%2023h-1l-1%201-1%201c-1-1-7%202-7%203l-1%201h-1c0%201-7%204-10%204l-1%201-1%201c-1-1-5%201-5%202l-1%201h-1l-1%201h-1l-1%201h-1l-1%201h-1l-5%203-5%202-13%207-1%201-14%209-3%203-4%202-1%201-5%204-6%204-2%201-1%201-3%203c-2%201-3%202-2%203l-2%204c-2%202-3%207-1%206h1l-1%201v1h12l-3%201-2%201-2%201c-1%200-2%201-1%202%200%201%200%202-1%201%200-1-3-2-3%200l1%202c2%202%202%202%203%200h3v9h1c2-2%205%200%204%202-1%201%201%202%204%201l8-1%203-1h1l1-1%201-1%204-3c4-4%205-5%208-5%202%200%203%200%205-2l3-4%203-1%204-1%201-1c-1%200%204-4%206-4l5-2%204-1%205-4%205-3%202-2%202-1%204-2%209-5%205-3h1l1-1%201-1%205-3%206-3v-1l2-2%203-2%202-1%203-1c2-1%204-2%205-1l1%201v-1l3-2%202-2c-2%200-2%200-1-1%202%200%201-1-2-5-2-2-3-3-4-2h-2c0-2-1-2-3-2l-3-3c1-1-3-5-5-5l-3-2-3-3-4-2c-3-2-4-2-5-1m-6%2067c-3%204-10%209-11%208l-1%201-1%201h-1l-2%201-2%201-1%201-4%201-8%205-2%201-1%201h-1l-1%201-2%201-1%201-6%203-3%202-4%202-1%201h-1l-2%201-3%202-1%201-2%202-2%204-2%204-1%203%201%202v2c-1%202-2%203-1%204h3c1%201%202%203%201%205l1%202%202%201%201%201c2%200%203%201%207%205%204%203%206%203%2010%201l4-2%201-1%201-1c1%201%205-1%205-2h1l1-1%202-1%203-1%202-1%201-1%202-1%201-1%205-3%204-3%202-1%202-1%202-2%202-2%203-2%202-2%202-2c2%200%2012-11%2012-13l1-2%201-1v-1c2-5%202-10%200-11v-2l-1-2-2-1-6-4-4-2-4-2h-3m47%2011l-19%206c-1%202%200%204%202%207%203%202%202%205-2%205-2%200-5%202-5%204l2%203%201%207c0%203%200%204%203%206s5%200%205-5c1-5%202-6%209-6%209-2%2012-4%2010-8-1-2-2-2-7-1-7%200-7%200-5-5%202-4%205-5%2019-6%204-1%204-1%200%2011-4%2011-5%2014-2%2018%201%203%201%203%207%202l16-1%202-2c0-4-5-6-13-6l-6%201%201-3%203-9c4-8%203-11-2-12l-3-1c0-5-8-7-16-5m91%205l-3%201-15%202-8-1c-2-2-3-1-5%206-2%209-8%2015-13%2015-1%200-2-4-1-7s1-4-1-7l-1-4v-2l-3-2v4c-5%205-4%2023%200%2027%203%202%2010%201%2014-2%201-1%203-2%204-1v-1c-1-1-1-1%200%200l1-1v-1c2%201%205-6%207-12%201-3%201-3%206-3h5l-2%206c-4%209-4%2014%200%2017%203%202%207-2%204-5v-3c1-2%201-2%201%201v3l2-4c1-5%201-6-1-4-1%203-2%201%200-2l3-6c2-5%207-7%209-4l6%201h4l-1%203c-4%206-5%2012-4%2015%201%204%205%207%207%205v-4l-1-2c0-2%200-2%201%200%201%201%201%201%202-2v-4c-1%200%203-11%205-12l4-1c6-1%207%203%203%2010-5%2010-1%2016%2012%2015%2010-1%2015-4%2011-8-1-2-2-2-7-1-9%202-10%201-9-1%201-3%202-3%206-3s9-2%209-4-4-4-8-4c-6%200-4-1%204-3s9-3%209-5c-1-4-3-4-12-3-7%202-8%202-9%200-2-1-18-1-24%201l-4-2c-2-2-9-3-7-1m66%204l-5%205c-4%200-7%2022-4%2024%202%201%203%201%205-2%201-3%202-3%203-2%203%204%2017%207%2018%204%202-3-4-9-8-7l-4-1-2-2%202-1%204-1c2%200%206-4%206-7%200-4-3-9-7-12l-3-2-5%204m-212%2038l-2%202h-2v1l-1%201c-1-1-9%203-9%204%201%201-1%203-4%202-3%200-12%205-12%207l1%201%201%203c0%201%200%202-1%201-2-1%200%208%202%2010v3c-1%202-1%202%202%204l3%202%202%201h2c2%200%201%202-1%202-2%201%205%208%207%208%203%200%204%201%203%203s9%203%2020%200h24l3-4%202-4-4-6-4-7-3-4-3-2-2-2c-1-3-5-7-8-7-2-1-4-5-3-8v-6c-1-2-2-4-1-5%200-1-8-2-12%200'%20fill='%23d3d3d3'%20fill-rule='evenodd'/%3e%3c/svg%3e","aspectRatio":1.7241379310344827,"src":"/static/f5e228c31c5f2f4ed65912e83683066f/bd9e5/preview.png","srcSet":"/static/f5e228c31c5f2f4ed65912e83683066f/9eb9c/preview.png 150w,\n/static/f5e228c31c5f2f4ed65912e83683066f/566d0/preview.png 300w,\n/static/f5e228c31c5f2f4ed65912e83683066f/bd9e5/preview.png 600w,\n/static/f5e228c31c5f2f4ed65912e83683066f/11803/preview.png 900w,\n/static/f5e228c31c5f2f4ed65912e83683066f/55230/preview.png 1200w","sizes":"(max-width: 600px) 100vw, 600px"}}}}}},{"node":{"fileAbsolutePath":"/opt/build/repo/content/2021-microsoft-mesh/index.md","frontmatter":{"path":"blog/about-microsoft-mesh","title":"Lets learn more about Microsoft Mesh","tags":["technology"],"excerpt":"Is this the future? Microsoft Mesh is a Mixed Reality platform intended to make collaboration and app creation easier.","cover":{"childImageSharp":{"fluid":{"tracedSVG":"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='400'%20height='218'%3e%3cpath%20d='M4%205l1%206c2%201%201%203-1%203-4%201-4%2010-4%20109v95h98l-1-3a960%20960%200%2000-33-72l3%202%205%206c3%203%205%207%2010%2018l14%2032%208%2017h92l91-1-2-11c-3-12-3-13%206-14l3-1h2l2-1h2l5-1c2-1%202-1%202%201l-1%202v1c2%200%202%200%201%202v3l-1%202-1%202v3l-1%203v4c-2%206-2%206%2021%206a167%20167%200%200024-1c-1%201%205%201%2025%201h27v-84l-1-109V0H178l4%2012%201%203c0%202-1%202-10%202h-15c-6%201-7%200-4-2l8-6%207-7%203-2h-63a901%20901%200%2000-75%200H23l-2%2013a415%20415%200%2001-9%2036l-3%203-2-2-3-1V37l6-35c0-2%200-2-2-2S5%201%204%205m82%209l-1%206-2%206c0%202%200%202%206%202l7-1-9-14-1%201m23%2010c-3%201-5%205-4%208l-3%204c-3%204-6%204-5%201l-1-4c-2-2-2-2-4%201l-2%205%204%202c2-2%203%202%202%205l-1%207a1057%201057%200%2001-4%2034l12%2024%207-5c7-4%2011-6%2012-4h1l1-3c2-2%207-19%207-26l2-14c1-16-1-22-10-29-8-7-11-8-14-6m43%2015l-3%2015-2%2011-2%2013a297%20297%200%2001-11%2060c1%201%202%202%201%204-2%206%201%208%207%206%202-1%203-2%205-8%203-8%205-15%205-21l1-10a233%20233%200%20003-17l5-25%203-15v-6c-1%202-2%200-2-3%201-4-2-8-6-9-3%200-3%200-4%205m142%2023c-7%204-7%204-3%206%205%202%208%201%2010-1%201-2%202-3%203-2v-1l1-2c2-1%202-1%201-2-2-2-6-2-12%202m-47%202c-3%202-2%203%201%203l2%202-2%201c-3%200-6%204-6%207l2%201c2%201%202%201%202%205s1%206%202%202l3-3%205-6c2-4%203-6%205-6h3v16l4%201%209%202%201-1%204-3c3-3%202-12-1-15h4l-3-2c-1-2-2-2-4-1-1%201-3%201-12-2-12-3-17-4-19-1M72%2069l-2%201-2%201h-3c-1%201-2%201-3-1-1-1-1-1-1%201%201%203%203%207%203%204l3-1%203%201v1l1%201-1%201-2%202h3l5-5c1-1%201-2%202-1v-1l1-1c1%201%204-2%204-4l-1-1-1%202-1%201h-1c0%201-1%201-1-1-2-1-2-1-3%201%200%202-1%202-3%202-3%200-3%200-1-1%202%200%203-1%203-2%201-2-1-3-2%200m-56%207c-2%203%208%2029%2012%2034%205%205%206%204%203-2-6-11-13-29-11-30l1-2h-5m7%203c-1%202-1%204%201%207l4%2010%205%2012c3%204%203%205%202%206s-1%202%204%208c1%202%203%204%202%205l1%201%205%202%204%202%203-1c3%201%203%201-1-4-2-4-4-5-5-4a638%20638%200%2000-15-23l-5-11c-2-5-3-6-2-8%201-3-1-4-3-2m58%207l-4%202h-3c-3%201-4%208-1%208%202%201%202%201%201%204l-1%206c0%203-3%205-9%206l-6%202c-1%201-1%201-2-1-1-3-3-5-5-5l-4-3-3-1c0%202%206%209%208%209l4%203%2021%2012c2%200%202-1%202-6l1-8c2-1%202-3%202-9l1-7%201-3%202-5c4-6%201-8-5-4m119%2021l-1%204-3%209-1%203-1%207c-4%206-5%2011-4%2012v4c-3%2011-2%2017%205%2017%205%200%205-1%206-16l1-11c0%203%203%209%206%2011%203%201%2010%201%2012-1l4-1c4%200%205-4%206-12l-1-10-2-4c0-3-4-11-5-11-9-1-9-1-13%203l-5%204-2%202c-1%201-1%200-1-4%200-6%200-7-1-6m82%201l-9%203c-3%201-3%201-3-1%200-3-2-1-2%201-1%202-6%207-6%205l-1-1-2%201-2%201-3%201c-1%202-4%200-8-3l-4-4-2%203c-5%206-10%2026-9%2031l1%209c1%209%202%2011%207%2016l7%2010%203%206%204%206%204%205a555%20555%200%20017-6c2-3%202-3-3-6s-6-7-2-7l1-1%203-2c4-1%209-8%208-9l1-2%202-2%201-2%201-2c-1-2%200-5%202-9%205-7%205-7%202-9-3-3%201-20%205-20%202%200%206-4%206-7l-1-2-1-1c1-3-1-4-7-2'%20fill='%23d3d3d3'%20fill-rule='evenodd'/%3e%3c/svg%3e","aspectRatio":1.8351254480286738,"src":"/static/a3b29e2283a60401e41fbb08f3469514/bd9e5/preview.png","srcSet":"/static/a3b29e2283a60401e41fbb08f3469514/9eb9c/preview.png 150w,\n/static/a3b29e2283a60401e41fbb08f3469514/566d0/preview.png 300w,\n/static/a3b29e2283a60401e41fbb08f3469514/bd9e5/preview.png 600w,\n/static/a3b29e2283a60401e41fbb08f3469514/11803/preview.png 900w,\n/static/a3b29e2283a60401e41fbb08f3469514/54abe/preview.png 1024w","sizes":"(max-width: 600px) 100vw, 600px"}}}}}},{"node":{"fileAbsolutePath":"/opt/build/repo/content/2022-about-graph/index.md","frontmatter":{"path":"blog/theGraph","title":"The Graph ‘Google of Blockchains’","tags":["blockchain"],"excerpt":"Why ‘The Graph’ is so integral to the Web3 ecosystem and fueling DApps development process from behind.","cover":{"childImageSharp":{"fluid":{"tracedSVG":"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='400'%20height='267'%3e%3cpath%20d='M0%20134v133h401V0H0v134m142-7v22h8v-9c0-10%201-13%206-13%204%200%205%202%205%2012v10h8v-11c0-11%200-12-3-15-3-4-8-5-13-3l-3%202v-17h-8v22m214-21v22l1%2021h7v-10c0-8%201-9%203-11%206-5%209-1%209%2012v9h7v-11c0-11%200-12-3-15-3-4-8-5-12-3l-4%202v-17h-4l-4%201m-237%2010c0%204%200%204-3%204s-3%200-3%204c0%203%200%203%203%203h3v7c0%2011%203%2015%2011%2015%205%200%205%200%205-3%200-4%200-4-3-4-4%200-5-2-5-9v-6h4c4%200%204%200%204-3%200-4%200-4-4-4h-4v-8h-8v4m65%205c-16%208-6%2033%2011%2028%205-1%2012-7%2011-9-1-1-7-1-9%201-3%202-9%201-11-1-4-3-3-4%209-4h11v-4c-2-10-12-16-22-11m44%200c-12%208-7%2027%207%2027l6-1c2-2%202-2%202%201%200%206-6%209-12%205-1-2-3-2-5-2-4%200-4%200-3%204%204%207%2016%209%2023%204%204-4%205-8%205-24v-15h-4l-4%201h-3c-3-3-8-2-12%200m43%200l-3%201c0-2-1-2-4-2h-4v29h8v-9c0-10%202-13%207-13%202%200%203%200%203-3%200-5-3-6-7-3m17%200c-12%207-8%2028%206%2028l6-1%203-1c0%202%201%202%204%202h4v-29h-4l-4%201h-3c-3-3-8-2-12%200m43%200h-4l-4-1h-4v41h8v-15l2%201c3%203%2011%202%2014%200%2014-10%202-34-12-26m-98%206c-5%203-6%208-2%2012%205%204%2012%201%2012-5s-5-9-10-7m60%200c-4%202-6%209-2%2013%205%204%2012%201%2012-6%200-5-5-9-10-7m38%200c-7%203-5%2015%203%2015%204%200%207-3%207-8s-5-9-10-7'%20fill='%23d3d3d3'%20fill-rule='evenodd'/%3e%3c/svg%3e","aspectRatio":1.5,"src":"/static/a00b6da2618796d7186b374f0a4c8645/bd9e5/preview.png","srcSet":"/static/a00b6da2618796d7186b374f0a4c8645/9eb9c/preview.png 150w,\n/static/a00b6da2618796d7186b374f0a4c8645/566d0/preview.png 300w,\n/static/a00b6da2618796d7186b374f0a4c8645/bd9e5/preview.png 600w,\n/static/a00b6da2618796d7186b374f0a4c8645/11803/preview.png 900w,\n/static/a00b6da2618796d7186b374f0a4c8645/55230/preview.png 1200w","sizes":"(max-width: 600px) 100vw, 600px"}}}}}},{"node":{"fileAbsolutePath":"/opt/build/repo/content/2022-buildContext/index.md","frontmatter":{"path":"blog/flutter-buildContext","title":"Flutter buildContext","tags":["flutter"],"excerpt":"Learning about Flutter buildContext is critical to the creation of applications.It has everything related to tracking all widgets in the tree, including their locations in the tree.","cover":{"childImageSharp":{"fluid":{"tracedSVG":"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='400'%20height='232'%3e%3cpath%20d='M144%2023h-1l-1%201-1%201c-1-1-7%202-7%203l-1%201h-1c0%201-7%204-10%204l-1%201-1%201c-1-1-5%201-5%202l-1%201h-1l-1%201h-1l-1%201h-1l-1%201h-1l-5%203-5%202-13%207-1%201-14%209-3%203-4%202-1%201-5%204-6%204-2%201-1%201-3%203c-2%201-3%202-2%203l-2%204c-2%202-3%207-1%206h1l-1%201v1h12l-3%201-2%201-2%201c-1%200-2%201-1%202%200%201%200%202-1%201%200-1-3-2-3%200l1%202c2%202%202%202%203%200h3v9h1c2-2%205%200%204%202-1%201%201%202%204%201l8-1%203-1h1l1-1%201-1%204-3c4-4%205-5%208-5%202%200%203%200%205-2l3-4%203-1%204-1%201-1c-1%200%204-4%206-4l5-2%204-1%205-4%205-3%202-2%202-1%204-2%209-5%205-3h1l1-1%201-1%205-3%206-3v-1l2-2%203-2%202-1%203-1c2-1%204-2%205-1l1%201v-1l3-2%202-2c-2%200-2%200-1-1%202%200%201-1-2-5-2-2-3-3-4-2h-2c0-2-1-2-3-2l-3-3c1-1-3-5-5-5l-3-2-3-3-4-2c-3-2-4-2-5-1m-6%2067c-3%204-10%209-11%208l-1%201-1%201h-1l-2%201-2%201-1%201-4%201-8%205-2%201-1%201h-1l-1%201-2%201-1%201-6%203-3%202-4%202-1%201h-1l-2%201-3%202-1%201-2%202-2%204-2%204-1%203%201%202v2c-1%202-2%203-1%204h3c1%201%202%203%201%205l1%202%202%201%201%201c2%200%203%201%207%205%204%203%206%203%2010%201l4-2%201-1%201-1c1%201%205-1%205-2h1l1-1%202-1%203-1%202-1%201-1%202-1%201-1%205-3%204-3%202-1%202-1%202-2%202-2%203-2%202-2%202-2c2%200%2012-11%2012-13l1-2%201-1v-1c2-5%202-10%200-11v-2l-1-2-2-1-6-4-4-2-4-2h-3m47%2011l-19%206c-1%202%200%204%202%207%203%202%202%205-2%205-2%200-5%202-5%204l2%203%201%207c0%203%200%204%203%206s5%200%205-5c1-5%202-6%209-6%209-2%2012-4%2010-8-1-2-2-2-7-1-7%200-7%200-5-5%202-4%205-5%2019-6%204-1%204-1%200%2011-4%2011-5%2014-2%2018%201%203%201%203%207%202l16-1%202-2c0-4-5-6-13-6l-6%201%201-3%203-9c4-8%203-11-2-12l-3-1c0-5-8-7-16-5m91%205l-3%201-15%202-8-1c-2-2-3-1-5%206-2%209-8%2015-13%2015-1%200-2-4-1-7s1-4-1-7l-1-4v-2l-3-2v4c-5%205-4%2023%200%2027%203%202%2010%201%2014-2%201-1%203-2%204-1v-1c-1-1-1-1%200%200l1-1v-1c2%201%205-6%207-12%201-3%201-3%206-3h5l-2%206c-4%209-4%2014%200%2017%203%202%207-2%204-5v-3c1-2%201-2%201%201v3l2-4c1-5%201-6-1-4-1%203-2%201%200-2l3-6c2-5%207-7%209-4l6%201h4l-1%203c-4%206-5%2012-4%2015%201%204%205%207%207%205v-4l-1-2c0-2%200-2%201%200%201%201%201%201%202-2v-4c-1%200%203-11%205-12l4-1c6-1%207%203%203%2010-5%2010-1%2016%2012%2015%2010-1%2015-4%2011-8-1-2-2-2-7-1-9%202-10%201-9-1%201-3%202-3%206-3s9-2%209-4-4-4-8-4c-6%200-4-1%204-3s9-3%209-5c-1-4-3-4-12-3-7%202-8%202-9%200-2-1-18-1-24%201l-4-2c-2-2-9-3-7-1m66%204l-5%205c-4%200-7%2022-4%2024%202%201%203%201%205-2%201-3%202-3%203-2%203%204%2017%207%2018%204%202-3-4-9-8-7l-4-1-2-2%202-1%204-1c2%200%206-4%206-7%200-4-3-9-7-12l-3-2-5%204m-212%2038l-2%202h-2v1l-1%201c-1-1-9%203-9%204%201%201-1%203-4%202-3%200-12%205-12%207l1%201%201%203c0%201%200%202-1%201-2-1%200%208%202%2010v3c-1%202-1%202%202%204l3%202%202%201h2c2%200%201%202-1%202-2%201%205%208%207%208%203%200%204%201%203%203s9%203%2020%200h24l3-4%202-4-4-6-4-7-3-4-3-2-2-2c-1-3-5-7-8-7-2-1-4-5-3-8v-6c-1-2-2-4-1-5%200-1-8-2-12%200'%20fill='%23d3d3d3'%20fill-rule='evenodd'/%3e%3c/svg%3e","aspectRatio":1.7241379310344827,"src":"/static/db986c776d108d05d8c57c1888ac3f5f/bd9e5/preview.png","srcSet":"/static/db986c776d108d05d8c57c1888ac3f5f/9eb9c/preview.png 150w,\n/static/db986c776d108d05d8c57c1888ac3f5f/566d0/preview.png 300w,\n/static/db986c776d108d05d8c57c1888ac3f5f/bd9e5/preview.png 600w,\n/static/db986c776d108d05d8c57c1888ac3f5f/11803/preview.png 900w,\n/static/db986c776d108d05d8c57c1888ac3f5f/55230/preview.png 1200w","sizes":"(max-width: 600px) 100vw, 600px"}}}}}},{"node":{"fileAbsolutePath":"/opt/build/repo/content/2022-howToBe_Blodev/index.md","frontmatter":{"path":"blog/howToBeBlockchainDeveloper","title":"How to be a Blockchain developer?","tags":["blockchain"],"excerpt":"It's a hot topic that everyone is speaking about,and a job in the blockchain developement it may be something that you should consider if you are passionate about technology,cryptocurrency and Web3.","cover":{"childImageSharp":{"fluid":{"tracedSVG":"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='400'%20height='225'%3e%3cpath%20d='M0%20113v112h401V0H0v113m185-53c-16%201-21%202-28%209-8%208-9%2013-10%2036-1%2034%201%2041%2010%2051%2010%209%2011%209%2045%209%2031-1%2032-1%2041-9%209-9%209-12%2010-42%200-29%200-34-6-41-5-5-12-10-17-12-5-1-26-2-45-1'%20fill='%23d3d3d3'%20fill-rule='evenodd'/%3e%3c/svg%3e","aspectRatio":1.7803163444639718,"src":"/static/76878dbfd8afa709abdd629e35e281f2/bd9e5/preview.png","srcSet":"/static/76878dbfd8afa709abdd629e35e281f2/9eb9c/preview.png 150w,\n/static/76878dbfd8afa709abdd629e35e281f2/566d0/preview.png 300w,\n/static/76878dbfd8afa709abdd629e35e281f2/bd9e5/preview.png 600w,\n/static/76878dbfd8afa709abdd629e35e281f2/11803/preview.png 900w,\n/static/76878dbfd8afa709abdd629e35e281f2/55230/preview.png 1200w,\n/static/76878dbfd8afa709abdd629e35e281f2/906b2/preview.png 2026w","sizes":"(max-width: 600px) 100vw, 600px"}}}}}},{"node":{"fileAbsolutePath":"/opt/build/repo/content/2022-variable/index.md","frontmatter":{"path":"blog/about-variables","title":"Storage VS Memory VS Calldata","tags":["blockchain"],"excerpt":"Every function call uses gas in EVM; every bit of savings helps when summing over the potential lifetime of total function invocations.","cover":{"childImageSharp":{"fluid":{"tracedSVG":"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='400'%20height='225'%3e%3cpath%20d='M0%20113v112h401V0H0v113m183-26l-17%2027%2017%209%2017%209%2033-18c1-1-31-52-33-53l-17%2026m33%2043l-16%209-16-8-15-9%208%2011%209%2011v1l1%201%202%201h2l4-1c4%201%205%202%205%2012v7l14-19%2017-22c3-4%202-4-15%206'%20fill='%23d3d3d3'%20fill-rule='evenodd'/%3e%3c/svg%3e","aspectRatio":1.7777777777777777,"src":"/static/fd06f26f9a0ec194a155893bddfa2f4c/bd9e5/preview.png","srcSet":"/static/fd06f26f9a0ec194a155893bddfa2f4c/9eb9c/preview.png 150w,\n/static/fd06f26f9a0ec194a155893bddfa2f4c/566d0/preview.png 300w,\n/static/fd06f26f9a0ec194a155893bddfa2f4c/bd9e5/preview.png 600w,\n/static/fd06f26f9a0ec194a155893bddfa2f4c/11803/preview.png 900w,\n/static/fd06f26f9a0ec194a155893bddfa2f4c/55230/preview.png 1200w","sizes":"(max-width: 600px) 100vw, 600px"}}}}}}]}},"pageContext":{"isCreatedByStatefulCreatePages":false,"postId":"73a795f8-4137-5957-a3e3-aed978d759f7","translations":[{"hreflang":"en","path":"/blog/ml-in-flutter/"}]}}}