teleren/devto huggingface dataset:
How to quickly download Streaming Blob Video
Tags: webdev, download, streaming
Published: 2021-01-29 10:13:01

## Prerequesites

* Browser with DevTools (Chrome, Firefox, etc)

* [VLC](https://www.videolan.org/vlc/index.fr.html)

* [ffmpeg](https://evermeet.cx/ffmpeg/)

## Step 1 : Find the file which looks like to *playlist.m3u8*

First of all, go to the website with the streaming video and launch it.

If you inspect with the Chrome Devtools, you will see a blob link (which is not allowed to directly download)

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

Go to the Network panel and find a file which looks like to *playlist.m3u8* and download it.

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

## Step 2 : Find segment track files URL

Stay at the Network panel and find at least two segment files.

Sometimes you could find one segment for the audio track and one for the video track.

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

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

## Step 3 : Edit the *playlist.m3u8* file

Open the file with a Text Editor (Notepad, Sublime Text, etc)

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

You will see several lines with the relative URL *chop/segment*. Append the full URL of the segment track.

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

You need to do it twice. (audio track / video track)

```bash
seg-1-v1-a1.ts → http://videosource.site/seg-1-v1-a1.ts
```

## Step 4 : Open and convert with VLC

* Open VLC and go the File > Convert/Stream .

* Drag&Drop the *playlist.m3u8* file as the media source.

![Alt Text](https://i.stack.imgur.com/dvdpL.png)

* Select Customize profile and set Encapsulation: MP4/MOV, Video and Audio: "Keep original …". 

![Alt Text](https://i.stack.imgur.com/l0QrR.png)

* Apply and then specify the output filename.

* Click to Save as File and wait until the converted file finished.

## Step 5 : Merge the audio and video track together

After converted with VCL (twice if you have the audio and video track splitted)

Run this command with *ffmpeg* :

```bash
./ffmpeg -i video.m4v -i audio.m4a -acodec copy -vcodec copy merged-output.mp4
```

## Alternatives

* [JDownloader2](https://jdownloader.org/)


## Links

[https://stackoverflow.com/questions/29876518/how-to-download-video-from-m3u8-file](https://stackoverflow.com/questions/29876518/how-to-download-video-from-m3u8-file)
Building my next feature in public (on Twitter)
Published: 2021-01-29 09:35:03

Thought I'd try building the next feature for my Twitter bookmarking browser extension (https://markfolder.com) in public. It'll be to allow a user to make their folder public and shareable. 

Requirements:

- Folders are private by default.
- User can set a folder as public.
- User can name the folder's public path.
- User can easily view and copy the folder's path.

I'm building this with Laravel 7 + Bootstrap 4.

Not really done this before so let's see how it goes! I'll be posting regular updates on Twitter at https://twitter.com/farez. If you're keen on following, here's the thread: https://twitter.com/farez/status/1355086498878513153
please help me with this
Published: 2021-01-29 09:17:44

function longestWord(sentence) {
  console.log(sentence);
var long = sentence.split(' ');
  var longest = 0;
  for(var i = 0;i<long.length;i++){
    if(long[i].length>longest){
      longest = long[i].length;
    }
  }
  return longest;
}
How to solve Cors Problem in angular front end and node js backend while API Post Request..
Tags: angular, node, webdev, devops
Published: 2021-01-29 08:58:47

Hi all,
I am working on WebApis.
And Create a localApi for Post Method using Node Js.
When I hit the API using Angular (FrontEnd) the CORS Problem Occured. So I have added some code to Node js server. And Again I get the Same Error. 

The Code Which I add in Serve Side:

app.use((function(req, res, next)  {
    res.header('Access-Control-Allow-Origin', 'http://localhost:4200');
    res.header('Access-Control-Allow-Headers', "Origin, X-Requested-with, Content-Type, Accept, Authorization");
    res.header('Access-Control-Allow-Methods', 'GET,HEAD,PUT,PATCH,POST,DELETE');
    return res.status(200).json({});
    next();
}));
Can any one say which point i am wrong ?
HTTPS Domain Forwarding for Free via GitHub Pages
Tags: codenewbie, webdev, beginners, tutorial
Published: 2021-01-29 08:56:17

This week I decided to move my homepage from [`alvinlim.me`](https://alvinlim.me) to [`alvinlim.dev`](https://alvinlim.dev).

I remembered that my domain name registrar offered a free [URL redirect](https://www.namecheap.com/support/knowledgebase/article.aspx/384/2237/what-is-url-redirect-and-how-does-it-work/) service, and I decided to use that forward `alvinlim.me` to `alvinlim.dev`. While that worked for `http://alvinlim.me`, clicking `https://alvinlim.me` instead threw an SSL error.

Basically, for the URL redirect of `https://alvinlim.me` to work, `https://alvinlim.me` first had to be recognized by the browser as a valid website, and this meant it had to have a valid SSL certificate attached to it. 

This meant I had to set up a website for `https://alvinlim.me`, attach a SSL certificate to it, and configure the HTML to redirect the browser to `https://alvinlim.dev`. 😅

This raised the question -- wouldn't setting up the website and SSL certificate be expensive? That's when I remembered that I could quickly set up a free website on [GitHub Pages](https://pages.github.com/), connect it to my `alvinlim.me` domain, and GitHub Pages would even provision and attach an SSL certificate to it for free! Since I already had the `alvinlim.me` domain, I decided to go with this option.

So I created a [new repo on GitHub](https://github.com/alvinqingxing/homepage-redirect) which hosts an `index.html` file which is empty except for the important [meta refresh tag](https://www.w3.org/TR/WCAG20-TECHS/H76.html) which redirects the browser to the new URL:

```
<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="refresh" content="0; URL=https://alvinlim.dev">
  </head>
  <body></body>
</html>
```

I next [created a GitHub Pages site](https://docs.github.com/en/github/working-with-github-pages/creating-a-github-pages-site) from that repo and [attached my domain](https://docs.github.com/en/github/working-with-github-pages/managing-a-custom-domain-for-your-github-pages-site) to it. In the GitHub Pages settings I then selected the ["Enforce HTTPS" option](https://docs.github.com/en/github/working-with-github-pages/securing-your-github-pages-site-with-https).

With all this in place, clicking [`https://alvinlim.me`](https://alvinlim.me) no longer throws an SSL error but instead correctly redirects the browser to [`https://alvinlim.dev`](https://alvinlim.dev).
Cloud App vs Web App
Tags: cloud, cloudskills, webdev, cloudnative
Published: 2021-01-29 08:28:05

Web app pros

    It is quite simple to maintain web apps since a common code base is used by them across several platforms.

    It is possible to create web apps for all platforms so long as they can run in a web browser.

    Unlike other app types, web apps happen to be more inexpensive upfront.

    It is not imperative for the updates to these apps to go through an app store. This implies that there is no need for users to manually manage the apps. Once a web app is opened by a user, the most recent version will always load.

 
Web app cons

    The scope of web apps is much less in terms of leveraging hardware and device features.

    A web app cannot be run without a browser. The user must take more steps for using a web app.

    Users will be interacting with various web browsers, and the performance metrics and usage patterns used for creating a product roadmap happen to be more challenging in terms of collection.

    As compared to other app types, web apps are much less responsive as well as slower.

    Unlike native apps, web apps are less intuitive and less interactive.

    With web apps, the number of branding opportunities is quite less.

Cloud app pros

    Cloud apps allow people to share info easily and quickly, employing shared storage, and thus, they help enhance collaboration.

    Cloud enables us to easily access store info and quickly anytime anywhere by using an Internet connection.

    The production plus efficiency of an organization is increased by an internet cloud infrastructure by making certain that data is accessible at all times.

    These types of apps minimize software as well as hardware maintenance expenses for the companies.

    A huge storage capacity is offered by the cloud for storing important data like documents, audio, graphics, and video in a single place.

    One major benefit of cloud-based apps happens to be data security. Cloud helps to make sure that information is stored and handled safely.

 
Cloud app cons

    One of the biggest drawbacks of cloud apps is that companies might face problems while transferring their services between vendors.

    Cloud users do not have much control over the functionality and implementation of services within a cloud infrastructure.

    Even though top-notch security is offered by cloud service for storing essential info, it is important for you to recognize that you’re sending all the sensitive data of your company to a 3rd party before adopting cloud technology.

    Data is accessed by users from the cloud using an Internet connection. The users can’t access data in case the Internet connection is not up to the mark. Unfortunately, this is the only way to access information from the cloud.

Let's see here comparison between Cloud app vs Web app:https://www.rlogical.com/blog/what-are-the-pros-and-cons-of-cloud-apps-vs-web-apps/
Create and drop oracle table example
Tags: oracle, database, sql, snippet
Published: 2021-01-29 08:28:14



Let's create an example table in an existing Oracle schema, which holds data about bookmarks. Also add some comments as metadata to the table itself and to a column:

```sql
CREATE TABLE bookmark (
    id                 NUMBER(10, 0), -- number 10 digits before the decimal and 0 digits after the decimal
    title              VARCHAR2(255 CHAR) NOT NULL, -- String with a maximum length of 255 charachters
    url                VARCHAR2(500 CHAR) UNIQUE NOT NULL, -- holds unique values across the table data
    category      VARCHAR2(500 CHAR) NOT NULL, -- holds unique values across the table data
    is_public      NUMBER(1, 0) NOT NULL, -- plays the role of a boolean '0'-false, '1'-true ,
    created_at   DATE NOT NULL, --  when the entry is created
    PRIMARY KEY( id )
);

COMMENT ON TABLE bookmark IS
    'Table holding data about bookmarks';

COMMENT ON COLUMN bookmark.is_public IS
    'Boolean like 1-is public accessible, 0-is private';
```

With the table now created, we can now insert values in it with the following syntax

```sql
INSERT INTO bookmark ( id, title, url, category, is_public, created_at )
VALUES (
    1,
    'BookmarksDev - Bookmarks and Code Snippets Manager',
    'https://www.bookmarks.dev',
    'developer-tools',
    1,
    TO_DATE( '2021-01-01', 'YYYY-MM-DD' )
);

INSERT INTO bookmark ( id, title, url, category, is_public, created_at )
VALUES (
    2,
    'CodepediaOrg - Share code knowledge',
    'https://www.codepedia.org',
    ' blog',
    1,
    SYSDATE -- current time in oracle
);

SELECT * FROM bookmark;
```

To remove the table, all rows from the table, table indexes and domain indexes are removed with the following command

```sql
DROP TABLE bookmark;
```

<hr/>

<p class="note_normal">
  Shared with love from <a href="https://www.codever.dev/snippets/60009253e6eb82224c98e4bb/details">Codever</a>.
  Use the <a href="https://www.codever.dev/snippets/60009253e6eb82224c98e4bb/details" class="copy-to-mine-btn"><i class="fa fa-copy"></i> Copy to mine</a> functionality to copy this snippet to your own personal collection and easy manage your code snippets.
</p>
onClick event in React Js
Published: 2021-01-29 08:09:28

Hi all

Could anybody help me to fix the problem:

https://stackblitz.com/edit/react-v4pmfd?file=public%2Findex.html

When I transfer props from child component (Taskform) to it parent (App) and click (X) button in Taskform, the result show error " this.props.onCloseForm is not a function, in this.props.onCloseForm(), 'this.props.onCloseForm is undefined.

I try and spin around but can not pass through.

Thank alot
Testing Blockonomics Payment API's Locally
Tags: tutorial, beginners, testing, programming
Published: 2021-01-29 08:08:23

In this tutorial, we are going to understand how to test our Blockonomics Payment APIs locally without deploying them to the production/testing environment. 

# What is Blockonomics?
Blockonomics is a decentralized Bitcoin payment solution that provides you with specialized transactional tools to enhance your BTC use. With Blockonomics, you can generate Bitcoins by accepting it on your online stores, as well as utilitarian features such as creating P2P invoices, sending emails via Bitcoin, and tracking your wallet addresses. Create your Blockonomics Account- [here](https://www.blockonomics.co/merchants?ref=hPga3rGcrDj45w1C2jzkDMUPGBkCRYxNE6)

# What we’re building
We are going to understand the use of reverse proxy, allowing us to create a public URL for the code which is local to our system. Using the public URL, we can place it as an endpoint to the HTTP Callback URL required by Blockonomics.  

# Setting Up
In order to expose our code to the public URL's, we shall use the Ngrok. Later, we will generate the public URL which actively listens to a specific port on our local system. This allows us to communicate from that port with the rest of the world!

## Installing Ngrok 
To install Ngrok on your machine, refer to the [official page](https://ngrok.com/download). After you download, navigate to the directory and type `ngrok.exe http 8000`. This will start listening to the `8000` port and you can see a terminal page like this: 
 ![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/os3jlyiz2yeoy3mxyd9o.png)

In my case, the public URL is `http://7db20c5efe6d.ngrok.io` and I can make requests on this URL and it will redirect those requests to my localhost at the specified port, in our case port `8000`. 

## Configuring HTTP CallBack URL
Once you have a public URL listening to your localhost, you can use it as a webhook to test the Blockonomic Payment APIs. For example, you have configured a `/receive/` route that is responsible for processing the requests coming from Blockonomics about the status update of the transactions, then you should set up the HTTP Callback URL as `<your_ngrok_domain>/receive` on [this page](https://www.blockonomics.co/merchants#/page3) and this will redirect the Blockonomics requests to your localhost at the specified route. 
Thus, you can test your logic and the Blockonomics Payment APIs without deploying them to any cloud platform.   

# The END

Here is the youtube video, explaining the entire tutorial on testing the Blockonomics Payment API's locally. If you have any queries, feel free to use the comments section!

{% youtube 6Ydk32avIgo %}
Enough JavaScript to get you Started : #19 IIFE✨
Tags: javascript, beginners, 100daysofcode, webdev
Published: 2021-01-29 08:04:30

### IIFE ✨
👉 IIFE or `immediately invoked functions as expressions` simply refers to a function which runs as soon as it is defined.
<br>

👉 Which means if you have to write a function which runs in beginning of your web app , you can use IIFE.
<br>


👉 in early days if we want to do something like this we need to define a function and call it... <br>

👉 but with IIFE design pattern the syntax and the code makes much more sense. <br>

👉 IIFE takes 2 parentheses , one is meant for defining a anonymous function and another is meant to call the anonymous function.

👉 **`Syntax`**
```
(
  // anonymous function
  function () {
    //function body
})();
```
<hr>
👉 We'll create one IIFE which will greet user as soon as he/she comes to our website 😀 <br>
👉 **`Example : the old way`**
```
function greet () {
    alert('hello user ! how are you?');
}

greet();
```
👉 **`Example : the new way`**
```
(function(){
    alert('hello user ! how are you?');
})();
```

👉 **`Example : Arrow functions as IIFE`**

```
( () => {
      alert('hello user ! how are you?');
})();
```
<p>Let me know in comment section if you have any doubt or feedback. it's always worth to give time to the thriving developer community :) <br>
<br>
Keep Coding ❤
</p>

#### Hey , Let' Connect👋
 [Twitter](https://twitter.com/codarsh) /
 [Github](https://github.com/WhoAdarshPandya/)
Buy Geometry Dash: Read Apps & Games Reviews
Published: 2021-01-29 08:01:34

Welcome to [Geometry Dash](https://geometry-dash.io/).
[Geometry Dash](https://geometry-dash.io/) is a rhythm-based platformer game developed and published by RobTop Games. 
It was released for $1.99 USD on August 13, 2013 for iOS and Android, and for $3.99 USD on December 22, 2014 for Steam. 
A lite version of the game is available on mobile devices with fewer features, as well as free expansions, Geometry Dash Meltdown, Geometry Dash World and Geometry Dash SubZero, which include exclusive levels.

The player takes the form of different entities with unique mechanics such as a cube, a ball or a UFO. 
Using one-touch gameplay, the player must try to navigate through a series of interactive obstacles, movement-shifting transporters and behaviour-manipulating portals to reach the end of levels without crashing, all while listening to exciting soundtracks along the way.
Basics of LOLCODE
Tags: lolcode, programming, language
Published: 2021-01-29 07:58:34

This is a basic tutorial about how to code using a fun language called LOLCODE. 
So LOLCODE is an esoteric programming language created in 2007 by Adam Lindsay, researcher at the Computing Department of Lancaster University.

Any program of LOLCODE has a starting using "HAI [version name]" and ends with "KTHXBYE", basically what we can say in normal language a "hi" in starting and "ok, thanks, bye" in the ending. 

HAI 1.2
KTHXBYE

Now to print something, we use VISIBLE keyword and put the output statement after the statement, here is an example of writing Hello world -> 

HAI 1.2
VISIBLE "HAI WORLD!"
KTHXBYE

We can write comments too using BTW (for single line) and OBTW (for multi line) as follows->

BTW this is a comment 

OBTW
this is a
multi line 
comment
TLDR

Remember that TLDR is used to end a multiline comment.
This is just a short intro to LOLCODE, to learn more, [here](https://www.tutorialspoint.com/lolcode/index.html) is one of the site you can refer to.

You can also view a demo video here -
{% youtube 5cqEzvLEvnA %}
Ask? How to take Facebook Facebook to support tool Download Facebook video.
Tags: facebook, token
Published: 2021-01-29 07:50:11

Currently I am making an application to download Facebook videos through a web browser (My website: https://sfull.net ). And I am having problems with Private videos that need to login to get a link, I want to ask if there is a way to get a virtual facebook account tooken, then to be able to GET that video without logging in?
Thanks?
Fireboy and Watergirl: Online on the App Store
Published: 2021-01-29 07:26:21

[Fireboy and Watergirl](https://fireboyand-watergirl.io) are an exciting series of adventure games developed by Oslo Albet and Jan Villanueva. 
Fire, Water, Forest, Ice, Light, Wind, and Crystal, seven brand new temples for the official Fireboy and Watergirl series. 
In each temple the boy and girl must run and jump between fire and water, you should know that Fireboy is immune to fire, so he can step freely in pools of boiling lava, but he must be careful from stepping into the water. 
Watergirl is resistant to pools of water but gets hurt when stepping in the lava. 
Let us join with two main characters on the journey to remote, dangerous temples, to seek unimaginable wealth. 
The temple is full of sparkling diamonds waiting to be discovered only by the bravest. 
Solve the puzzles, beat the times, and collect all the diamonds! 
What are you waiting for? 

Controls https://fireboyand-watergirl.io
Use the W-A-S-D keys to control the Watergirl.
Use the Arrow keys to control the Fireboy.
What is SEO and How to rank your website!
Tags: seo, webdev
Published: 2021-01-29 02:42:17

Every day thousands of websites are created by different people from all over the world. SEO is a process of getting 
Benefits of SEO

1.Increase organic traffic for a site thereby Increase ranking

2.Generate leads

Mainly SEO in two types.

1] On Page Optimization- Doing changes within the website like URL structure, web content etc.
2] Off Page Optimization- Build back links for websites with high authority sites

Read more About SEO Here 👉 <a href="https://contentallover.blogspot.com/2021/01/rank-your-websit-with-seo-what-is.html">Rank your Website with SEO!</a>

Some of the Main SEO On Page factors are listed below.

1. Title Tag: It is the title for the webpage.

2. Description Tag: Summary of the webpage is called Description Tag .

3. Header Tags: Mostly web content is divided into paragraphs. Each paragraph should have heading H1, H2 format. Use targeted keywords in H1&H2.

4. URL Structure: Avoid long URL structure with unnecessary special characters.

5. Robots.txt: This is a text file which tells crawlers whether to crawl the website or block.

6. Sitemap: It is an xml file which consists of all URL’s of a website. Faster indexation of all URL’s is possible through this.

7. Canonicalization: Without creating Duplication Error Loading same pages from different URL’s.

8. Bread Crumb Structure: It is the navigation for the user to move front and back pages in the website.

9. 301 Redirection: The 301 redirect is a permanent redirect page. It will redirect to new URL from an old URL.

Some of the Main SEO Off Page factors are listed below.

1. Directory Submissions: This is one of the popular forms of link building. It is a process of adding website or website URL to a web directory.

2. Social Bookmarking: Saving favorite URL’s in online is termed as Social Bookmarking.

3. Forum Submission: Forum link building/Posting service is a SEO technique which helps in building back links to your site.

4. Business Profile Creation: Submit your profile in top local business listing sites.

5. Article Submission: This is a process of submitting article about a product or service in article submission sites.

Some of the important On page and Off page techniques are mentioned above. Through these techniques we can bring traffic to our website.
Laravel's Eloquent whereTime() filtering method
Tags: laravel, eloquent, php, framework
Published: 2021-01-29 07:16:25


Laravel provides many additional methods other than **standard methods**. You might be familiar with `where()`, `orWhere()`, `whereJsonContains()` or `whereJsonLength()`. And these additional methods are worth checking.

In this article, we will see `whereTime()`, one of the supplementary methods that comes in handy when you want to compare the table's field value with a specific time.

## `whereTime()`

The `whereTime()` method helps to get records matching the specific time.

### Sytnax

```php
whereTime('fieldName', 'operator', 'time');
```

- The first parameter is `fieldName` with which a comparison is to be done.
- The second parameter is an `operator` for comparison, such as `=`, `<>`, `>`, `>=`, `<` or `<=`.
- The third parameter is a `time` for comparison in `HH:MM:SS`.

### Example

```php
$users = User::whereTime('login_at', '11:12:31')->get();
```

Read the complete post on our site [Laravel's `whereTime` Model Method](https://meshworld.in/laravel-additional-eloquent-where-time-clause/)

Read others post on our site [MeshWorld](https://meshworld.in)

Happy 😄 coding

With ❤️ from 🇮🇳