teleren/devto huggingface dataset:
Image and Data Upload Issue in Flutter.
Tags: doubt
Published: 2020-09-05 14:34:18

Friends,
  I have to Upload an Image and related Data to ASP.net API(Server).
API , I tested with Postman and it works fine. But I am not able to Upload that from Flutter.
It Shows Loading and not getting any response.
So please help me to fix this issue.
I have uploaded an Image of my code here and add the same below.

CODE
=====

  Future<Map<String, dynamic>> imageUploader(File fl) async
  {
    print("Inside imageUploader() File = $fl");
    setState(()
    {
      pr.show();
    });
    final mimeTypeData = lookupMimeType(fl.path, headerBytes: [0xFF, 0xD8]).split('/'); 

    final imageUploadRequest = http.MultipartRequest('POST', apiUrl);  
  
    final fileNew = await http.MultipartFile.fromPath('half_body_image', fl.path,contentType: MediaType(mimeTypeData[0], mimeTypeData[1]));

    imageUploadRequest.files.add(fl);
    imageUploadRequest.fields['name'] = imgFileName;
    imageUploadRequest.fields['imgCatag1'] = imgCategory1;

    try
    {
      final streamedResponse = await imageUploadRequest.send();
      final response = await http.Response.fromStream(streamedResponse);

      if (response.statusCode != 200)
      {
        return null;
      }
      final Map<String, dynamic> responseData = json.decode(response.body);
      return responseData;
    }
    catch (e)
    {
      print(e);
      return null;
    }
  }
kotlin learning notes Ⅳ—— interface
Tags: kotlin
Published: 2020-09-05 14:31:40

#interface
The kotlin interface, similar to Java 8, uses the interface keyword to define the interface, allowing methods to have **default implementations**:
```
interface MyInterface {
    fun bar()    // not implemented
    fun foo() {  //implemented
      // Optional method body
      println("foo")
    }
}
```
##implement interface
**A class or object can implement one or more interfaces**
example:
```
interface MyInterface {
    fun bar()
    fun foo() {
        // optional function
        println("foo")
    }
}
class Child : MyInterface {
    override fun bar() {
        println("bar")
    }
}
```
##Properties in the interface
**The attribute in the interface can only be abstract, and initialization value is not allowed. The interface will not save the property value. When implementing the interface, the property must be rewritten**
*(接口中的属性只能是抽象的，不允许初始化值，接口不会保存属性值，实现接口时，必须重写属性)*
example:
```
interface MyInterface {
    var name:String //name , abstract
    fun bar()
    fun foo() {
        // 可选的方法体
        println("foo")
    }
}
class Child : MyInterface {
    override var name: String = "runoob" //override name
    override fun bar() {
        println("bar")
    }
}
```
##override function
When implementing multiple interfaces, you may encounter the problem that the same method inherits multiple implementations. For example:
```
interface A {
    fun foo() { print("A") }   // implemented
    fun bar()                  // abstract, not implemented
}
 
interface B {
    fun foo() { print("B") }   // implemented
    fun bar() { print("bar") } // implemented
}
 
class C : A {
    override fun bar() { print("bar") }   // override
}
 
class D : A, B {
    override fun foo() {
        super<A>.foo()
        super<B>.foo()
    }
 
    override fun bar() {
        super<B>.bar()
    }
}
 
fun main(args: Array<String>) {
    val d =  D()
    d.foo();
    d.bar();
}
```
output:
```
ABbar
```
I Published Gistagram
Tags: sideprojects, github, githunt, javascript
Published: 2020-09-05 14:27:11

Hi everyone. As a waste of time activity, I made an app called Gistagram. It uses GitHub's Gist API and [Carbon](carbon.now.sh/)'s embed. That's all. I'm not sure how this work could be better and I just used Vue for this work.

**Live Demo**: [https://aligoren.github.io/gistagram/](https://aligoren.github.io/gistagram/)

{% github aligoren/gistagram %}

Thanks :)
Web Components Part 3 - Lifecycle Functions
Tags: react, angular, vue, svelte
Published: 2020-09-05 14:23:36

## What is a Web Component

In the major frontend frameworks (Angular, Vue, React) you are able to encapsulate parts of your user interface into tags like `<component/>`. In recent years, the ability to do so natively has been added to the Javascript browser API in the form of the Native Web Components API. In this series we'll explore the different aspects of building web components. I have created a few libraries that makes this process even easier such as MercedUI, ComponentZoo, FunComponent, and AMPonent.

**Find my libraries at** http://alexmercedcoder.com/jslib/

**My Web Components Video Playlist:** https://www.youtube.com/watch?v=qV7jh7ctALg&list=PLY6oTPmKnKbaNVkXHOHWxgdKEZLGKuFP9

## Where we left off

In this tutorial we won't be continuing off the build of the previous two tutorials but just going over some additional built in functions you can override in your web component classes.

**example**

```js

class MyComponent extend HTMLElement {
  constructor(){
    super()
  }

  static get observedAttributes(){return ['prop1','prop2']}

  connectedCallback(){
    console.log('I run when the component is rendered')
  }

  disconnectedCallback(){
    console.log('I run when the component is removed from the DOM')
  }

  changedAttributeCallback(name, oldVal, newVal){
    switch(name){
      case 'prop1':
        console.log('I run when the prop1 attribute is changed');
        break;
      case 'prop2':
        console.log('I run when the prop2 attribute is changed');
        break;
    }
  }
}


```

If you read the console.logs above it should be clear what each of these functions do. There is also an adoptedCallback that would run if you have iframes on your page and you move a component from your main document into one of the iframe documents.
Productive Applications to use
Tags: productivity, discuss
Published: 2020-09-05 14:17:59

Hey coders/rockstars,
With time, I realised that a coder can be great at multiple things, he just needs to apply his problem solving skills to simplify things.😁

I actually came across these interesting applications last month and wanted to share it with you guys.😊

```
1 - Sleep Town
```
This one is actually quite helpful and I have been trying to use this to build healthy sleeping habits, from last 2 weeks. Works good for me, please feel free to check it out.

```
2 - Habitica
```
This is an open-source one caught my eye as it is a gamified task manager. I am planning to use this for myself and see how it turns out. I will be honest it would be a bit overload for me also so fingers crossed 🤞.

```
3 - Pocket
```
This is love 😍, Save Read and Grow. You can capture the content you find on the Internet. Also the greatest differentiator is you can even read and listen the content without distraction even offline. Check this one out for sure. 🙂 

These are available on Android and ios.

I hope you like these applications as much as you like to code.😁

Do you know any other productivity increasing applications? Let's discuss 😊
Express: req.params, req.query and req.body
Tags: express, javascript, codenewbie
Published: 2020-09-05 13:56:54

These three, req.body, req.query and req.params are part of Express request object.
They are used by the client to send data to the server.
This post outlines their differences and gives examples on how to use them.

## 1. req.body
Generally used in POST/PUT requests.
Use it when you want to send sensitive data(eg. form data) or super long JSON data to the server.

How to send data in request body

* using curl
```bash
  curl -d '{"key1":"value1", "key2":"value2"}' -H "ContentType: application/json" -X POST http://localhost:3000/giraffe
```
* using axios
```javascript
  axios.post('/giraffe', {
    key1: 'value1',
    key2: 'value2'
  })
  .then(response => {
    ...
  })
  .catch(error => {
    ...
  })
```
How to get data from request body

```javascript
  app.get('/giraffe', (req, res) => {
   console.log(req.body.key1) //value1
   console.log(req.body.key2) //value2
  })
```
**Remember to use express.json() middleware to parse request body else you'll get an error**

```javascript
app.use(express.json())
```

## 2. req.params
These are properties attached to the url i.e named route parameters. You prefix the parameter name with a colon(**:**) when writing your routes.

For instance,

```javascript
  app.get('/giraffe/:number', (req, res) => {
   console.log(req.params.number)
  })
```
To send the parameter from the client, just replace its name with the value

```bash
  GET  http://localhost:3000/giraffe/1
```

## 3. req.query
req.query is mostly used for searching,sorting, filtering, pagination, e.t.c
Say for instance you want to query an API but only want to get data from page 10, this is what you'd generally use.
It written as *key=value*
```bash
  GET  http://localhost:3000/animals?page=10
```
To access this in your express server is pretty simple too;
```javascript
  app.get('/animals', ()=>{
   console.log(req.query.page) // 10
  })
```
I hope you found this helpful.

Thanks for reading 🥰.

<span> Cover Photo by <a href="https://unsplash.com/@adigold1?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Adi Goldstein</a> on <a href="https://unsplash.com/s/photos/code?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Unsplash</a></span>
Learn Vim. A new extension to help you learn Vim in VSCode
Tags: showdev, vscode, vim, webdev
Published: 2020-09-05 13:45:51

---
title: Learn Vim. A new extension to help you learn Vim in VSCode
published: true
description: A new extension to help you learn Vim in VSCode
tags: [showdev,vscode,vim,webdev]
series: "Exploring Vim"
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/o0u5jrbmprit6osyl37i.png
canonical_url: https://www.barbarianmeetscoding.com/blog/2020/09/08/learn-vim-a-new-extension-to-help-you-learn-vim-in-vscode
---

As I was writing [JavaScriptmancy](https://www.javascriptmancy.com/), [Boost Your Coding Fu with VSCode and Vim](https://www.barbarianmeetscoding.com/boost-your-coding-fu-with-vscode-and-vim/) and [Wizards Use Vim](https://www.wizardsusevim.com/) I've always envisioned a more interactive way to teach through practice, play and games. Life happens and I sort of got as far as writing but never much further. I left those cool ideas of interactive learning, roguelikes, RPG-esque JavaScript, Vim platformers archived somewhere at the bottom of bottomless TODO lists, half-remembered thoughts and someday/maybes...

But yesterday as I was preparing breakfast I wondered... Hmm could I write a VSCode extension to help people learn Vim in VSCode? Could I do it in just one day? And it turns out I can... Sort of

**Behold!**

**[Learn Vim](https://marketplace.visualstudio.com/items?itemName=vintharas.learn-vim)**, a VSCode extension that helps you learn Vim right within VSCode, keeps your progress and provides room for thoughtful reading and deliberate practice (and soon games?).

Open Visual Studio, install *Learn Vim* like any other extension and then:

1. Open the command palette
2. Type *Learn Vim*
3. Victory

![Learn Vim](https://www.barbarianmeetscoding.com/images/learn-vim.jpg)

Hope you find it useful! And don't hesitate to give me a shout, ask me a question or let me know what you think. Have fun! And may the Elder Gods of Vim always be with you.
Change Cursor Style and Animation in VS Code
Tags: vscode, javascript, style, vscodesettings
Published: 2020-09-05 13:29:57

We have 4 types of cursor animations in VS Code editor. 
`phase`, `smooth`, `expand` and `solid`.

To set a particular animation for the cursor in VS Code you need to add a cursor animation setting to your `settings.json` file.

Open `settings.json` => `ctrl + shift + P` and search for setting.json, add a new setting:

`"editor.cursorBlinking": "smooth",`

**Here is a screen-shot of settings.json**

![Alt vs code editor cursor setting json file screenshot](https://dev-to-uploads.s3.amazonaws.com/i/9d05tpbuwqwjhddn5m8w.jpg)

To Change cursor width and Style:
```
"editor.cursorStyle": "line",
"editor.cursorWidth": 6,
``` 
we have 6 styles of cursor in VS Code:
 
`block`, `block-outline`, `line`, `line-thin`, `underline`, `underline-thin`.

### **Animation Demos:**

**Smooth**

![Alt smooth cursor animation vs code setting JSON file screenshot](https://dev-to-uploads.s3.amazonaws.com/i/soscvd0mc1fgfi5wvwfe.gif)

**phase**

![Alt phase cursor animation vs code setting JSON file screenshot](https://dev-to-uploads.s3.amazonaws.com/i/pr3rvvmyeg5ku60sfwcg.gif)

**Expand** ❤️❤️

![Alt Expand cursor animation vs code setting JSON file screenshot](https://dev-to-uploads.s3.amazonaws.com/i/nmhtg9fd323liqvmd29b.gif)

**Solid** 😐😐

![Alt solid cursor animation vs code setting JSON file screenshot](https://dev-to-uploads.s3.amazonaws.com/i/e96n5e5bi8pow1vrkwi6.jpg)

This could be a little configuration but you will enjoy It.

I will share my complete VS Code setup in next post, you may follow to get notified.

> Your feedbacks are more than welcome 😉😉

You may like:

[Extended Html5 Boilerplate](https://marketplace.visualstudio.com/items?itemName=rajeshroyal896.extended-html5-boilerplate) for VS Code

{% github Rajesh-Royal/extended-html5-boilerplate-vscode no-readme %}
Memoization in short
Tags: python, javascript, webdev
Published: 2020-09-05 13:27:53

What problem does memoization solve?
In a nutshell, it prevents ineffectiveness.

## Why

The code is not as brilliant as you might think. Sometimes, it needs to repeat stuff over and over to do its job.

The great idea with memoization is to avoid unnecessary calculations. The program has already done the job, so let's save the results.  Instead of computing the same things in memory repeatedly, you store them for later use.

It's the very concept of caching. If your script needs previous operations results in the next operations, it's the right candidate for memoization.

## Pure functions and disclaimer

You need pure functions to apply memoization techniques. Those functions don't manipulate any state, and they have no side effects. They always return the same results for the same inputs, nothing more.

It's important to note that not all functions must be pure. There are some cases where memoization is even counterproductive.

## Simple pattern

Here is a very simple example in JavaScript :

```javascript
const myFunction = function(param) {
   if (!myFunction.memo[ param ]) {
       let outcome = {};// here is your operation instead
       myFunction.memo[ param ] = outcome;
   }
   return myFunction.memo[ param ];
};

myfunction.memo = {};
```
The code skips computation if the result is already available.

## Recursion

Recursion is a little more complicated, but it can leverage the benefits of memoization techniques. 

As you may already know, recursive functions call themselves. They usually have a condition that ends the recursion in a specific case. The recursive part happens in all other cases.

Here is an example in Python:

```python
def fibo(n):
    if n <= 1:
        return n
    else:
        return fibo(n - 1) + fibo(n - 2)
```
The calculation is expensive. It happens because it executes several operations multiple times. 

Why is that so?

`fibo(2)` executes `fibo(1)`. `fibo(3)`  executes `fibo(2)` and `fibo(1)`, but `fibo(2)` executes `fibo(1)` too, etc. 
In those conditions `fibo(2000)` is gonna take like forever...

 Let's cache it :

```python
fiboCache = {}
 
def fibo(n):
    if n in fiboCache:
        return fiboCache[ n ]
    if n < 2:
        value = 1
    else:
       value =  fibo(n - 1) + fibo(n - 2)
       fiboCache[ n ] = value
    return value
```

We use a dictionary to store values. This optimization is massive. Without it, the script would take a lot of time and memory to execute. It would probably kill memory unless you use tiny numbers as input, but in this case, using a function has very little interest.

You can test the boosted `fibo` with a crazy range:

```python
for i in range(1, 2000):
     print(fibo(i))
```

## Wrap

I hope you enjoy this short introduction to memoization. It's available in the vast majority of languages, so do not hesitate to use it appropriately.
#100DaysOfCloud | Day 7
Tags: aws, serverless, 100daysofcloud
Published: 2020-09-01 03:39:25

What Did I Learn -

When Developing a Lambda function, the default version is `$LATEST` and you can create versions of your function, however when you create a version it becomes immutable. You can also create Alias's for your functions, for example Prod and Dev. You can assign either one Version to your alias, or similar to a weighted target group for an ALB, you can set a percentage for certain versions, this however, is not able to work with `$LATEST`. When using an Alias and `$LATEST` you can just use the one version. I also found that Step functions are generated in JSON format, you know I did want to do everything in YAML, but I see now that may not be as possible as I previously hoped. Step functions automatically trigger and track each step along with create logs for each step. We also went over the fact that X-Ray integrates with ELB, AWS Lambda, API Gateway, EC2, and AWS Elastic Beanstalk. I also learned you can import swagger files to API Gateway and that Amazon's default API Requests per sec are 10k and max concurrent requests is 5k across your account. If you bypass either of these you get a 429 Too Many Request error.

What Did I Do -

Made an Alexa skill, so this was a simple skill, we got an audio file from Text-to-speech from Amazon Polly, Synthesized to an S3 bucket. We then went to AWS Lambda, under AWS Serverless App Repo we selected `alexa-skills-kit-nodejs-factskill` and deployed it. We selected and copied the ARN at the top of our alexaskill repo page. We made sure we were signed in on amazondeveloper page and selected Alexa. Named our app and chose Fact skill as a template, we made our invocation "testing" and went to endpoint and input our lambda ARN endpoint, and for Intents field for Utterances we just added testing again. Now to add our audio source from Amazon Polly we go back to Lambda, edit our serverless App repo template, we create a new dictionary value for our input and add `<audio src=\"https://s3.amazonaws.com/testinglink/123456789ABcdef.mp3\" />` I have completed this lab before but it is always fun playing around with Alexa skills, almost tempts me to go for the Alexa Specialty, but that is preferably after I gain the AWS Dev Associate as well as the Sec Specialty.

For Tomorrow -

We are onward to DynamoDB, Amazon's best database ever (Glory to DynamoDB).
Disaster Recovery Plans Are Critical By Phoenix American
Published: 2020-09-05 13:19:06

Your disaster recovery plan must be comprehensive, documented and tested. It must include preparation for remote working, data replication to a remote site and significant downsizing. An unexpected loss of human resources means your firm will need to be ready to operate with a minimal staff. The “shelter in place” orders were a surprise to many firms but detailed disaster recovery plans contemplated many of the needed responses.

<b><a href="https://www.phxa.com/news/how-to-emerge-from-covid-19-stronger/">Read More</a></b>

<b>Contact Details:</b>
415-485-4500
<a href="https://www.phxa.com/fund-accounting/">Fund Accounting</a>

<b>Visit Reference Profile Websites:</b>
<a href="https://www.phxa.com/">Fund Administration</a>
<a href="https://bit.ly/3i3d4S8">https://bit.ly/3i3d4S8</a>
<a href="https://bit.ly/2KIhcI1">https://bit.ly/2KIhcI1</a>
<a href="https://bit.ly/2VJ7uM1">https://bit.ly/2VJ7uM1</a>
<a href="https://bit.ly/2VGDrVc">https://bit.ly/2VGDrVc</a>
<a href="https://bit.ly/2W6E75i">https://bit.ly/2W6E75i</a>
<a href="https://bit.ly/2Y5XY7j">https://bit.ly/2Y5XY7j</a>
<a href="https://bit.ly/2W5SKG5">https://bit.ly/2W5SKG5</a>
<a href="https://bit.ly/3h742nd">https://bit.ly/3h742nd</a>
<a href="https://bit.ly/2AaRIRX">https://bit.ly/2AaRIRX</a>
<a href="https://bit.ly/3i8I9nC">https://bit.ly/3i8I9nC</a>
<a href="https://bit.ly/2KG2KjV">https://bit.ly/2KG2KjV</a>
<a href="https://bit.ly/3h3tkST">https://bit.ly/3h3tkST</a>
<a href="https://skl.sh/3bwVPG9">https://skl.sh/3bwVPG9</a>
<a href="https://bit.ly/2AMuS2Y">https://bit.ly/2AMuS2Y</a>
<a href="https://bit.ly/3hcc3Hf">https://bit.ly/3hcc3Hf</a>
<a href="https://bit.ly/37kOjMs">https://bit.ly/37kOjMs</a>
<a href="https://bit.ly/3hlD7Ej">https://bit.ly/3hlD7Ej</a>
<a href="https://bit.ly/2Aq8bSm">https://bit.ly/2Aq8bSm</a>
<a href="https://bit.ly/357yCcx">https://bit.ly/357yCcx</a>
<a href="https://bit.ly/3dSk02b">https://bit.ly/3dSk02b</a>
<a href="https://bit.ly/321vb5t">https://bit.ly/321vb5t</a>
<a href="https://bit.ly/32XML9y">https://bit.ly/32XML9y</a>
<a href="https://bit.ly/2QVQYF0">https://bit.ly/2QVQYF0</a>
<a href="https://bit.ly/2Fa4C4M">https://bit.ly/2Fa4C4M</a>
<a href="https://bit.ly/358o90z">https://bit.ly/358o90z</a>
How to view .Net application source code and hiding it
Tags: dotnet, beginners, csharp, tutorial
Published: 2020-09-05 13:13:39

Have you ever liked an application to the point that you want to view its source code? Well, I have been there. For .Net executable files and libraries such as DLL files, viewing the source code is a piece of cake as long as the code is not obfuscated by the developer. In this article, we are going to view the source code of a .Net DLL file as well as obfuscating it. The process of viewing the source code of an executable file is the same.

To create a DLL you can check [this article](https://dev.to/towernter/how-to-create-a-dynamic-link-library-dll-and-use-it-in-net-and-python-31oo) of mine

### Viewing source code using JetBrains dotPeek
JetBrains dotPeek decompiles an executable file or DLL/.exe file written using .Net to their equivalent C# code. 

#### **Installing dotPeek**
* Download JetBrains dotPeek from [JetBrains](https://www.jetbrains.com/decompiler/)
* Run the setup and install free .Net decompiler and assembly tools.

#### **Decompiling the code**
1. Open dotPeek 
2. File -> Open -> navigate to your project -> select your .DLL/.exe file
3. Your project will be listed in the projects on our dotPeek under `Assembly Explorer`
4. Click your project and find the classes to view the source code

My file is called `MyCalculator.dll` and bellow is the source code
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/6da5sj524v3yunqtvk2o.PNG)

#### **Obfuscating the source code**
For more obfuscating tools both open source and paid versions check this [NuGet obfuscator article](https://nugetmusthaves.com/Tag/obfuscator)


In this article, I'm using one from the article, and its called Eazfuscator.NET to hide source code for a C# application. I will be using a simple C# calculator. You need to download and install Eazfuscator.NET [here](https://www.gapotchenko.com/eazfuscator.net/download).

**NB:** Eazfuscator.NET is not free since version 3.4 but it has a trial version and the last free [version 3.3](https://www.mediafire.com/file/qrudv912heqxi6o/Eazfuscator.NET_3.3.161.zip/file) _does not support .Net 4.5 and higher_

### **Steps for hiding the source code**
1. Open your application in Visual Studio
2. Change your project from `debug` mode to `Release` mode
   ![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/o5kn9zhy4jsjilor2n8j.PNG)
3. Open Eazfuscator.NET then drag and drop your project from 
   solution explorer to protect it
   ![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/rwlgllitbnd0i5lsnp7g.PNG)
4. Rebuild your project and click reload all

> If you open and check your .exe/.DLL file using dotPeek you will notice that your source code is now obfuscated.


**Disclaimer:** _I am not affiliated with Gapotchenko (Eazfuscator.NET). This article is for educational purposes_.