teleren/devto huggingface dataset:
How to check if a number or a string is a valid port number in JavaScript?
Tags: javascript
Published: 2021-06-10 00:00:00

---
  title: How to check if a number or a string is a valid port number in JavaScript?
  published: true
  tags: JavaScript
  date: Thu Jun 10 2021 05:30:00 GMT+0530 (India Standard Time)
  canonical_url: https://melvingeorge.me/blog/check-if-number-string-valid-port-number-javascript
  cover_image: https://melvingeorge.me/_next/static/images/main-d239de30ee63fe953f1069ec46d34a16.jpg
  ---
  [Originally posted here!](https://melvingeorge.me/blog/check-if-number-string-valid-port-number-javascript)
  
To check if a number or a string is a valid port number, we can use a regex expression to match for all the numbers from `0` till `65535` in JavaScript.

### TL;DR

```js
// Regular expression to check if number is a valid port number
const regexExp = /^((6553[0-5])|(655[0-2][0-9])|(65[0-4][0-9]{2})|(6[0-4][0-9]{3})|([1-5][0-9]{4})|([0-5]{0,5})|([0-9]{1,4}))$/gi;

// a number
const num = 8080;

regexExp.test(num); // true
```

This is the regex expression for matching almost all the test cases for a valid port number from `0` till `65535` in JavaScript.

```js
// Regular expression to check if number is a valid port number
const regexExp = /^((6553[0-5])|(655[0-2][0-9])|(65[0-4][0-9]{2})|(6[0-4][0-9]{3})|([1-5][0-9]{4})|([0-5]{0,5})|([0-9]{1,4}))$/gi;
```

Now let's write a number which is a valid port number like this,

```js
// Regular expression to check if number is a valid port number
const regexExp = /^((6553[0-5])|(655[0-2][0-9])|(65[0-4][0-9]{2})|(6[0-4][0-9]{3})|([1-5][0-9]{4})|([0-5]{0,5})|([0-9]{1,4}))$/gi;

// a number
const num = 8080;
```

Now to test the number, we can use the `test()` method available in the regular expression we defined. It can be done like this,

```js
// Regular expression to check if number is a valid port number
const regexExp = /^((6553[0-5])|(655[0-2][0-9])|(65[0-4][0-9]{2})|(6[0-4][0-9]{3})|([1-5][0-9]{4})|([0-5]{0,5})|([0-9]{1,4}))$/gi;

// a number
const num = 8080;

regexExp.test(str); // true
```

- The `test()` method will accept a `number` type as an argument to test for a match.
- The method will return boolean `true` if there is a match using the regular expression and `false` if not.

See the above example live in [JSBin](https://jsbin.com/teregadote/2/edit?js,console).

If you want this as a utility function which you can reuse, here it is,

```js
/* Check if number is a valid port number */
function checkIfValidPortnumber(num) {
  // Regular expression to check if number is a valid port number
  const regexExp = /^((6553[0-5])|(655[0-2][0-9])|(65[0-4][0-9]{2})|(6[0-4][0-9]{3})|([1-5][0-9]{4})|([0-5]{0,5})|([0-9]{1,4}))$/gi;

  return regexExp.test(num);
}

// Use the function
checkIfValidPortnumber(8080); // true
checkIfValidPortnumber(65536); // false
```

That's all! 😃

### Feel free to share if you found this useful 😃.

---
Organic Advertising on Snapchat

Tags: snapchatmarketing, snapchat, marketing, digitalmarketing
Published: 2021-06-09 23:54:03

There's been a recent and exciting update for Snapchat Lens Creators😎! Lens creators are now able to see insights on their custom-made filters built on Lens Studio. Before, this type of information was uniquely available to Business Lenses (paid ads) only.  With these updates, creators of both business and community lenses can now have a more in-depth analysis of their creations.

These insights can provide information such as

➡Demographics

➡Interests

➡Geographic location (country).  Business lenses still provide more granular data.

➡Playtime of lens

➡Lens shares

In addition to these improved insights, creators can also see which lenses have been favorited (also a new feature for Snapchat filters).  So how does all come together to provide organic advertising for your brand?  HubSpot lists the three stages of a Buyer's Journey as

1.  Awareness

2.  Consideration

3.  Decision

and Snapchat advertising can be implemented at every stage of the journey - even with a minimal advertising budget for paid ads!  Here are a few ideas on how that would look...

1. Awareness
    Include your logo with a fun filter. LensStudio has a great resource of easy-to-use templates that can create a fun filter that also shows your logo as the users share their Snap.

2. Consideration
    The consideration stage requires a little more creativity. It's at this stage you want to share with your customer what problem you can solve for them. This can be done in a series of image files that are scheduled to rotate at periodic intervals.

3. Decision
   This is where the rubber means the road. You've made the customer aware of your brand and how your product or service can help them solve a problem they have. Now how can you encourage them to buy your product? My suggestion at this stage is to invest in the paid advertising.  With budgets as little as $5 a day the ROI can be great for conversion rates.  
‍
Looking to learn more? You can find me at https://withkoji.com/@TashaPenwell or https://www.prettynerdysocialmedia.com/blog-and-tutorials/organic-advertising-on-snapchat

Sources and Resources:  ‍

https://blog.hubspot.com/sales/what-is-the-buyers-journey

‍https://lensstudio.snapchat.com/
WWDC21 Keynote reactions with Lio Dion
Tags: wwdc21, apple, swift, podcast
Published: 2021-06-10 19:46:06

---
title: WWDC21 Keynote reactions with Lio Dion
published: true
date: 2021-06-09 23:23:46 UTC
tags: wwdc21, apple, swift, podcast
canonical_url: https://www.compileswift.com/podcast/s03-e01/
---

{% spotify spotify:episode:6BdNk5tBFQb9zXjD4RohUC %}

A very special episode with my friend Leo Dion from the EmpowerApps podcast joins me to talk about Apple’s WWDC21 Keynote.

You will want to listen to the EmpowerApps State of the Union episode where I join Leo to discuss the deeper dive into the developer details.

## As mentioned in the show

[EmpowerApps State of the Union episode](https://share.transistor.fm/s/ace13930)

[WWDC21 Keynote video](https://developer.apple.com/videos/play/wwdc2021/101/)

[YouTube video version of this episode](https://youtube.com/watch?v=6IEvRlyu904)

[Leo Dion - Bright Digit](https://brightdigit.com)

[EmpowerApps.show](https://www.empowerapps.show/)
Day 384 : Miracles
Tags: hiphop, code, coding, lifelongdev
Published: 2021-06-09 23:06:51

_liner notes_:
- Professional : Whew... what a day. Had some meetings. A team member wanted to do some testing with a web chat application. I pointed him to a Glitch project I made that they could remix, enter in some credentials and bam, they have a fully working chat application built with the Web Components I created. Spent the rest of the day coming up with a solution for a community question. I was running into some issues getting it to work initially and was speaking with the engineering team to get some insight. I thought about it more and came up with an alternative way to get it done. Worked on it and got it working! Told the community member with the question what I did and we'll see if it works for them.

- Personal : Last night, I added a page to the live show section of the side project that when not live will display a message and the next time the show will be live. Also worked on hooking up the countdown timer to the dashboard so that when I make changes in the dashboard, it reflects on the live show page. Came out pretty good.

![View from above of waves crashing on a beach in Palm Coast, United State](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/67tja7t5pxc0inscyexa.jpg)

The plan is to get Twitter and GitHub login working and place holders for other components I want to build. Everything is looking good on the project, but I'm not going to turn anway any miracles to ensure I get everything done by the deadline. haha Also, the first episode of "Loki" came out so I'll probably end the night watching that.

Have a great night!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube EtOhocK8uKI %}
The Best Algorithm to Start with Machine Learning
Tags: machinelearning, datascience
Published: 2021-06-11 19:11:46

---
title: The Best Algorithm to Start with Machine Learning
published: true
date: 2021-06-09 22:58:36 UTC
tags: #machinelearning #datascience
canonical_url: https://reinforcement-learning4.fun/2021/06/09/best-algorithm-start-machine-learning/
---

A good start point for Machine Learning is Linear Regression.

By studying the Linear Regression algorithm, you will learn:
- Supervised Learning
- Loss Functions
- Loss Functions minimization
- Regularization

These concepts are not exclusive to Linear Regression. They apply to other learning algorithms as well. By creating and deploying Linear Regression models, you acquire engineering skills that … [Continue reading The Best Algorithm to Start with Machine Learning →](https://reinforcement-learning4.fun/2021/06/09/best-algorithm-start-machine-learning/)
A Contemporary Guide on React State Patterns in 2021
Tags: react, javascript, redux, node
Published: 2021-06-09 22:38:34

Since the initial release of React in 2013, Facebook has rolled out a robust collection of tools to help developers with some of the minutiae of the web application development process, allowing them to focus on what matters most.

Despite React’s many capabilities and widespread adoption among developers, I’ve discovered that many of us face the same question: How can we handle complicated states with React? 

This post will look at what state is, how to arrange it, and alternative patterns to use as our applications become more complicated.

### UNDERSTANDING REACT STATE
React may be thought of as a blueprint in its most basic form. Your application will appear in a specific way depending on the status. React prefers declarative over imperative programming, a fancy way of stating that you express what you want to happen rather than the processes to get there. As a result, appropriately managing the state becomes critical, as the state determines how your program will act.

Read the full article [A Contemporary Guide on React State Patterns in 2021](https://mushfiqweb.com/a-contemporary-guide-on-react-state-patterns-in-2021/)
Slides from “Blogging Outside the Bubble” Perl talk
Tags: blogging, meetup, presentation, video
Published: 2021-06-11 15:11:49

---
title: Slides from “Blogging Outside the Bubble” Perl talk
published: true
date: 2021-06-09 22:36:06 UTC
tags: blogging,meetup,presentation,video
canonical_url: https://phoenixtrap.com/2021/06/09/slides-from-blogging-outside-the-bubble-perl-talk/?utm_source=rss&utm_medium=rss&utm_campaign=slides-from-blogging-outside-the-bubble-perl-talk
cover_image: https://i0.wp.com/phoenixtrap.com/wp-content/uploads/2021/06/Blogging-Outside-the-Bubble.gif
---

Just gave a five-minute lightning talk about blogging at [The Perl and Raku Conference in the Cloud 2021](https://perlconference.us/tprc-2021-cloud/). Here are the slides as a PDF.

[Download Blogging-Outside-the-Bubble.pdf](https://phoenixtrap.com/wp-content/uploads/2021/06/Blogging-Outside-the-Bubble.pdf)

## Update

[The conference YouTube channel](https://www.youtube.com/user/yapcna) posted the video of my talk (see below). I still need to get control of my "um"s and "ah"s.

{% youtube ZYaLT7H4dXg %}
Best Practices for Checking PropTypes in React Components using TypeScript
Tags: javascript, webdev, react, typescript
Published: 2021-06-09 22:35:55

JavaScript functions that return React elements are known as React components. These are the parameters that govern what will be added to the DOM. In addition, react components, like functions, may receive props as arguments, resulting in dynamically returned items.

Props can be of any data type, although component data types may differ. Component A, for example, may anticipate a name argument with a text data type, but component B may anticipate an age argument with a numeric data type. Likewise, D may anticipate an onClick argument with a Function data type, but C may expect a post parameter with an object data type with characteristics like title and date.

How can we tell our component what kind of data it should expect?

This may be done in various methods, but this post will focus on PropTypes and TypeScript. Despite holding identical goals, these two techniques operate in different ways. So we’ll go through what these tools are, how to use them, and tell them apart before trying more advanced techniques.

Prior knowledge of PropTypes and TypeScript is necessary for a thorough understanding of this article. You’ll also require an integrated development environment (IDE), such as Visual Studio Code.

## PROPTYPES
PropTypes is a type-checking tool for props in React apps that can be used at runtime. The PropTypes efficiency has been provided through the prop-types package since React 15.5. PropTypes let you specify the props that are expected in a component, such as whether they are mandatory or optional. You’ll get a warning in the browser’s JavaScript console if you provide a different type to an element or miss a required prop:

Read the full article [Best Practices for Checking PropTypes in React Components using TypeScript](https://mushfiqweb.com/best-practices-for-checking-proptypes-in-react-components-using-typescript/):
Changing the Prototype to a New Object
Tags: devops, tutorial, beginners, javascript
Published: 2021-06-09 22:18:04

* Up until now you have been adding properties to the `prototype` individually:
```
Dog.prototype.numLegs = 4;
```
* This becomes tedious after more than a few properties.
```
Dog.prototype.eat = function() {
  console.log("nom nom nom");
}

Dog.prototype.describe = function() {
  console.log("My name is " + this.name + ".");
}
```
* A more efficient way is to set the `prototype` to a new object that already contains the properties. This way, the properties are added all at once:
```
Dog.prototype = {
  numLegs: 4,
  eat: function() {
    console.log("nom nom nom");
  },
  describe: function() {
    console.log("My name is " + this.name + ".")
  }
};
```

#### Remember to Set the Constructor Property when Changing the Prototype
* There is one crucial side effect of manually setting the prototype to a new object. It erases the `constructor` property! This property can be used to check which constructor function created the instance, but since the property has been overwritten, it now gives false results:
* To fix this, whenever a prototype is manually set to a new object, remember to define the `constructor` property:
```
function Dog(name) {
  this.name = name;
}

Dog.prototype = {
  constructor: Dog, // <----
  numLegs: 4,
  eat: function() {
    console.log("nom nom nom");
  },
  describe: function() {
    console.log("My name is " + this.name);
  }
};
```
Understanding the Constructor Property
Tags: javascript, devops, tutorial, beginners
Published: 2021-06-09 22:07:43

* There is a special `constructor` property located on the object instance beagle that was created in the previous posts:
```
let beagle = new Dog();

console.log(beagle.constructor === Dog);
```
* This `console.log` calls would display `true` in the console.

* Note that the `constructor` property is a reference to the constructor function that created the instance. The advantage of the `constructor` property is that it's possible to check for this property to find out what kind of object it is. 
* Here's an example of how this could be used:
```
function joinDogFraternity(candidate) {
   if (candidate.constructor === Dog) {
     return true;
   } else {
     return false;
   }
}
```
* Here I just wrote a `joinDogFraternity` function that takes a `candidate` parameter and, using the `constructor` property, return `true` if the candidate is a `Dog`, otherwise return `false`.
* Note: Since the `constructor` property can be overwritten (which will be covered in the next two posts) it’s generally better to use the `instanceof` method to check the type of an object.
Learning JavaScript and Feeling Overwhelmed? Here's Some Good News
Tags: javascript, webdev
Published: 2021-06-09 22:06:35

Unfortunately, it's easy to feel overwhelmed and confused when you start learning JavaScript, or any programming language, for that matter. **The world of software is massive, there's just so many things to learn!**

Some of them think: "I'll never learn enough to be a good developer." Probably you are thinking the same too I have bad and good news about it, but **the good news outweigh the bad news**, thankfully.

On the one hand, you're right. There's lots and lots of things to learn. I've started learning my first language (JavaScript) when I was 13, as a hobby. Now, I'm 31 and I'm still learning about the language. And I'm sure I'll continue learning new things in the future.

On the other hand, **you don't need to know everything to be a good programmer.** I became a professional dev at 18 years old. At that time, I knew far less about JavaScript and other languages than I know now, but that didn't prevent me from get jobs and build amazing things in my career.

Think of programming languages as tools in your tool belt. **The more tools you have, the more things you can do.** But you already can do many things with the tools you already have.

And one of the keys to improve as a developer (and any skill) is just being persistent. If you keep learning and practising, you'll become a better programmer over time.

---

p.s. Did you like what you've read? Every week I send an email with free tips and insights to become a better JavaScript dev. If you're interested, [click here to subscribe](https://nicozerpa.com/newsletter/).
Iterating Over All Properties
Tags: javascript, devops, beginners, tutorial
Published: 2021-06-09 22:01:18

 * You have now seen two kinds of properties: own properties and `prototype` properties. Own properties are defined directly on the object instance itself. And `prototype` properties are defined on the `prototype`.
```
function Dog(name) {
  this.name = name; // own property
}

Dog.prototype.numLegs = 4; // prototype property

let beagle = new Dog("Snoopy"); 
```
* Here is how you add `dog`'s own properties to the array `ownProps` and `prototype` properties to the array `prototypeProps`:
```
let ownProps = [];
let prototypeProps = [];

for (let properties in beagle) {
  if (beagle.hasOwnProperty(properties)) {
    ownProps.push(properties);
  } else {
    prototypeProps.push(properties);
  }
}

console.log(ownProps); // display ["name"] in the console
console.log(prototypeProps); // display ["numLegs"] in the console
```
The same five Docker commands I have to look up every dang time (and one I always try to use that never works) 
Tags: docker
Published: 2021-06-09 21:56:37

I really don't know what it is about Docker (maybe that I need to mess with containers fairly infrequently, maybe that it's just different enough from git that I get confused between the two, absolutely that I don't remember which commands are for images and which are for containers) but for some reason I find myself looking up the same five commands every dang time. 

This post is primarily for me, so that I can stop digging through the Docker docs, but I figured some other folks might have the same problem as well. 

## Looking at stuff

* `docker ps` - lists running *containers*
* `docker image ls` - lists images (not containers) in the local directory 
* `docker logs [container_name]` - the container name will be at the end of the line of output of `docker ps` (images don't have logs; they're like classes)

## Creating & uploading a new image 

* `docker build . -t username/image:tag` - create a new image from a Dockerfile (in current directory) and context
* `docker commit` - this commits a *container*, not an image, stop using it to try and commit images to Dockerhub Rachael it 100% does not work
* `docker push username/image:tag` - pushes a built image to Dockerhub (you do not need to commit images, stop trying to commit images)

## Bonus: Docker compose

* `docker-compose down` - use this instead of `docker-compose kill` or when you restart the container it will still use the old image
* `docker-compose up -d` - use this to get new containers set up (`restart` will just wake up your containers w. the  same images), the detached flag keeps you from getting log spam
Using Prototype Properties to Reduce Duplicate Code
Tags: javascript, devops, tutorial, beginners
Published: 2021-06-09 21:52:31

* Continued.
* Since `numLegs` will probably have the same value for all instances of `Dog`, you essentially have a duplicated variable `numLegs` inside each `Dog` instance.
* This may not be an issue when there are only two instances, but imagine if there are millions of instances. That would be a lot of duplicated variables.
* A better way is to use `Dog’s prototype`. Properties in the `prototype` are shared among ALL instances of `Dog`. Here's how to add `numLegs` to the `Dog prototype`:
```
Dog.prototype.numLegs = 4;
```
```
function Dog(name) {
  this.name = name;
}

Dog.prototype.numLegs = 4;

let beagle = new Dog("Snoopy");
let husky = new Dog("Rex";
```
```
* Now all instances of `Dog` have the `numLegs` property.
```
```
console.log(beagle.numLegs); // will display 4
console.log(husky.numLegs); // will display 4
```
* Since all instances automatically have the properties on the `prototype`, think of a `prototype` as a "recipe" for creating objects. Note that the `prototype` for `beagle` and `husky` is part of the `Dog` constructor as `Dog.prototype`. Nearly every object in JavaScript has a `prototype` property which is part of the constructor function that created it.
Kubernetes Developer Workflow tools?
Tags: discuss
Published: 2021-06-09 21:38:14

---
title: Kubernetes Developer Workflow tools?
published: true
description: 
tags: discuss 
//cover_image: https://direct_url_to_image.jpg
---

Hi,

I'm writing some articles about developer workflow tools for people using Kubernetes. Some of the apps I'm writing about are for fast feedback while writing code that runs in clusters, like Tilt, Skaffold and DevSpace.

The other pretty obvious class of tools is the tools for provisioning local clusters like MiniKube, Docker Desktop, k3s, and kind.

I'm wondering what other tools people are using when you do Kubernetes development that you find handy?
Understanding Own Properties
Tags: javascript, devops, tutorial, beginners
Published: 2021-06-09 21:34:49

* Continued.
* In the following example, the `Dog` constructor defines two properties: `name` and `numLegs`:
```
function Dog(name) {
  this.name  = name;
  this.numLegs = 4;
}

let greyHound = new Dog("Sakura");
let bullDog = new Dog("Tanjiro");
```
* `name` and `numLegs` are called own properties, because they are defined directly on the instance object. That means that `greyHound` and `bullDog` each has its own separate copy of these properties. In fact every instance of `Dog` will have its own copy of these properties. The following code adds all of the own properties of `greyHound` to the array `ownProps`:
```
function Dog(name) {
  this.name  = name;
  this.numLegs = 4;
}

let greyHound = new Dog("Sakura");
let ownProps = [];

for (let properties in greyHound) {
  if (greyHound.hasOwnProperty(properties)) {
    ownProps.push(properties);
  }
}

console.log(ownProps); // the console would display the value ['name', 'numLegs']
```