teleren/devto huggingface dataset:
Mutable and Immutable
Tags: javascript, immutable, programming, node
Published: 2022-06-26 16:22:00

Honestly, this article is my old personal note as I was in programming bootcamp. Why do I end up to bring this to you? My colleague said that `.forEach()` will mutate the array but `.map()` won't. Hm. It is true but it is not so true..

In JavaScript, there are primitive and non-primitive value. As [MDN](https://developer.mozilla.org/en-US/docs/Glossary/Primitive) said, **primitive value is data that is not an object and has no methods or properties** such as string, number, bigint, boolean, undefined, symbol, and null.

Thus, the rest will be categorized as non-primitive (Objects). For example, Object literal, Array, Set, Map, Function, and even Class & Instance because it could has a method/property.

Let us see to the example code below:
![Immutable](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/g6psrbnyc5sj8g069mq7.png) 

![Mutable](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tn0jlx1kpj0b0ag3ukgk.png) 

What actually happened to the primitives are **the original value can not be altered**. The original value still exist in memory and can be accessed as long as its variable not be assigned to another value.

The opposite thing happens to **objects literal, array, and function**. With those data types, the variable **will refer to the same address where the original value at**. That's why it is named **Referenced-type Objects**.

So, please be careful with referenced-type objects because you could not access the original value once the its variable has been passed into another variable and then computed.

The conclusion is:

> Primitives are passing their value but non-primitives are passing their value's address.

In addition, **referenced-type objects are always mutable even tho they are declared as `const`**. 
![const is not relevant](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d5liu489yrrdmo9wijtc.png) 
Important thing to remember, variable declaration, `const `and `let `merely are about re-assign-ability the variable name. Presumably, a keyword to help programmer to be consistent and attentive during development.

Many people I know tends to use `let` if they would like to change the element of array or property of object in the next line. But I never do that because that's not how the `let` aimed for. You just change the inside or the part of the value, not the entire value.

For the last!
About `.forEach()` and `.map()` as I was mentioned above

![.forEach() and .map() is not relevant](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ljxctddf6mcxohs6pzkm.png)

The `.forEach()` and `.map()` methods have different purpose. `.forEach()` is void method, it is just do the looping. `.map()` is non-void method, it creates a new array from which the elements got from the result iteration of the calling array.
SP Flash Tools v6.2208 in Ubuntu 22.04
Published: 2022-06-26 16:10:22

1. Install deps:
```bash
$ sudo apt install libqt5serialport5-dev python3-pyqt5.qtserialport
 python3-pyside2.qtserialport qtxmlpatterns5-dev-tools python3-pyside2.qtxmlpatterns libqt5xmlpatterns5-dev libqt5xmlpatterns5
```
2. Download source code from [spflashtools.com](https://spflashtools.com/source/sp-flash-tool-v6-2208-source) to `/tmp` and extract it to `/tmp`:
```bash
$ cd /tmp
$ unzip -x ./SP_Flash_Tool_src_6.2208.zip
$ cd SP_Flash_Tool_src_6.2208
```
3. Edit `/tmp/SP_Flash_Tool_src_6.2208/Build/defines-linux.mk` and change `qmake` path to:
```bash
QMAKE                         := /usr/bin/qmake
```
4. Compile sources:
```bash
$ cd /tmp/SP_Flash_Tool_src_6.2208
$ make
$ cd /tmp/_Output/linux/debug/
$ chmod +x ./SPFlashToolV6.sh
```
5. Edit startup script `SPFlashToolV6.sh` and change library path as follows:
```bash
 LD_LIBRARY_PATH=$dirname:/usr/lib/x86_64-linux-gnu/
```
6. Start app:
```bash
$ ./SPFlashToolV6.sh
```
7. Remember to copy app dir `/tmp/_Output/linux/debug/` somewhere else, so it won't be removed after reboot.
Đất Nền Thổ Cư
Published: 2022-06-26 16:07:02

Datnenthocu là đơn vị môi giới bất động sản uy tín với nhiều năm kinh nghiệm trong nghề, chúng tôi cam kết mang lại những thông tin thật, sản phẩm thật, giá trị thật đến quý nhà đầu tư và khách hàng.
Website: http://datnenthocu.org/ 
Address: 134 Nam Hòa - Quận 9 - Hồ Chí Minh
Phone: 972817893
Email: datnenthocu@gmail.com
#datnenthocu #muabannhadat #datnengiare #nhapholienke #batdongsan #phanlobannen
twitter: https://twitter.com/trucle50574693
youtube: https://www.youtube.com/channel/UCkidIdl4Gap_WEsVOykoigg
pinterest: https://www.pinterest.com/Datnenthocu/_saved/
https://www.tumblr.com/blog/view/datnenthocu
https://datnenthocuorg.wordpress.com/
What Website Would You Like to Create a New UI For?
Tags: discuss, webdev, ux, programming
Published: 2022-06-26 16:03:55

As the title says, what website would you like to restyle? 

Maybe the minimalistic design of Google isn't for you? Or maybe Stack Overflow's UI has seen its last days? Or are you perhaps a lover of dark themes and your favorite website lacks that?

Let us know in the comments and don't forget to vote up comments you agree with :)
Unpacking JavaScript 02: Object Oriented JS(OOJS) part 2 - Classes
Tags: javascript, webdev, programming, tutorial
Published: 2022-06-26 15:47:51


Classes are “special functions” underneath, everything we have talked about in terms of prototypical objects and inheritance applies in classes, only the expression is different, for example inheritance is achieved with the `extends` keyword. Unlike function declarations, classes do not get hoisted, you must declare a class before use. You can both declare and express a class


## Class declaration

  

```js

  

class twoDArray{
    // varibales 
	length = 0
	
	// called on initialization
	 constructor(arr){
	    this.Array2d = arr 
	 
	 } 
	
	
	getValue(x, y){
	  // method 
	
	}
	
	setValue(x, y){
	   //method
	}

}


twoDArray.prototype.ln = function(){
   return this.length

}
  

```

## Class expression

class expressions can omit the name/identifier

  
 Named expression

  

```js

  

let myClass = class twoDArray{

  

}

  

```

  

Unnamed expression

  

```js

  

let myClass = class {

  

}

  

```

## Static Methods and properties

These are methods and properties that can be accessed without instantiating a class, the more you use classes the more useful they become. A perfect example is the JS Math class, another the Reflect object which we will explore in the metaprogramming section, you never initialize it but can access methods and properties (which basically the meaning of static)


```js

  

Math.PI // static variable

  

Math.random() // static method

  

// this is an example not the actual Math class code

  

class Math {

  

	static PI = “pi value”,



	static random(){



	 // computes and returns a random number



	}

  

}

  

```

To round static methods let’s create a simple trig class with static methods and properties, how about converting degrees to radians, that could be useful.

```js

  

 class Trig {

  

 static radians(degrees){

  

 return 2 * Math.PI * (degrees/360)

  

 }

  

}

  

console.log(Trig.radians(180)) // should log 180 in radians

  

```

Static methods can be very useful when you want to hide the implementation of a class, one example is the singleton pattern where a single instance of a particular object is created, state managers are a good example of this, state is managed by a single object and accessible anywhere in the application, it’s a global object.

So far, we have not done any focused project, I think this a good point just to bring everything together, we will build a 2d array module, and as a bonus we will implement the observer pattern, design patterns are a crucial part OOP.

# conclusion

If you want a programming buddyI will be happy to connect on [twitter](https://twitter.com/MhlunguSfundo) , or you or you know someone who is hiring for a front-end(react or ionic) developer or just a JS developer(modules, scripting etc) **I am looking for a job or gig** please contact me: [mhlungusk@gmail.com](mailto:mhlungusk@gmail.com), twitter is also fine

Thank you for your time, enjoy your day or night. until next time
CS Major advice
Tags: beginners, programming
Published: 2022-06-26 15:46:36

Hello all. I’m a CS major transferring from a community college to a major university. This fall will be my junior year and I have absolutely no coding experience, however the love and passion for technology and computers has persisted since a young age. Nevertheless Any advice or suggestions to do well? Or even things I can be doing the rest of this summer to also help prepare will be great. Ty!
Why does the code in Nodejs and Bowers run differently
Tags: help
Published: 2022-06-26 15:41:02

I'm learning the combination inheritance of JavaScript, but I found the code in Nodejs and Bowers run differently。

```
(() => {
  function Supertype (name) {
    this.name = name;
    this.colors = ['red', 'blue', 'green'];
  }

  Supertype.prototype.sayName = function () {
    console.log(this);
  };

  function SubType (name, age) {
    Supertype.call(this, name);
    this.age = age;
  }

  SubType.prototype = new Supertype();
  SubType.prototype.sayAge = function () {
    console.log(this);
  };

  const instance1 = new SubType('Nicholas', 29);
  instance1.colors.push('black');
  console.log(instance1.colors);
  instance1.sayName();
  instance1.sayAge();
})();

```

**In Bowers(Edge of the last version)**


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/eoy395zbvoceoysudz23.png)


**In Nodejs(17.1.0)**


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9tzbuyzwni3aki35ru34.png)



Of course, the result is the same, but I wonder why the name of this is different, it confused me。
Node JS Convert Image File to Base64 String Example
Tags: webdev, javascript, node, tutorial
Published: 2022-06-26 15:32:27

Today what you are going to learn:
Hey,

In this lesson you will learn node js convert image file to base64. you will learn node js convert base64 string to image. you can see node js image to base64 string convert. step by step explain how to convert image to base64 in node js.

I will give you simple solution with full lesson of how to convert image to base64 string in node js. let's see solution with lesson:

## [for more](https://www.freecoder.co/post/node-js-convert-image-file-to-base64-string-example-1338)
Algunas ligas relevantes al Software Defined Video Sintesis
Published: 2022-06-26 15:30:50

Como la funcion interesante para la sintesis de video (Text:HTML) esta siendo removida, estoy investigando en que otro software puedo hacer render de animacion definida en codigo html/css/ javascript

https://www.mltframework.org/
https://jliljebl.github.io/flowblade/features.html
https://gstreamer.freedesktop.org/apps/
http://wechselspieler.sourceforge.net/


{% youtube pUAi4Cgj49Q %}

https://wave.video/blog/how-we-render-animated-content-from-html5-canvas/

https://codepen.io/matt-west/pen/DyRJax

https://stackoverflow.com/questions/43018004/ffmpeg-encoding-for-html

https://github.com/daybrush/scenejs-render

https://github.com/tungs/timecut

https://stackoverflow.com/questions/61520364/how-to-record-an-html-animation-and-save-it-as-a-video-in-an-automated-manner-i

https://wave.video/blog/how-we-render-animated-content-from-html5-canvas/

https://github.com/AndyLinGitHub/Software-Defined-Video-Streaming
Node JS Resize Image Before Upload using Multer Sharp
Tags: webdev, javascript, tutorial, node
Published: 2022-06-26 15:30:10

Today what you are going to learn:
Hello Brother,

In this quick lesson let's see node js resize image before upload multer. you can understand a concept of node js compress image before upload. we will help you to give lesson of node.js image uploading with multer. This article goes in detailed on node js multer sharp resize image. you will do the following things for nodejs sharp resize image lesson.

I will give you step by step simple lesson of how to resize image before upload using multer, sharp with node js and express js. this lesson we will simple upload image and resize with 200X200 and quality will be 90%. let's follow bellow steps:

## [for more](https://www.freecoder.co/post/node-js-resize-image-before-upload-using-multer-sharp-6765)
File Upload in Node JS using Multer Example
Tags: webdev, node, javascript, tutorial
Published: 2022-06-26 15:28:50

Today what you are going to learn:
Hello Brother,

In this lesson you will learn node js express file upload lesson multer. i explained simply about node.js express upload file lesson. This tutorial will give you simple lesson of node js file upload using multer. i would like to share with you node.js file uploading with multer.

I will give you step by step simple lesson of file upload using multer with node js and express js. let's follow bellow steps:

## [for more](https://www.freecoder.co/post/file-upload-in-node-js-using-multer-example-4061)
How to upgrade node.js version in Ubuntu?
Tags: webdev, node, javascript, beginners
Published: 2022-06-26 15:27:31

Today what you are going to learn:
In this post i want to share about how to update node version in ubuntu OS. I would like to share this post because i try lot to update my node js package. When i install 0.10.25 nodejs but i want to update nodejs current latest version. At that time i did try lot to upgrade but i can't update my node.

I have ubuntu 14.04 OS. One time i was working on native script framework and i need to update nodejs package at that time my Project Manager give me some command for update nodejs current version. I don't know where he found but now my system have latest version of node. So if you also want to update then run following command.

sudo npm cache clean -f

sudo npm install -g n

sudo n stable

node -v

**

## [for more](https://www.freecoder.co/post/how-to-upgrade-nodejs-version-in-ubuntu-3777)
**
How to Create a Blog Website with Laravel 9
Tags: webdev, laravel, php, programming
Published: 2022-06-26 15:25:36

Today what you are going to learn:
Laravel is the most popular PHP framework. People prefer this framework to build their web applications. While building a website with Laravel, you probably want a blog on your website. In general, Laravel is not a blogging platform like WordPress where you get all the backend stuff ready to manage your articles. Building the blog system from scratch is quite time-consuming work. Thanks to the Canvas package which makes Laravel developer’s life easy by providing a cool publishing platform for Laravel.

Using the Canvas package, we can easily build our blog in Laravel without investing a lot of time. Canvas already did hard work for managing the blog’s backend stuff. All you need to do is just get the data and display it on the front matching your design.

Having said that, let’s take a look at how to create a blog with Laravel using the Canvas package.

[for more](https://www.freecoder.co/post/how-to-create-a-blog-with-laravel-9)
Paracetamol.js💊| #154: Explica este código JavaScript
Tags: javascript, webdev, spanish, programming
Published: 2022-06-26 15:13:12

## **<center>Explica este código JavaScript</center>**
#### <center>**Dificultad:** <mark>Básico</mark></center>

```js
const obj = {
  mi-saludo: "Hola mundo"
}

console.log(obj.mi-saludo)
```

A. `SyntaxError: Unexpected token '-'`
B. `Hola mundo`
C. `ReferenceError: obj is not defined`
D. `Ninguna de las anteriores`

Respuesta en el primer comentario.

---
Paracetamol.test.js🧪| #6: Testea este código JavaScript
Tags: javascript, webdev, spanish, testing
Published: 2022-06-26 15:11:43

## **<center>Testea el siguiente código JavaScript</center>**
#### <center>**Dificultad:** <mark>Básico</mark></center>

```js
//arr.test.js
const filtrarPares = (arr) => {
  return arr.filter((item) => item % 2 !== 0);
};

test("[1,2,3,4,5] => [1,3,5]", () => {
  const res = filtrarPares([1, 2, 3, 4, 5]);
  expect(res).toBe([1, 3, 5]);
});
```

A. `❌ FAIL tests, Object is equality. If it should pass with deep equality, replace "toBe" with "toStringEqual"`
B. `✅ PASS tests, [1,2,3,4,5] => [1,3,5]`

Respuesta en el primer comentario.


---
#100DaysOfCode Recap day 7-13
Tags: webdev, javascript, programming
Published: 2022-06-26 14:53:02

## Second week summary challenge Recap:

This week big focus was not about building projects but more of backtracking and review some fundamentals. Sometimes we forget the fundamental once we start building some projects, after awhile of not reviews, we tend to forget what we learn. I went back to coding challenges, learning some problem solving from code wars and my custom Anki apps that have some good coding challenges using for loops. I'd use methods like split(), join(), includes(), filter(), and map(). train myself in problem solving and understand how to work out problems.

## Next week:

- More job search

- Work with MERN Stack
Learning React, Lessons from coding and Programming Memes.
Tags: beginners, programming, discuss, career
Published: 2022-06-26 14:48:55

I had a very ~~busy~~ codeful week and I learnt a lot.  I'm hoping that I could share them in detail soon but today, I'll be sharing a summary of my findings or lessons.

1. I learnt that there was a difference between External and Internal Link in React. In simpler terms, using NavLink and Link tags should be used for internal pages and a href tag would be used for external pages.

2. I've been struggling with a particular error "TypeError: can't read properties of Null (reading 'id'). I was on stack overflow a lot last week. I think I'll figure it out this week. 🤞🏽

3. I think I'm getting a hang of Supabase. It was really difficult at first, then I found a few resources that helped. 
However, I'm still unsure about my SQL policies and how I can get them to work with my tables. Again, I'm hopeful I'll figure it out this week.

4. Finally, DOM Purifiers. I think it's something that can help make input unreadable to script and tags. That is, it'll help to protect inner HTML's from reacting to Programming languages. I guess. I don't know if it works with React or if React is already protected in anyway.

Finally, 
Dear Developer I think Bugs, Errors and problems would always come but we'll always figure it out.

Don't get a burnout. Do what you love. See a movie or two. 
Live.💕


Until next week.

![Obito](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/229l3pq41q9zsxlunzy7.gif)


---


Oh😐 I promised Memes.


![dragon](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ygpbgnsk2b7wyr0kgj27.jpg)

Image Credit: Google 🔎

![drag](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/j6x9q7z1cxfmpgwqmlj6.jpg)

Image Credit: Google 🔎

![dragee](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d1db89dps8j037fb11rm.png)

Image Credit: Google 🔎

![draggg](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/cbih6qw6er866p8467sz.jpg)

Image Credit: @Dunsin_codes on 🐦


![dragon](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gd5dtg8xprdyavicaq37.jpg)

Image Credit: @euboid on 🐦


🤭☺️☺️Until later, and yes, Leave a comment or share a meme.

---
Tweet YouTube video with Google Chrome Extension
Tags: youtube, videotweet, twitter, thread
Published: 2022-06-26 14:38:04

---
title: Tweet YouTube video with Google Chrome Extension
published: true
description: 
tags: YouTube, VideoTWeet, Twitter, Thread
# cover_image: https://miro.medium.com/max/1400/1*1Oez-9mf4njZgz6-IpF3Fg.png
# Use a ratio of 100:42 for best results.
---

Posting a youtube video on Twitter seems a daunting task as it involve

* Downloading the Video
* Cropping videos to 2 minutes and 20 seconds or less.
* The minimum resolution for Twitter videos is 32 x 32 and the maximum resolution is 1920 x 1200 or 1200 x 1900
* Supported formats are MP4 and MOV on the Twitter mobile apps and, on the web, MP4 with H264 format with AAC audio
* The maximum file size is 512MB
* Upload each video individually one by one

Thanks to clippost.io Google Chrome Extension. It takes care of all of above requirements and convert full YouTube video into video tweet thread on Twitter with just a click. All you have to do it install and activate the extension.

Please follow below step by step guide to install and activate Clippost Google Chrome Extension on your browser

## Install Extension
Go to Google Chrome Web Store and search clippost or directly visit [Clippost Extension](https://chrome.google.com/webstore/detail/clippost/jnnhejfefoeenpmfimcmpkalencmogle)

## Enable Extension
This extension require activation. Please follow below steps to activate the extension in Google Chrome browser

1. Go to http://clippost.io and **LOGIN WITH TWITTER**
2. Go to top right click your profile picture to and select **Chrome Extension**
3. Enable chrome extension (If you have already enabled it just reload your page)

## How to use Extension
Clippost extension provide controls to post video tweet threads. Go to any youtube video page and you will see below controls

<figure class="wp-block-image size-large is-resized"><img src="https://lh3.googleusercontent.com/dhTHxeuXiccGjC3wRhPu7hDj8BBnyWRGTSjcNkk012ghaQ0g7QV46JM5ra_E7DayAxr_C30PzYDp-BQq16QmbYeAxg=w640-h400-e365-rj-sc0x00ffffff" alt="" width="636" height="398"/></figure>

You can select start and end time and click tweet icon to send tweet.

### Note:

1. If video length is more than 2 minute and 20 seconds it will automatically convert it into video tweet thread
2. Clippost currently only support videos which are under 1 hour duration
3. After posting tweet via extension you can visit [My Video](https://clippost.io/videos) section to check status of video (i.e. processing cropping downloading etc)

If you get into any issue please do let us know at info@clippost.io
Glossary of Crypto - 10 Terms that you should know - Part 2
Tags: blockchain, web3, beginners, motivation
Published: 2022-06-26 14:34:24

### DEX
Decentralized Exchange. A marketplace where peer to peer exchanges take place without the need for an intermediary. Transactions are fulfilled using programmed contracts and algorithms.

### Digital Asset
Any digital content with a perceived value. This can be images, documents, videos, mp3s and NFTs.

### Smart Contract
A computer protocol(set of programmed parameters) that is used to verify, enforce and facilitate a contract on the blockchain. Most notably used by the Ethereum ecosystem. Smart contracts are immutable once written to the blockchain. 

### CEX
Centralized Exchange. The opposite of a DEX where exchanges between parties are fulfilled using a central authority as a gateway. Assets are limited and only authorized parties can participate. 

### Arbitrage
Taking advantage of price discrepancy between different marketplaces. Selling the same asset for a higher price on a different market to make a profit. 

### Fungible
When one asset is interchangeable with another without the loss of value or characteristics. An example of this is the dollar. You can exchange one dollar for any other dollar and it will remain one dollar.

### FUD
FEAR, UNCERTAINTY and DOUBT. Typically used in the phrase “spreading FUD” This is when bad and potentially damaging information regarding protocols, individuals, technology etc. is distributed through media platforms. Often causing poor investor sentiment or reputation which can lead to loss.

### Fiat
An arbitrary order or decree. In regards to currency it is legal tender backed by a central authority. Examples are the US dollar in the form of cash or electronically represented in a bank.

### ELI5
ELI5(Explain it Like I am 5) This term is used to reduce complex topics into words that a 5yr old could understand.

### Custodial
A digital asset holding service that has possession of customer funds. Centralized in nature and often involved in crypto finance in order to provide customers with yield.

If you got something out of this and want to learn more about **cryptocurrency, web3 & finance**:

Follow me [@jamiesventures](https://twitter.com/jamiesventures) for more articles like this. **Thanks for reading!**