teleren/devto huggingface dataset:
What actually is a "function" in JavaScript?
Tags: javascript
Published: 2020-10-06 17:22:28

In JavaScript, the functions are **first-class objects**. 

Now, one would ask, what is a first-class object? 

**Answer**: Just like any other object in JavaScript, functions are also objects. They can have properties and methods associated with them. But they differ from other objects in the sense that they are [Function](https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Function) objects.

>Focus your attention on this keyword: **Function**

**Function** is a constructor to make an instance of a function. Or in other words, a Function constructor is used to make a function object. This means that just like in any other programming language we call the constructor of a class to initiate an instance (object) of that class, similarly, here calling the Function constructor can create functions dynamically.

Just like an object has properties and methods, the functions in JavaScript can also have properties and methods associated with them.

### Function properties:
There are various properties of function like arguments, length, name, etc. [More details...](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function)
### Function methods:
There are various methods like call(), apply(), bind(), etc. I will post a different article about these methods in detail later. If you want to check them out now [click here.](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function)

## Syntax
The [syntax](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/Function) of calling the Function constructor:
>new Function([arg1 [, arg2 [, ...argN]] ,] functionBody)

***arg1, arg2, ...argN***: Corresponds to the arguments passed to the function expression. Each must be a string or list of strings.

***functionBody***: JavaScript statements inside the function body. Must be a string.



Now let's have a look at an example of calling the Function constructor.

```
// Creates a function that takes an argument of name, and returns the concatenated string containing the argument passed 
const greet = new Function('name', 'return "Hello " + name');

// Call the function
greet('John'); // Hello John

// Calling without argument
greet(); // Hello undefined

// It is equivalent to defining a function expression like this
const greet = function(name) {
    return 'Hello ' + name;
}
```

Notice the arguments should be strings. All arguments passed to the Function constructor are treated as the names of the parameters in the function created. Omitting an argument while calling the function can result in an undefined value for that parameter.

>Thanks for reading! If you found this article helpful please share it with others so that they will also get the benefit. 
Feedbacks are welcome:  [Twitter](https://twitter.com/toocoolsachin8) | [Instagram](https://instagram.com/toocoolsachin) | [LinkedIn](https://linkedin.com/in/sachin-koli)
Day2: Working on Weather Application
Tags: 100daysofcode, react, webdev, javascript
Published: 2020-10-06 17:19:59

Today I worked on a sample weather application. 

Weather application consists on sample Data in the form of JSON. In the UI when the user enters the name of a city, application has to perform search n the sample data that is stored and the match weather information has to render in the form of a card.

I only have basic structure of the Project. Will be uploading the implementation details once the project is on github.
CAD STL/OBJ mesh viewer with Python/tkinter GUI
Tags: python, cad, mesh, tkinter
Published: 2020-10-06 17:18:12

---
title: CAD STL/OBJ mesh viewer with Python/tkinter GUI
published: true
description: CAD STL/OBJ mesh viewer with Python/tkinter GUI
tags: python, cad, mesh, tkinter
cover_image: https://raw.githubusercontent.com/precise-simulation/mesh-viewer/master/meshviewer-screenshot.jpg
---

**Mesh Viewer** is a simple STL/OBJ CAD geometry and surface mesh viewer prototype with a _Model View Controller_ (MVC) type design. Three different visualization backends are compared and embedded within the same [Python](https://www.python.org)/[tkinter](https://wiki.python.org/moin/TkInter)
GUI framework.

- [matplotlib](https://matplotlib.org)
- [plotly](https://www.featool.com/web-plots) _(WebGL with embedded webview)_
- [vispy](http://vispy.org) _(OpenGL)_


![Mesh Viewer screenshot](https://raw.githubusercontent.com/precise-simulation/mesh-viewer/master/meshviewer-screenshot.jpg)


The _vispy/opengl_ backend seems to be the best choice overall with respect to performance and packaged size (~35 MB), while _plotly_ (subjectively) looks the best but leads to large binaries due to embedding the Chromium framework (~70-90 MB), _matplotlib_ is the simplest backend but suffers from slow performance for larger visualizations.

Source code is available from:

https://github.com/precise-simulation/mesh-viewer

and pre-built binaries from the releases:

https://github.com/precise-simulation/mesh-viewer/releases/latest
Pass props using spread operator
Tags: react, webdev, beginners, codenewbie
Published: 2020-10-06 17:10:47

```js
const cardProps = { title: "Card Title", content: "Hello  World" };

const App = () => {
  return (
    <Card
      title={cardProps.title}
      content={cardProps.content}
    />
  );
};
```

Simpler way to do this:
```js
const cardProps = { title: "Card Title", content: "Hello  World" };

const App = () => {
  return <Card {...cardProps} />;
};
```
Tooltip Using HTML/CSS
Tags: codepen, webdev, html, css
Published: 2020-10-06 17:05:43

Hello Folk!
See my new work made by HTML5 & CSS3.
Copy From w3schools and host on codepen.

Hover Over Image...
{% codepen https://codepen.io/wkazisan/pen/gOraLBZ %}

Comment if you like!

Happy Learning web developers.
Happy web development.
Templating in Flask. 🍾
Tags: flask, python, webdev, beginners
Published: 2020-10-06 16:48:43

## Basics

Templating in flask is super simple. Flask uses Jinja templating engine. We render templates using render_template() function in flask. Here is a example,

```python
from flask import render_template

@app.route('/template-view')
def templateView():
    render_template("template_name.html")

```

We need to keep out all the templates in `templates` directory. You may nest in with other directories if you want.

## Passing Data into Template

Now we will learn how to pass data into the template from the flask view.

```python
from flask import render_template

@app.route('/template-view-with-varible')
def templateView():
    name = 'Ketan'
    render_template("template_name.html", { "name" : name })

```
We need to pass the data in template with the use of dictionary.
In template we can access this data by,

```html
<h1>Hello {{ name }}!</h1>
```

In next blog we will learn how to use template literals.

Read it on my website [Templating in Flask. - Flask For Noobs 🧪 - Part 2](https://www.ketaniralepatil.com/python/flask/templating-in-flask/).

Also Read [Using Template engine in Flask - Flask For Noobs 🧪 - Part 3  ](https://www.ketaniralepatil.com/python/flask/using-template-engines-in-flask/).
---
Hacktober Updates. Did a three-way recursive merge. 
Tags: opensource
Published: 2020-10-06 15:46:08

Hello all. Yep, the title says right. I just did (2 days ago) a three-way recursive merge in GitHub. I know it's not even something to be proud of, millions do it every second, but it was my first time, so I am very happy about it.

I added two new features to my CLI program. One of them parses good or bad or all links and outputs with what option you specified. For eg, if you use the command "--good", only good results will be outputted. Vice-versa for "--bad". The other feature I added was an option to output results with or without colors depending on the option they changed it to in the configuration file (.env). 

I created 2 branches naming them branch#a and branch#b. When I added the first feature to the branch#a, I did a merge request and it got accepted. Same for branch#b. That way I learned that if there is someone other than me working on the same program but different features, you do not have to worry about copy-pasting as merging will do the dirty work for you (unless there's a conflict).

Oh almost forgot, Hacktober is in-process right now. I did not start looking for an issue yet, but I will start later tonight. So, get ready for a new post this week on Hacktober as I will keep you all updated on my first ever success story in Hacktober. Thank you and stay safe!

LINKS - [Git repo](https://github.com/Niaz-Ul-Haque/nlinks)
[Feature 1](https://github.com/Niaz-Ul-Haque/nlinks/commit/e255d439e4ad1769cdd5216118fbc34aea96e996)
[Feature 2](https://github.com/Niaz-Ul-Haque/nlinks/commit/d6ed1cb89ac36da87a0267d2dc3f401cd4874c6d)
#CodepenChallenge Flash Intro: 2000s Web Design
Tags: codepen, vue, javascript, showdev
Published: 2020-10-06 16:24:42

<p>This is an emulation of carousel made in flash. Back in those days, flash is being used by many websites. Although this Pen is about "flash intro" or loading, I also made the carousel after the loading ends.</p>

<p>Loading of these images will take at least 8 seconds; 1 to 1.5 seconds every image as what I randomly generated the load time.</p>

<p>Because we are talking about flash, first thing came to my mind is 2000s web design, so I designed this page to look like it's 2000s, but I used HTML5 semantics to create the layout.</p>

<p>In this layout, the only active function is the "flash" function. Others are just dummy element.</p>

<p>I also tried to use HTML names as much as possible. I don't know, maybe because I think, I can emulate 2000s design using these colors.</p>

{% codepen https://codepen.io/takaneichinose/pen/JjKPMOz %}
What Is a Virtual Machine?
Tags: explainlikeimfive, help, beginners, discuss
Published: 2020-10-06 16:05:06

## Hey, Devinas!

Actually, I'll be giving a talk soon enough to teach my peers the basics of **Cloud Computing**. 

What Cloud is? What happens on the server side when you enter a URL in the address bar and hit 'enter' key? How load balancers work? Pros and Cons of cloud etc.

Between those topics, one that I'm planning to give a brief intro about is **'What is a Virtual Machine?'**

I do know what a virtual machine is, how it just runs another instance of an OS on the same hardware, and how a hypervisor manages all the resources etc.

But, I'm unable to come with an easy analogy or some real-life example using which I could be able to teach them out. 

#### **Any Ideas/Suggestions ?**

P.S. Also, if you'd like to join the talk and discuss a few things about cloud, feel free to registeryourself [here](https://bit.ly/30days-kickoff). I'd love to learn together with you :)
I Don't Understand X Science...
Tags: poll, science, discuss
Published: 2020-10-06 15:27:18

---
title: I Don't Understand X Science...
published: true
description: 
tags: poll, science, discussion
//cover_image: https://www.freepik.com/free-vector/science-word-concept_7967020.htm
---
When was the last time you came across a flat earth'er? Or someone who didn't know how cars work? Or you name it... I came across this often when I used to teach 10-15 yr olds.

It's obvious but, **No one person understands everything**. Even people in science must have things they do not understand. 

_What don't you understand in Science?_
**OR** 
_What clear, concise, killer answer do you give for X (Your favorite pet peeve or part of science)?_

**For example:**
My favorite experiment for explaining the spinning of the globe is "Foucault's pendulum." Imagine a pendulum above the north pole. As the pendulum rocks you would notice it draws/cuts out different sections as the earth turns below it. ;)
What i like on PHP 7.4
Tags: php, discuss
Published: 2020-10-06 15:24:56

Ok there is more what i like but this is biggest chages for me.

Maybe someone can tell me im crazy but i realy like strongly typed languages. And with 7.4 relase php is closer to them. (and more will come in 8.0) .

Now my Model classes can look like this

```php
class UserIndexViewModel
{
    protected int $id;
    protected string $email;
    protected int $groupId;
    protected string $groupName;
    protected bool $isActive;
    protected bool $isAdmin;
    protected FrozenTime $created;
    protected FrozenTime $modified;

    /**
     * UserIndexViewModel constructor.
     * @param int $id
     * @param string $email
     * @param int $groupId
     * @param string $groupName
     * @param bool $isActive
     * @param bool $isAdmin
     * @param FrozenTime $created
     * @param FrozenTime $modified
     */
    private function __construct(int $id, string $email, int $groupId, string $groupName, bool $isActive, bool $isAdmin, FrozenTime $created, FrozenTime $modified)
    {
        $this->id = $id;
        $this->email = $email;
        $this->groupId = $groupId;
        $this->groupName = $groupName;
        $this->isActive = $isActive;
        $this->isAdmin = $isAdmin;
        $this->created = $created;
        $this->modified = $modified;
    }

    /**
     * @return int
     */
    public function getId(): int
    {
        return $this->id;
    }
// ...
}
```

One think i missing now is array of objects. In 7.4 you can not define it. You define simply just array however it is here a workaround and it can be defined in doc blocks:

```php
   /**
     * Returns populated array f ViewModel
     *
     * @param \Cake\Datasource\ResultSetInterface|\Iam\Model\Entity\User[] $data
     * @param IdentityInterface $identity
     * @return array|\Iam\ViewModel\UserIndexViewModel[]
     */
    public static function prepare(ResultSetInterface $data, IdentityInterface $identity) : array
```

PHP 8.0 (which is in RC stage i think) will bring Union types, so that can change.

What do you think about PHP now? Do you like weakly typed or strongly typed languages more?
Contribute to Kodiak UI, a React component and hook library
Tags: hacktoberfest, opensource, react, contributorswanted
Published: 2020-10-06 15:16:54

---
title: Contribute to Kodiak UI, a React component and hook library
published: true
tags: hacktoberfest, opensource, react, contributorswanted
---

## Kodiak UI needs your help!

[Kodiak UI](https://kodiak-ui.com) is a component and hook library for building complex and accessible UIs. We are looking for contributors to help and have created some [issues](https://github.com/skyverge/kodiak-ui/issues) to help you get started.

Kodiak UI is built on top of a constraint-based theme that utilizes scales to provide consistent and expected values for developers. Take a look at the [theme specification](https://system-ui.com/theme) to learn more.

Please take a look through the issues and comment if you would like to pick one up or learn more about Kodiak UI! We would love any and all help. 🎉

[Repository](https://github.com/skyverge/kodiak-ui)
[Issues](https://github.com/skyverge/kodiak-ui/issues)
[Documentation](https://kodiak-ui.com)
Want 2 Ways to Check If An Object has a Property?
Tags: webdev, javascript, json
Published: 2020-10-06 15:06:11

It's amazing how sometimes Boolean values can turn out to be, well, not Boolean. Maybe it is `true`, `false`, `null` or even not there at all. And each of those four options might mean a different user flow for you to enact on the front end! So how to you check to see if that property is even in the object?

##Using the hasOwnProperty() Method
This is my favorite way to determine if the property is in the object, I find it incredibly readable and straightforward. This method returns a Boolean value of true or false based on if the value is missing or not.

```
var coolObject= {
  title: 'SmashBrothers'
};
if(coolObject.hasOwnProperty('title'){
   console.log("It does have this property!");
}
if(coolObject.hasOwnProperty('genre'){
   //this isn't ever hit, as it returns false
}
```

While [`hasOwnProperty()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty) is looking at property values of objects, it ignores inherited property values like `toString`, and only looks at the data information outlined in the object.

You can chain checks on the object together, to prevent errors in your system. Let's say that the object is being returns from an endpoint, you'll first want to check that the object in general was successfully returned, and then check if the property is there.

```
 if (profile && profile !== null && profile.hasOwnProperty("coolName")){
//The object exists, isn't null, and has the property "Cool Name"!
}
```

## Using the In Operator
This method of determining if the property exists inside the object reminds me of Python in a great way. You're quite literally asking if the property is `in` the object. Similar to `hasOwnProperty()` the `in` operator returns a Boolean value of true or false based on if the value is missing or not from the object it is looking in.

```
var coolObject= {
  title: 'SmashBrothers'
};

if('title' in coolObject){    
 // true!
}
if('genre' in coolObject){
// this code won't reach because this is false
}
```


####You're good to go!
With these two ways to check using JavaScript if a property exists in an object, you'll be ready to do all sorts of interesting user flows on your front end based off the new options of did this property get returned in the data object! Here's some more [long form](http://adripofjavascript.com/blog/drips/the-uses-of-in-vs-hasownproperty.html) on the two options.
Elixir 1.11 released
Tags: news, elixir
Published: 2020-10-06 15:05:27

---
title: Elixir 1.11 released
published: true
description: Elixir 1.11 has just been released with a variety of improvements
tags: news, elixir
//cover_image: https://direct_url_to_image.jpg
---

Elixir 1.11 dropped today, just in time for ElixirConf EU! From the [release notes](https://elixir-lang.org/blog/2020/10/06/elixir-v1-11-0-released/
):

> Over the last releases, the Elixir team has been focusing on the compiler, both in terms of catching more mistakes at compilation time and making it faster. Elixir v1.11 has made excellent progress on both fronts

Some notable features include:

### Tighter Erlang integration
**Requires Erlang/OTP 23+**

Integrates with Erlang's new log levels, `notice`, `critical`, `alert`, and `emergency`. And the Logger now supports structured logging.

IEx has also been given a little bump. You can now see improved documentation for Erlang modules.

### Compiler checks
Application boundary checks meaning the compiler makes sure modules you invoke are listed as dependencies.

Data structure checks, the compiler will now check structs and maps across a function. With 1.11 missing fields in structs and maps will now be caught during compile time.

### Compilation time improvements
The number of files compiled will now be reduced. 1.11 does this by marking `imports` and `requires` as export dependencies. Meaning it won't need to recompile those files every time a change is made.

---
See the [release notes](https://elixir-lang.org/blog/2020/10/06/elixir-v1-11-0-released/
) for more information!

What features are you excited about?
Portfolio with GatsbyJS
Tags: react, gatsby
Published: 2020-10-06 15:02:55

Hey folks

In the last few months I was feeling stuck and I didn't see myself growing technically, one day after my work hours I was browsing on twitter and I found a thread where some devs were commenting on portfolios and that made me think, how about training a little UI and React, so I prototyped my layout in figma and with it finished I started coding my project, in it I used GatsbyJS which I consider one of the best options for creating static projects.

In addition to GatsbyJS I used the following libs and services in this project:

  - Styled Components
  - i18next
  - Formik & Yup
  - Netlify

#### Why did I choose Gatsby?

I chose this framework because it provides me with a range of plugins that facilitate SEO configuration, styling and importing static or external files. In addition to having a simple and objective routing that facilitates the development of the project.

#### Links

https://mattew.netlify.app/
https://github.com/SrVieira/portfolio

#### Thanks for reading

I would like your feedback either for the structural part (code) or for the visual part (UI). I am grateful now.
By Popular Demand, Bubblegum.dev 🍬 is Live. Glycerin Levels Going Up.
Tags: webdev, javascript, react, productivity
Published: 2020-10-06 15:01:29

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/d3kxyjpqr95yxcsuhc1i.png)

[Click here if you drink water ( ͡° ͜ʖ ͡°)](https://bubblegum.dev/)
[Click here if you breathe air ( ͡° ͜ʖ ͡°)](https://bubblegum.dev/)
[Click here if you eat stuff ( ͡° ͜ʖ ͡°)](https://bubblegum.dev/)


Hi.

After a silly resources post got 1000+ reactions, we knew what was about to happen.

✨ Another Newsletter Made ✨

Yep. And we did it proudly. After all, who doesn't like shiny, new stuff 💎?

So **Bubblegum.dev** was created. This one is all about those *sweet, sweet* hidden gems. The ones you were craving for and didn't even know. 
The *wow, I need it* kind.

* Maybe it's useful 🏆
* Maybe it's pretty ☀️
* Maybe it's fun 🥳
* Maybe it's [the best newsletter ever created and the one that will forever be remembered on the heart of over half a million talented developers](https://www.youtube.com/watch?v=dQw4w9WgXcQ)

Maybe it's all of it. We don't follow a strict rule.

We find something and we use the hell out of it. If we're addicted *and can't stop using*, we shout it out. It's that simple.

With that being said - give us your email [here](https://bubblegum.dev/) 🔫 🔫 🔫

We're also live on Product Hunt. We would appreciate a thumbs up there :)

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/046fifaofmntlp0l0eu3.gif)

[Click here if you know how to click here ( ͡° ͜ʖ ͡°)](https://bubblegum.dev/)
Building Azure Function Powered Video Chat
Tags: azure, tutorial, webdev, javascript
Published: 2020-10-06 14:51:31

#### 📺 035 - Michael Jolley 🎙️ Frank Boucher

{% youtube m6GTyJMsSQI %}

---

The Azure Functions are very interesting for a vast variety of projects because there are: budget-friendly, stateless, easy to deploy, and use. The Azure Functions are part of the Serverless offer from Microsoft. They 

Join Michael Jolley and Frank to Build a video chat application using utilizing Vue.js (JavaScript) with some Azure Functions inside the new Azure Static WebApp (SWA). 

In this project, Azure Function will be used to generate a token to identify the user joining a "chat room". We were trying the not even release version of Vue.js and let's say we encounter a few hiccups... But That's how you learn...

---


### Useful Links

🔗 [Quickstart: Create a function in Azure using Visual Studio Code](https://docs.microsoft.com/en-us/azure/azure-functions/functions-create-first-function-vs-code?pivots=programming-language-javascript&WT.mc_id=allaroundazure-devto-frbouche)

🔗 [Quickstart: Create a function in Azure using Visual Studio Code](https://docs.microsoft.com/en-ca/azure/azure-functions/functions-create-first-function-vs-code?pivots=programming-language-javascript&WT.mc_id=allaroundazure-devto-frbouche) 

🔗 [Azure Static Web Apps documentation](https://docs.microsoft.com/en-ca/learn/modules/publish-app-service-static-web-app-api/?WT.mc_id=allaroundazure-devto-frbouche)

🔗 [GitHub](https://github.com/microsoft/swa-community-kit)


### Learn more about Michael Jolley

🔗 [@baldbeardbuild](https://twitter.com/baldbeardbuild)

🔗 [Bio](https://baldbeardedbuilder.com/about/)



### Find Us On

📺 [Twitch](https://www.twitch.tv/microsoftdeveloper)

🔗 Twitter: [@allaroundazure](https://twitter.com/allaroundazure)

☁️