teleren/devto huggingface dataset:
HTML
Tags: html, javascript, tutorial, programming
Published: 2021-11-30 10:05:05

**<u>What is HTML</u>**

HTML is an acronym that stands for Hyper Text Markup Language which is used for creating web pages and web applications. Let's see what is meant by Hypertext Markup Language, and a Web page.

Hyper Text: Hyper Text simply means "Text within Text." A text that has a link within it, is a hypertext. Whenever you click on a link that brings you to a new webpage, you have clicked on a hypertext. Hyper Text is a way to link two or more web pages (HTML documents) with each other.

Markup language: A markup language is a computer language that is used to apply layout and formatting conventions to a text document. Markup language makes the text more interactive and dynamic. It can turn text into images, tables, links, etc.

Web Page: A web page is a document that is commonly written in HTML and translated by a web browser. A web page can be identified by entering an URL. A Web page can be of the static or dynamic type. With the help of HTML only, we can create static web pages.


Hence, HTML is a markup language that is used for creating attractive web pages with the help of styling, and which looks in a nice format on a web browser. An HTML document is made of many HTML tags and each HTML tag contains different content.

<u>**Features of HTML**</u>

1) It is a very easy and simple language. It can be easily understood and modified.

2) It is very easy to make an effective presentation with HTML because it has a lot of formatting tags.

3) It is a markup language, so it provides a flexible way to design web pages along with the text.

4) It facilitates programmers to add a link on the web pages (by HTML anchor tag), so it enhances the interest of browsing of the user.

5) It is platform-independent because it can be displayed on any platform like Windows, Linux, and Macintosh, etc.

6) It facilitates the programmer to add Graphics, Videos, and Sound to the web pages which makes it more attractive and interactive.

7) HTML is a case-insensitive language, which means we can use tags either in lower-case or upper-case.
How to filter an array - JavaScript
Tags: webdev, javascript, beginners, tutorial
Published: 2021-11-30 09:57:36

Think you have a basket having some fruits in it, Watermelon, Mango, Pear, Peach. Now, you want to eat green fruits so you took Pear and watermelon. This is what we call **filter** and this same logic applies in `filter()` method.

In javascript, we can filter array using a built-in `filter()` method.

Let's go with the above example,
```js
const fruits = [
  {
    name: 'Watermelon',
    color: 'green'
  },
  {
    name: 'Mango',
    color: 'yellow'
  },
  {
    name: 'Peach',
    color: 'pink'
  },
  {
    name: 'Pear',
    color: 'green'
  },
]
```
and now you want to filter for only green fruits,
```js
const greenFruits = fruits.filter((fruits) => fruits.color === 'green')
```
and the output will be,
```js
[{
  color: "green",
  name: "Watermelon"
}, {
  color: "green",
  name: "Pear"
}]
```
{% youtube mmqg1dZWVy4 %}
Living in the Shell #6; sort
Tags: productivity, linux, bash, devops
Published: 2021-11-30 09:53:21

## `sort` 🆎

Sorts/randomizes input lines.

## Sort lexically

```sh
echo -n 'Zack\nAdam\nCharles' | sort
```

> ```text
> Adam
> Charles
> Zack
> ```

## Sort descending `-r`

```sh
echo -n 'Zack\nAdam\nCharles' | sort -r
```

## Sort numerically `-n`

```sh
echo -n '10 Zack\n5 Adam\n1 Charles' | sort -n
```

> ```text
> 1 Charles
> 5 Adam
> 10 Zack
> ```

## Sort human-readable size numerics `-h`

```sh
echo -n '1G\n1K\n23MB' | sort -h
```

> ```text
> 1K
> 23MB
> 1G
> ```

## Check sorted state `-c`

```sh
echo -n 'Zack\nAdam\nCharles' | sort -c
```

> ```text
> sort: -:2: disorder: Adam
> ```
>
> (Exits with a nonzero exit code that indicates unsorted input.)

## Shuffle/randomize `-R`

```sh
echo -n 'Zack\nAdam\nCharles' | sort -R
```
<h1> Hello Dev Community! </h1>
Published: 2021-11-30 08:45:21

It's just a delight to be here among you all. I've been looking for for a community that can be a source of inspiration and motivation for through my coding journey. I believe that having you all in my circle will be help me horn my skills way better.
I hope to be a source of inspiration to many thst come after me into the tech world.
Develop apps with biosensors and neurointerfaces
Tags: programming, opensource, github, python
Published: 2021-11-30 08:34:25

Useful links:

- [Github repo](https://github.com/brainflow-dev/brainflow)
- [Website](https://brainflow.org/)
- [Docs](https://brainflow.readthedocs.io/en/stable/)

A few examples built with BrainFlow:

- [EMG arm gesture recognition in julia and its usage in games](https://levelup.gitconnected.com/how-to-code-a-biosignal-control-system-from-scratch-in-40-hours-54290c1eb0c7)
- [SkyrimVR mod which uses EEG for magic](https://www.nexusmods.com/skyrimspecialedition/mods/58489)
- [Research apps](https://brainflow.org/gallery/)


[BrainFlow](https://github.com/brainflow-dev/brainflow) provides a uniform SDK to work with biosensors with a primary focus on neurointerfaces. It provides SDK for Python, Java, C#, C++, Matlab, R, Julia and Rust. 
Core part of BrainFlow is written in C\C++ and all bindings call methods from dynamic library. User API is uniform for all supported devices and allows you to develop device agnostic applications.

Let's take a look at one of [examples](https://brainflow.readthedocs.io/en/stable/Examples.html#python) from BrainFlow docs.

Install BrainFlow for Python:
```
python -m pip install -U brainflow
```
Basic example which records data for 15 seconds:
```python
import time
import numpy as np

import brainflow
from brainflow.board_shim import BoardShim, BrainFlowInputParams, BoardIds


def main():
    BoardShim.enable_dev_board_logger()

    # BrainFlowInputParams and board id provided to BoardShim constructor are the only device specific arguments
    params = BrainFlowInputParams()
    # synthetic board is one of many features which speedup development
    board = BoardShim(BoardIds.SYNTHETIC_BOARD, params)
    board.prepare_session()
    board.start_stream(45000, 'file://data.csv:w')
    time.sleep(15)
    # data is a standard 2d numpy array
    data = board.get_board_data()
    board.stop_stream()
    board.release_session()

    print(data)



if __name__ == "__main__":
    main()
```

For examples with signal processing algorithms and more advanced samples please refer to github repo
Clean Code - Laravel
Tags: php, laravel, programming, beginners
Published: 2021-11-30 08:31:42

Let's get started quickly In some cases, clean code must be used as in the following
```php
// Don't do this
Post::where('category_id', $category->id)
    ->where('author_id', $user->id)
    ->first();
// Do this
Post::whereBelongsTo($category)
    ->whereBelongsTo($user, 'author')
    ->first();
```
```php
// Don't do this
$post->author_id == $user->id;
// Do this
$post->author()->is($user);
```
I hope you enjoyed the code.
Login Signup Form with Email Verification
Tags: php, javascript, otp, naemazam
Published: 2021-11-30 08:31:33

Login Signup Form with Email Verification is a Working PHP based Sine Up from with Working OTP generating System, It's Working On Local Host.

If You Don't Know How to configure XAMPP to send Mail from Localhost in PHP ? You can [Read](https://dev.to/naemazam/how-to-configure-xampp-to-send-mail-from-localhost-in-php--382c) My Another Blog. 

Design Your Registration Home page Simple
```php
<?php require_once "controllerUserData.php"; ?>
<?php 
$email = $_SESSION['email'];
$password = $_SESSION['password'];
if($email != false && $password != false){
    $sql = "SELECT * FROM usertable WHERE email = '$email'";
    $run_Sql = mysqli_query($con, $sql);
    if($run_Sql){
        $fetch_info = mysqli_fetch_assoc($run_Sql);
        $status = $fetch_info['status'];
        $code = $fetch_info['code'];
        if($status == "verified"){
            if($code != 0){
                header('Location: reset-code.php');
            }
        }else{
            header('Location: user-otp.php');
        }
    }
}else{
    header('Location: login-user.php');
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title><?php echo $fetch_info['name'] ?> | Home</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
    <style>
    @import url('https://fonts.googleapis.com/css?family=Poppins:400,500,600,700&display=swap');
    nav{
        padding-left: 100px!important;
        padding-right: 100px!important;
        background: #6665ee;
        font-family: 'Poppins', sans-serif;
    } 
    nav a.navbar-brand{
        color: #fff;
        font-size: 30px!important;
        font-weight: 500;
    }
    button a{
        color: #6665ee;
        font-weight: 500;
    }
    button a:hover{
        text-decoration: none;
    }
    h1{
        position: absolute;
        top: 50%;
        left: 50%;
        width: 100%;
        text-align: center;
        transform: translate(-50%, -50%);
        font-size: 50px;
        font-weight: 600;
    }
    </style>
</head>
<body>
    <nav class="navbar">
    <a class="navbar-brand" href="#">Brand name</a>
    <button type="button" class="btn btn-light"><a href="logout-user.php">Logout</a></button>
    </nav>
    <h1>Welcome <?php echo $fetch_info['name'] ?></h1>
    
</body>
</html>
```
In Here I make An Email-OTP System Which is Based On PHP, and js. 
Visit My [GitHub](https://github.com/naemazam/Login-Signup-Form-with-Email-Verification#readme) to know more.
How to use window.confirm()
Tags: webdev, javascript, beginners, tutorial
Published: 2021-11-30 08:23:47


Hello everyone, I am back with a new article on how you can use `window.confirm()` Browser API in JavaScript.

`window.confirm()` let you to ask confirmation before performing a important action; for example: deleting something or posting something

Let's look it by an example:
```js
  const warn = confirm('You are going to delete this post, are you sure?')
```
This will show you a **confirmation** message.
![window.confirm() example](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/woc5ihcbqkj6xtkbh23j.png)

Now, how you can check whether user has **confirmed** or not?
```js
  const warn = confirm('You are going to delete this post, are you sure?')
if(warn){
	console.log('User has confirmed')
}
```
***
{% youtube aagkRZh64xI %}
Postman Hacks
Tags: javascript, beginners, programming, productivity
Published: 2021-11-30 08:07:01


Postman is an API platform that allows you to create and use APIs.

Postman streamlines collaboration and simplifies each phase of the API lifecycle, allowing you to design better APIs faster. Let's start testing.

![testing](https://media.giphy.com/media/3orieKKmYyvUdR3RkY/giphy.gif)

Table Of Content
🥦 Environment variables
🥦 Generating random names
🥦 Postman Console
🥦 Path variable



---
## Environment variables
Duplicating codes and links during API testing is always a hassle. 
First, highlight the <kbd>url</kbd> and set it as a variable. 

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

Now imagine writing this whole <kbd>baseUrl</kbd> for every instances of GET, POST, DELETE, PUT and PATCH request. It get tiresome. There is a hack to this.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3w2imnsyypics4xx96mo.PNG)


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7o58dlx4ftbpu7t7oq3p.PNG)

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

---
Also, when you can set token as variable with few steps. Highlight the token and set it as a variable.
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d3avt157ysmc6y56r0pn.PNG)

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

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


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

---
## Generating random names
This is my favorite, ever want to register new users and your brain just ran out of <kbd>John Doe</kbd>. Do not worry, help is on the way. This generate random name and email

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

## Postman Console
Postman also has its own console, where you may see a log of server responses. 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/umgdx1bcozey5c26eg9z.PNG)
 

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

## Path variable
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1p1gpb7urn2t1swhp6bi.PNG)
 
 

## Conclusion
This is just a quick overview of what you can do with Postman to test APIs.
Googling what postman can accomplish will provide you with more functionality.
Thank you for taking the time to read this.
HTML only image fallback
Tags: webdev, programming, html, tutorial
Published: 2021-11-30 08:03:06

Some days ago I was doing something to personalize my Github profile page and I needed a way to display an image in case the loading of one from a service was failing (if you are curious you can read it [here](https://medium.com/@albertodeagostini.dev/how-to-add-random-images-in-github-profile-page-74aedf268464)).
So I needed a basic fallback for an image, should not be an issue, right?

That is pretty easy to achieve using Javascript, if you google it you will find lots of solutions using jquery but also using a super simple javascript line like this:

```html
<img src="https://not-existing-url/not-existing-image.jpeg" onerror="this.src = 'error.jpg';"
```

## HTML only
The problem for me is that I needed an HTML pure solution because Github strips every script from the readme (for security reasons).

> Fun fact: I've found a solution but that doesn't work anyway in Github profile page because this solutions uses a tag that is removed too, always for security reasons

So after some search and digging I've found this solution (thanks to [Patrick McElhaney](https://twitter.com/patrick_mc))

```html
<object data="https://not-existing-url/not-existing-image.jpeg" type="image/jpg">
  <img src="fallback-image.jpeg" />
</object>
```

That's it. You can see it (and play with it) in the codepen below

{% codepen https://codepen.io/albertodeago/pen/gOxQZPy %}

## How it works
The solutions involves the `object` tag as you may have noticed. This is a pretty unknown HTML element that can be used to display multimedia content, like videos, images, PDFs and so on.. It can be used also to display other webpages, so it may be though as the brother of `iframe`. It will display what you pass in the `data` attribute, instead the HTML you put 'inside' the tag is going to be used as a fallback in case the browser does not support the tag or if the source is not correctly loaded. So this works great for both [old browsers](https://caniuse.com/mdn-html_elements_object) and for content that fails to load (like in my case).
As always if you want to dig deeper [MDN docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/object) are always the first place to go.

## Conclusion
So this is the only solution I've found really working with just HTML.
There are solutions also with CSS but they involves knowing the image dimensions, and that was not ok in my case because the embedded image was dynamic.
If you know a better approach please comment here or reach me on [my twitter](https://twitter.com/albertodeago88)
Version Control Systems
Published: 2021-11-30 07:46:27

Version Control also known as _revision control, source control or source code management _is a class of systems responsible for managing changes to computer programs, documents and large websites.
Vcs records changes to a file or set of files over time so that you can recall specific versions later.

Version control systems are most commonly run as stand alone applications.
**Reasons to use version control system**
* To be able to manage changes on the source file and also manage and support team development.
* Version control remembers the history and hence you can always return to earlier versions if you have screwed up the current file.
* Version control also allow us to organize and make co-ordinate changes to the code base and supports co-development across system borders.
* You can always return to earlier version since it remembers the history.
*Most Integrated Development Environments(IDE) offer support for one or more version control systems.

**Types of version Control systems**
1. Local Version control systems
This is to copy files into another directory, the approach is common due to its simpleness but its very prone to error. As it is easy to forget which directory you're in and accidentally write to the wrong file or copy over files you don't mean to.

2. Centralized version control systems which were developed to enable people to collaborate on code and documents with people on different systems that may not share a common file system.The systems include CVS, subversion and perforce have a single server that contains all the versioned files and a number of clients that check out files from that central place.

3.Distributed systems
Here the client mirror the complete repository and not just the latest version of each file. The user then synchronize local repository with the copy on the server.The disadvantage of distributed system is that the local repository of various users on a project can be very out of sync with each other making the job harder when the versions have to be merged again.Example of this system include Git.

<u>Process of implementing Git</u>
If having a linux system, Git is most likely already installed on your system. On macOS, git is available through Xcode which is not always the most recent version. On windows you can use WSL.
Downloads for all systems are available on the download section of the main git website.
The Eclipse IDE comes in with built-in support for  Git through the standard plug-in EGit.

4.Cloud services
These are companies which offer hosting services for open source projects or have a free access for academic accounts. Examples includes Github, Gitlab and SourceForge.

<u>Importance of using Cloud services</u>
*It ensures that the code is stored safely off-site.
* Git and mercurial are systems that are maintained and supported by various hosting services for example vcs provides training in Git.
*Centralized version control systems have asimler concept than the distributed ones.
* It also allows you to check which systems are supported by an IDE before using it.
How do I check if a string contains something in Python?

Published: 2021-11-30 07:45:20

## What does the python string carries?

Python string carries refers to what's protected in a [python](https://drasticcode.com/) string.

It can be any substring, integer fee, character, the normal expression can be said as python string carries substring, python string carries an integer, python string carries character, python string carries regex (normal expression).

Why will we need to recognise what [python](https://drasticcode.com/) string carries?
We want to recognise what python string carries due to the fact it can create hassle whilst executing the conditional statements; it's miles higher to apprehend it.

## [Python string carries sub-string](https://drasticcode.com/python-string-contains/)

How may want to we recognise python string carries sub-string?
There are few techniques that you may comply with to recognise if python carries a sub-string or not.

**Methods are given below:
**
[String carries](https://drasticcode.com/python-string-contains/)
In-operator
Find 
Index.
String carries
The string carries a integrated technique in [python](https://drasticcode.com/) to recognise whether or not the python string carries any other string or not. 

It will go back the Boolean fee as output whilst the string carries substring; then, it's going to show true. Otherwise, it's going to show false.

Let’s apprehend it with the assist of an example:

**Example:**

`#python string contains method
#python string contains sub-string

my_str = "Hello Drastic code"
 
substring = "code"
 
if (my_str.__contains__(substring)):
    print("String contains sub-string !")
else:
    print("String does not contain sub-string")`

## Output:

`String contains sub-string !
`
Cisco 200-901 DEVASC Practice Exam 
Tags: cisco, devasc
Published: 2021-11-30 07:27:21

Cisco Certified DevNet Associate 200-901 certification exam come with a number of advantages. Passing Developing Applications and Automating Workflows using Cisco Core Platforms 200-901 exam is a valuable way to boost skills; it can also give you advantages in the job market. When employers conduct interviews, the competition is often tough. If you have the Cisco Certified DevNet Associate 200-901 certifications and the other candidate does not then you will be preferred for job. 200-901 exam is often extremely difficult to prepare. To prepare and pass this Developing Applications and Automating Workflows using Cisco Core Platforms 200-901 exam, you need consistent study with multiple resources which is a big challenge due to busy working schedules. This is the top reason of the candidate’s failure in Cisco Certified DevNet Associate 200-901 exam. Braindumpsstore is the most iconic and trusted platform which provides the best 200-901 exam preparation resource. Braindumpsstore offers updated and 100% correct Cisco Certified DevNet Associate 200-901 practice exam that is enough to prepare and pass this DEVASC 200-901 exam on the first attempt. This Cisco [200-901 Practice Exam](https://www.braindumpsstore.com/cisco/200-901-dumps) is created by our Cisco professionals who are well educated. You do not need to waste a lot of money or time, use Cisco Certified DevNet Associate 200-901 practice exam because it will clear your all concepts related to final exam and you will easily prepare and pass 200-901 exam with confidence. By practicing with Cisco Certified DevNet Associate 200-901 exam, you feel the real exam environment and it will remove your final DEVASC 200-901 exam stress. So, start preparation with this best resource and pass your Cisco Certified DevNet Associate 200-901 exam on the first attempt.
HTML tags | doctype
Tags: html, tags, doctype
Published: 2021-11-30 07:05:24

In HTML, the doctype declaration **is the required preamble found at the top of all documents**. Its sole purpose is to **prevent a browser from switching into so-called** ["quirks mode"](https://developer.mozilla.org/en-US/docs/Web/HTML/Quirks_Mode_and_Standards_Mode) when rendering a document; that is, the `<!DOCTYPE>` doctype ensures that **the browser makes a best-effort attempt at following the relevant specifications**, rather than using a different rendering mode that is incompatible with some specifications.

All HTML documents must start with a `<!DOCTYPE>` declaration.

The declaration **is not an HTML tag**. It is an "information" to the browser about what document type to expect.

In **HTML 5**, the declaration is simple:

```
<!DOCTYPE html>
```

In older documents (HTML 4 or XHTML), the declaration is more complicated because the declaration must refer to a DTD (Document Type Definition).

**HTML 4.01**:
```
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
```

**XHTML 1.1**:
```
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
```

The `<!DOCTYPE>` declaration **is not case sensitive**.

[Definition](https://developer.mozilla.org/en-US/docs/Glossary/Doctype)