teleren/devto huggingface dataset:
Publishing your OpenAPI documents automatically with NodeJS and Express
Tags: node, openapi, documentation, express
Published: 2020-07-13 11:44:16


Writing that OpenAPI spec document is one thing, but how can you make sure it's viewable to everyone who needs it? 

There are plenty of commercial tools for sharing API information around (https://www.postman.com/ is a great example), but what's a difficult thing to do if your API is for public consumption.

You could maintain a copy on your website somewhere?  Make the OpenAPI spec available so people can copy-paste to https://editor.swagger.io/?

We've tried both and found that it's hard work to maintain an up-to-date version without doing some additional automation on deployment.

Training people to check the file from the repo, copy-paste it to the online editor.. yea that works as well as you would expect it too.

Why not just expose the OpenAPI document in a nice format directly on the API? 

The code to do this is really, really simple.

We're going to use [swagger-ui-express](https://www.npmjs.com/package/swagger-ui-express) by [Stephen Scott](https://github.com/scottie1984)

```javascript
    const express = require('express')
    const swaggerUi = require('swagger-ui-express')

    const router = new express.Router()
    const jsYaml = require('js-yaml')
    const fs = require('fs')

    // Our document is YAML, if yours is JSON, then you can just
    // `const openApiDocument = require('spec/openapi.json')`
    // instead.
    const openApiDocument = jsYaml.safeLoad(
        fs.readFileSync('spec/petstore.yaml', 'utf-8'),
    )

    // We can enable the explorer also!
    const options = { explorer: true }

    router.use('/api-docs', swaggerUi.serve)
    router.get('/api-docs', swaggerUi.setup(openApiDocument, 
        options))

    // If you're not using a `router`, you can use
    // `app.use('/api-docs', swaggerUi.serve,
    //    swaggerUi.setup(swaggerDocument, options));

    ....

```

And that's about it.  Firing up our app and heading over to `https://mycool.io/api-docs` and you should see something like this:

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

Now, every time you deploy your API, the latest version of the OpenAPI document will be available for all to see. 

Thanks, I hope this helps someone get their API documentation in front of the people who need it - I've also written an article on [Handling API validation with OpenAPI (Swagger) documents in NodeJS](https://dev.to/scampiuk/handling-api-validation-with-openapi-swagger-documents-in-nodejs-17d0) and [OpenAPI (Swagger) specifications that write your tests for you (sort of)](https://dev.to/scampiuk/openapi-swagger-specifications-that-write-your-tests-for-you-sort-of-4kc5) 

Header image by [rawpixel](https://pixabay.com/photos/adult-break-business-caucasian-2449725/#_=_)
Checkout Form with HTML CSS using Bootstrap 5
Tags: webdev, html, css, beginners
Published: 2020-07-13 11:41:43

Using HTML CSS we create a form that allows us to checkout billing details when people might have a cart or purchase. Programming this with Bootstrap 5 will allow the markup to be easier, with the new syntax allowing for applying margins, columns and rows easily. Bootstrap 5 forms are really cool so worth checking out as they have been redesigned in general.

{% youtube IrUp98s8B7Q %}
<strong>[Youtube: Checkout Form HTML CSS](https://youtu.be/IrUp98s8B7Q)</strong>

* Bootstrap 5 template
* Checkout form content
* Checkout Form Layout
* Checkout Form Username
* Checkout Form Select
* Checkout Form Checkbox
* Checkout Form Radio
* Checkout Form Credit Card
* Checkout Form Button

Their current website address for the v5 library is here:
https://v5.getbootstrap.com/

You can view the full example below (code included)
https://v5.getbootstrap.com/docs/5.0/examples/checkout/

## Follow and support me: 
Special thanks if you subscribe to my channel :)
* [🎞️ Youtube](https://www.youtube.com/channel/UCvM5YYWwfLwpcQgbRr68JLQ?sub_confirmation=1)
* [🐦 Twitter](https://twitter.com/adrian_twarog)
* [💬 Discord](https://discord.gg/nGdThpE)
* [❤ Patreon](https://www.patreon.com/adriantwarog)

## Want to see more:
I will try to post new great content every day. Here are the latest items:
* [Adobe XD to Fully Responsive WordPress Site](https://dev.to/adriantwarog/adobe-xd-to-fully-responsive-wordpress-site-16e0)
* [Adobe XD to HTML Full Process](https://dev.to/adriantwarog/adobe-xd-to-html-full-process-ao6)
* [Full Tutorial on how to use SASS to improve your CSS](https://dev.to/adriantwarog/full-tutorial-on-how-to-use-sass-to-improve-your-css-57on)
* [Creating a Mobile Design and Developing it](https://dev.to/adriantwarog/creating-a-mobile-design-and-developing-it-5c4o)
Data Science
Published: 2020-07-13 11:35:17

Data analytics have multiple meaning, it depends on the context of usages. The general understanding of the term is that when we obtain a set of data points from the subject under test, we try and make some sense of the data and we try to understand the subject better.
Example:-The Youtube collects the records of previous videos you have watched and tries to find a video which is close to the set you have watched. There are three main steps which go behind the data analytics first is the “problem definition  ”  its very important to define specially what we know from the data before doing any analysis, the second step is applying statistical technique to process the data it means that what user want, And the third is “Answer the Question” by using the relationship we have deduced in the Data Generally computational Program are written to do this step. . Statistical analysis has several steps:-
1) Cleaning the Data.
2) Assessing the Quality of the Data.
3) Main Data Analysis.
Ones the above three steps are done, we are finally ready to Answer the main Question we have set forth with.
Data Science Course goes through various names in various fields. Social network analysis financial Engineering, Business Analytics, computational neuroscience etc. Have ever wondered how youtube magically lists up the videos of your taste in its suggestion it just because of Data Analytics.
Below are the Tools for Data Analytics:-
R Programming. R is the leading analytics tool in the industry and widely used for statistics and data modeling
Tableau Public
SAS
Apache Spark
Excel
RapidMiner
KNIME
QlikView

As the above discussion we can say that Data Analytics is very Important in the field of software development because we can use it in various field which we have already Discuss above this all about Data Analytics.

https://intellipaat.com/blog/tutorial/python-tutorial/
Make the most of your github profile
Tags: github, tutorial, tips
Published: 2020-07-13 11:33:24

Now that everyone is using the special repository on github that makes your account stand out, let's make the most out of it. 

<hr>

### Profile hit counter by [jwenjian](https://github.com/jwenjian/visitor-badge)

page_id is your github username and since it is a special repo having your username page.id is also your username.
```
![visitors](https://visitor-badge.glitch.me/badge?page_id=page.id)
```

<hr>

### Custom badges by [shields.io](shields.io)

You can show off your talents and skills, the even support JSON parsing so you can display some amazing dynamic parameters and stats.
For example I want to show number of followers on my github

https://api.github.com/users/peopledrivemecrazy this url returns 

```json
{
  "login": "peopledrivemecrazy",
  "id": 3922469,
  ...,
  "followers": 11, //this is what I need
  "following": 2,
  "created_at": "2013-03-20T15:55:56Z",
  "updated_at": "2020-07-13T09:20:50Z"
}
```
This has followers we can query with https://shields.io/ (scroll down a bit and you will find dynamic)
So I would use

![Dynamic badge](https://dev-to-uploads.s3.amazonaws.com/i/81njhtekngfhhf0u6lyg.png)

<hr>

### More stats by @anuraghazra

{%github https://github.com/anuraghazra/github-readme-stats %}



<hr>

### Adding more dynamic features by @dylburger

{%post https://dev.to/dylburger/show-your-most-recent-dev-post-on-your-github-profile-with-pipedream-21h5 %}


<hr>

Lastly, if you are actively posting on dev and want a quick template to your profile please check my post 

{% post https://dev.to/shriji/dev-to-github-profile-assistant-p8f %}

You could combine all the above and make a beautiful profile on github.


<hr>

Thanks for reading, here is the doggo tax

![](https://placedog.net/640?random)
###### *woof*
2 Useful tools for coding 
Published: 2020-07-13 11:28:40

In this article, I’m going to talk about two useful tools for coding learners and professionals.

* Codepen
* Stack overflow
	
	
##Codepen##

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/ftxr98rg30mbjgf6luvt.png)<figcaption>Figure 1 - Codepen logo</figcaption>

>**CodePen** is an online community for testing and showcasing user-created HTML, CSS and JavaScript code snippets. It functions as an online code editor and open-source learning environment, where developers can create code snippets, called "pens," and test them... [Wikipedia](https://en.wikipedia.org/wiki/CodePen)

 The **codepen project editor** is good for small front-end code snippets and testing, it's not recommended for large projects,
but it's cool for beginners. It's also useful when you are learning something and want to test it, or want to share small snippets or techniques with others, or want to test a part of a big project and see how it works.

##Stack overflow##

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/ye0cee3yj6j10hso9c3g.png)<figcaption>Figure 2 - Stack overflow logo</figcaption>

>**Stack Overflow** is a question and answer site for professional and enthusiast programmers. It is a privately-held website, the flagship site of the *Stack Exchange* Network, created in 2008 by Jeff Atwood and Joel Spolsky. It features questions and answers on a wide range of topics in computer programming...[Wikipedia](https://en.wikipedia.org/wiki/Stack_Overflow)

Stack overflow is a great question and answer site
and also one of the best. I recommend that you use it during learning, but when you are in any question and answer site you shouldn't rely on them, you ask when you have searched for the question and didn't find any helpful results, so asking on these sites are the last thing you can think about.

**links for the sites**

* [Stack overflow](https://stackoverflow.com/)
* [Codepen](https://codepen.io/)
Bootstrap 5 Login Form
Tags: css, html, webdev, weeklyui
Published: 2020-07-13 11:25:34

As you know recently bootstrap launch bootstrap 5 alpha version with new inserting features. So here we made one login form using the Bootstrap 5 CSS framework with basic CSS properties.

In this element, we used the grid and also used new upgrade input fields in bootstrap 5. Also, we used one block button which is cover entries blocks and also we used utility classes of bootstrap 5. Here we also used media quires to make our this login form fully responsive and user-friendly.

Make it yours now by using it, downloading it, and please share it.

[Get Source Code](https://w3hubs.com/bootstrap-5-login-form/)
Watch Movies While You Code In i3 Window Manager !
Tags: i3, i3wm, linux, productivity
Published: 2020-07-13 11:13:09

Many browsers have recently introduced Picture In Picture feature. You can pop out a video and place it on a corner on screen while you do other things.

If you're using i3 window manager, here are the lines you need to add in your i3 config to make Picture In Picture browser window available on all workspaces :
```
for_window [title="Picture-in-Picture"] sticky enable
```
Sticky windows, as the name suggest will make the window stuck on screen whichever workspace you go to.

You can also make any other windows stick on your screen like this. For this you need to first make a window `floating` and then make it `sticky`.

Add these lines to your i3 config file :
```
bindsym $mod+Shift+space floating toggle
bindsym $mod+Shift+S sticky enable
```
Go to the window, say VLC media player, press the key combo `Meta+Shift+Space` first (this will make window float) and then `Meta+Shift+S`. Now the window will be sticky. You can then resize the window to the size you need with `Meta+R`. Drag to move the window to the position of your choice !

VLC & other players have a `compact mode` which removes the interface and plays the video in full width available. You can use that to fit the video completely in the floating+sticky window. For SMPlayer, compact mode can be toggled with `CTRL+C`.

[Post originally from here](https://subinsb.com/i3-make-picture-in-picture-window-seen-on-all-workspaces/). See [my i3 config](https://github.com/subins2000/dotfiles/blob/master/i3/.config/i3/config)

![](https://dev-to-uploads.s3.amazonaws.com/i/k8dvwyauddqfus86i7p9.png)
What's the Difference Between AI, Machine Learning, and Deep Learning?
Tags: ai, automation, machinelearning, aivsmlvsdl
Published: 2020-07-21 06:44:29

---
title: What's the Difference Between AI, Machine Learning, and Deep Learning?
published: True
date: 2020-07-13 11:08:05 UTC
tags: ArtificialIntelligence,Automation,MachineLearning,AIvsMLvsDL
canonical_url: https://www.botreetechnologies.com/blog/artificial-intelligence-vs-machine-learning-vs-deep-learning-difference
---

![AI, ML and DL: What's the difference?](https://www.botreetechnologies.com/blog/wp-content/uploads/2020/07/al-vs-machine-learning-vs-deep-learning-difference.png)

*__So you find yourself saying “Well, it’s time we step on to digital transformation for our organization. Let’s look at the technologies we can implement.”__*

When you complete saying that sentence, the first thing that comes to your mind is [Artificial Intelligence(AI) systems](https://www.botreetechnologies.com/artificial-intelligence-solutions). You think of intelligence machines that can execute tasks on their human and make insightful decisions – like [Sophie or Watson](https://www.ibm.com/blogs/ibm-anz/digital-humans/).

__*“So artificial intelligence(AI) is what we need.”, you say to yourself*__

Yes and No. Yes, in the sense that AI machines are useful for digital transformation.

No in the sense that you will integrate Artificial Intelligence with the help of algorithms which build the foundation for these systems. So you are not integrating AI but the algorithms that make AI machines work.

Here’s a simple explanation – The process that you want to improve through digital transformation will be optimized through AI machines.

These machines will be developed using a subset of AI – Machine Learning Algorithms. To go further deep – your organization can also implement Deep Learning – a subset of Machine Learning.

###Difference between Artificial Intelligence (AI), Machine Learning(ML), and Deep Learning(DL)

You might be confused about whether you should implement Artificial Intelligence Systems, [Machine Learning Programs](https://www.botreetechnologies.com/machine-learning-solutions), or Deep Learning Algorithms.

*__Let us clear this confusion for you.__*

The post [Artificial Intelligence vs. Machine Learning vs. Deep Learning](https://www.botreetechnologies.com/blog/artificial-intelligence-vs-machine-learning-vs-deep-learning-difference) appeared first on [BoTree Technologies](https://www.botreetechnologies.com/blog).
What are best options for reliably parsed, yet powerful, querystrings?
Tags: webdev, discuss, url, querystring
Published: 2020-07-13 11:04:24

I currently only care about integers and arrays to be reliably parsed.

- JSON in querystring isn't very much seen, and I feel it is not compact. URL always have length limits.
- I also have seen GraphQL in URL.
- Single-lined YAML?
- If I don't use querystring format, what about the keys? `_=`?
CSS Overview, new experimental feature on Chrome DevTools
Tags: css, devtools, browser
Published: 2020-07-13 10:59:18

Hey Developer, have you heard about the new experimental feature of Chrome DevTools?

It's called CSS Overview, and it shows you the colors, font info, unused declarations, and media queries.


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



To enable it in your [Chrome](https://www.google.com/chrome/) or [Brave](https://brave.com/) browser

1. Open up DevTools
1. Head over to DevTool Settings
1. Click open the __Experiments__ section
1. Enable the __CSS Overview__ option

![DevTools window in a settings tab to enable CSS Overview feature](https://dev-to-uploads.s3.amazonaws.com/i/76vfe6xx5vz6mj48wkh6.png)


You probably should close the DevTools window and open it again to see the CSS Overview new tab.

![DevTools window with a CSS Overview feature tab](https://dev-to-uploads.s3.amazonaws.com/i/zjo2336nkqv5xabd1kaq.png)


This is pretty cool, right?
Zakládám Rhybník
Tags: security, bezpecnost
Published: 2020-07-13 10:56:11

Poslední dobou pozoruji, že moji kolegové jsou cílem podvodných e-mailů, phishingu nebo také trochu podivně česky  [rhybaření](https://cs.wikipedia.org/wiki/Phishing). Není se čemu divit - naše adresy končí @microsoft.com, což je šťavnaté sousto.

A tak jsem založil Rhybník, kde budu zveřejňovat podvodné zprávy, které se mi dostanou do rukou (samozřejmě anonymně) a zkusím i trochu osvěty - vysvětlit, co je na daném e-mailu podezřelé a jak se dá poznat, že jde o podvod.

![Rhybník](https://dev-to-uploads.s3.amazonaws.com/i/5jblgqwkmod41qoxf6l8.jpg)

Specialisty v oboru to třeba pobaví, běžní uživatelé si i něco odnesou.
How would you keep the same Python 2.7 app running for years to come?
Tags: python
Published: 2020-07-13 10:53:47

I've recently came across a new interesting challenge.

One of the app I'm working on is an old app written in 2016 using Python 2.7. It's basically a website/web platform where people can do stuff.

The platform is going to be discontinued soon, but needs to process data for the next 5-8 years nevertheless. The business context led to the decision of disabling new sign-ups and only allow existing users to sign in, so that they can access their data for years to come.

Not only the project is being discontinued, but the staff behind it too. Resources are scarce to say the least.

The goal now is to keep the platform in an operational condition, without making any changes to it. (or, as little as possible)

As you probably know, Python 2 is completely outdated and support is being dropped on many tools, such as [`pip`](https://pip.pypa.io/en/latest/development/release-process/#python-2-support) which will drop support in January 2021, 6 months from now.

The challenge at hand here is to find a way to keep such a project in operational condition and keep it running for all those years to come. 

But, I know it will eventually break. At some point, running `pip install` will not work anymore, whether due to pip itself or one of the thousands of the project's dependencies.

I've spent a good deal of time on this challenge already, and eventually chose to keep our current hosting provider for now (fully managed). 

I also considered making a Docker instance so that the whole infrastructure gets "frozen", but even though I'm not sure the underlying provider (AWS, etc.) wouldn't deprecate such instances within 5-8 years of time and force us to move it to something different, which may lead to issues when reinstalling everything years later, with a different staff unfamiliar with the project.

Of course, rewriting the whole app is not an option, due to time/budget constraints. Also, the project being discontinued, it'd really not make any sense, financially wise.

So, I'm not asking for a magical solution. But I'm interested in similar experiences and feedback about what to do and not to do from peers who've known such a challenge. Would love to hear your story!
List View row Formatting: Discussion Board
Tags: sharepoint, listformatting, microsoft, rowformatting
Published: 2020-07-13 10:52:11

I have seen that in on-prem many of the users are using the discussion feature, but in SharePoint Online we do not have this feature. To give it a thought I have implemented somewhat similar functionality.

Discussion board formatting gives the ability to showcase the discussion which is a page, under specific category which will make more sense to the discussion board. So, whatever category you want to create, create the folder for that and the corresponding pages beneath it.

This discussion board formatted displays the banner image (not the thumbnail image) and showcases it in the front along with the title, description, Likes, Comments, Date of last edit, and the owner of the page(not the author).

No new column needs to be created only the existing column needs to be added to the view. For that execute the below PnP code

```sh
 # If want to modify the existing view
 Set-PnPView -List "Site Pages" -Identity "<Name of the view>" -Fields "Modified","_CommentCount","Description","ID","_LikeCount","BannerImageUrl","_AuthorByline","Title"

 # If want to create a new view
 Add-PnPView -List "Site Pages" -Title "Discussion Board" -Fields "Modified","_CommentCount","Description","ID","_LikeCount","BannerImageUrl","_AuthorByline","Title"
```

The above PnP code will add all the necessary columns to the view. Now paste the JSON in the formatter.

Code can be found [here](https://github.com/SumitKanchan4/SP-List-Formatting/tree/master/Row%20Formatting/Discussion%20Board)

![Discussion Board](https://dev-to-uploads.s3.amazonaws.com/i/w1blo5b5hi76s0137kvu.gif)

Hope this will help you.


Happy Coding..!!
Incoming : Web Walkie-Talkie
Tags: javascript, webrtc, showdev, node
Published: 2020-07-13 10:49:26

The new creation of jswalker called **Incoming**. An army style communication approach around the world acts like a Radio Transmission over the internet.


##Product-Link : [Incoming](https://bit.ly/incoming-inbound)

##[Rule]
     1.Remember your codename : Your-Code-Name show in header
     2.Keep your language wise.Anyway its your choice to be gentle.
     3.Radio frequency allotted 5 seconds maximum hold
     4.Call each other by codename
     5.Give time to each user to speak comfortably



##[Speaking code style]
     1.To start or check communication use : "Your-Code-Name" Inbound.  E.G. 'Bravo-2' Inbound 
     2.To end of each communication use : 'over'
     3.To ask/send to specific code-name use : Coming 'Opponent-Code-Name'. E.G. 'Coming Charlie'  
     4.To end talk use : "Your-Code-name" 'over and out' E.G. 'Bravo-2 Over and out'  


**[Bug Submit]**
   DM on [twitter](https://twitter.com/jswalker_in) || [Dev.to](https://dev.to/jswalker_in)