teleren/devto huggingface dataset:
Web Development Journey
Published: 2020-04-22 01:15:39

This is my first post about learning web development in April 2020. 
I will use both Colt Steele The Web Developer Bootcamp and The Advanced Web Developer Bootcamp to understand core web technologies. Then I will utilize Steele JavaScript Algorithms and Data Structures to develop a deeper understanding of computer science fundamentals. I anticipate that my web development journey will be filled with exciting new adventures as well as opportunities for the years ahead. I can not wait to contribute to the open-source software community. 

###Colt Steele The Web Developer Bootcamp 
##### Part 1: 
https://www.udemy.com/course/the-web-developer-bootcamp/

###Critical Update 
As I was going through the first course, Colt updated this course in October 2020, as I begun working on the advanced web developer course. I will go though my first additional post and provided the updated information. 


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


I am happy to be on a learning path that is actively maintained and updated. 
I appreciate Colt dedication to this course that he makes sure to include all the important updated information. 

This field is fast moving and ever evolving which keeps me interested and motivated. 



###Colt Steele The Advanced Web Developer Bootcamp 
##### Part 2: 
https://www.udemy.com/course/the-advanced-web-developer-bootcamp/

###Colt Steele JavaScript Algorithms and Data Structures 
##### Part 3: 
https://www.udemy.com/course/js-algorithms-and-data-structures-masterclass/
Covid19 tests and Thomas Bayes
Tags: datascience, beginners
Published: 2020-04-22 16:53:41



### Bayes theorem

Created by reverent Thomas Bayes, who created this famous rule to infere the existence of God... needless to say that the existence of God is still in the realm of faith but his famous rule has became the very fundamentals of inference probability

The bayes theorem can be written as the following:

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

Do you remember the covid detection example we had in the last tutorial? 

We want to know the probabilitty for one person of having covid if he or she had tested positive

We have the on average probability for a random individual of having covid or not

p(covid) = 0.01
p(¬covid) = 0.99

Then we have this test we just bought that goes:

90% of the time outputs POSITIVE if you have covid

But also

90% of the time marks NEGATIVE ig you don't have it

So we can mind our problem the following way:

P(C | POS) = P(C) * P(POS|C)
P(¬C | POS) = P(¬C) * P(POS|¬C)


In this case P(C | POS) will be the probability of having covid given a positive test result, and P(POS|C) the probability of having a positive test result giving that the patient actually has covid, it is important to mark those concepts as sometimes we may get confused on what do they represent.

So let's compute them on our case.

P(C | POS) = P(C) * P(POS|C) =  0.01 * 0.9 = 0.009

And

P(¬C | POS) = P(¬C) * P(POS|¬C) = 0.099

But as you might have seen, those probabilities don't add up to one, they should be somehow complementary right? Given a positive test if we don't have covid, then we have it right? No other options around, so they should add to one, thats not exactly like that because we are selecting random individuals and they may or may not have the virus, we need to "focus" on our target.

If we want to relativize our context to those two options, we need to normalize them, so first we add those values together:

0.009 + 0.099 = 0.108 that is the total probability of having a positive test (wether the person has the virus or not) after selecting a random person on town.


So finally we can obtain whats called the posterior probability by normalizing our probabilities, that means, dividing them by their sum.

P(C|POS) = 0.009 / 0.108 = 0.0833

P(¬C|POS) =0.099  / 0.108 = ¨0.9166


So those are the probabilities, pretty impressive right? That is because we are assuming an initial positive result on the test. We can see it better if we go in the other direction, let's evaluate for negative results. 

P(C | NEG) = P(C) * P(NEG|C) = 0.001
P(¬C | NEG) = P(¬C) * P(NEG|¬C) = 0.891

And the normalizer is = 0.001 + 0.891 = 0.892

Finally:

P(C | NEG) = 0.0011
P(¬C | NEG) = 0.9989

So if we get a negative on our test, there we can be 99% sure that we are covid free, said that you can easily detect that those tests are great for "discarting", for doing the initial triage and detecting negatives, but when it comes to positives, aditional checks should be made to get a veredict.
Build simple Express Js application in 1 minutes with create-express-app
Tags: javascript, webdev, node, tutorial
Published: 2020-04-22 12:07:41

Express.js is one of the most popular back-end frameworks nowadays, which lots of people find useful to learn. After mastering the theory, it comes the time to start the practice, and then it may seem a little bit difficult, how to start. But creating your first Express.js application doesn’t have to be so complicated.
Let’s start...


1. Install create-express-app

In the beginning, we have to install create-express-app tool. which allows installing ready to use Expres.js application, with all needed dependencies. To install the tool, we have to use the following command in the command line:
```sh
npm install -g create-expressjs-app
```
After the process finished successfully, you have it installed. Let’s create our app!

2. Create the application

Now, it’s super easy to create our first application using the create-express-app tool. We can do it with a single command in our command line. First, navigate to the folder where you want to have your application through the command line, and then run the following command, where expressapp is the name of our application:

```sh
create-expressjs-app init expressapp
```
When you create a new app, the CLI will use npm to install dependencies. If you have npm installed, but would prefer to use yarn , you can append --use yarn or -u yarn to the creation command. For example:

```sh
create-expressjs-app init expressapp --use yarn 
```
You will be prompted to pick a template. Supported template are :
- cra-template-es5 
- cra-template-es6
- cra-template-typescript

Each template comes with a basic `Jest` + `ESLint` setup.

You can feel free to set a different name for your application. If the process finished successful, you should have your folder with the app ready! Let’s start the application now!


3. Start the application

Let’s start our expressapp with the following commands:

```sh
npm run start
```

The first command is used to enter to the folder of our application, and the second one starts our app. By default, the application is open at localhost:4200

I hope you will find this tutorial helpful and use it as a base for your first
If you would like to contribute to create-express-app please feel free to check out the Contributing guidelines about how to proceed.
GitHub: https://github.com/getspooky/create-express-app
Website: https://getspooky.github.io/create-express-app/

Have a nice coding!
Starting an Automation Testing NewsLetter, Join and Get FREEBIE
Tags: testing, tutorial, beginners, webdev
Published: 2020-04-22 12:50:56

Do you want to learn Automation Testing, I am starting out my Automation Testing email Newsletter: 

👉 https://sendfox.com/thetestingacademy

TheTestingAcademy Note includes.

We will discuss the following : 
1. Automation Testing.
2.Selenium, API Testing, and Question to Crack SDET interviews and many more for FREE FREE 

😱 Join and Get a FREEBIE Ebook of
API Testing worth $19. 😱

👉 https://sendfox.com/thetestingacademy

Join now and become a part of the Automation Testing NewsLetter.

--
Be sure to subscribe for more videos like this!

[![ TheTestingAcademy](https://dev-to-uploads.s3.amazonaws.com/i/r7vcy6wbvyjbk1y1uu0o.png
)](https://www.youtube.com/TheTestingAcademy?sub_confirmation=1 "TheTestingAcademy")
07: Vanilla JavaScript and Result
Published: 2020-04-23 01:31:29

Being curious is a good thing, Asking questions are also good, But… It is meaningless unless I solve the problems, I am like a baby, who is reborn, This is a whole new world. Indescribable feelings.

I think it would be good for me to motivate myself and achieve my idealism ‘Solving my JavaScript Quests’ after all I can work as a front-end developer before you know you go to war, you need a defense, guess what if that I could understand vanilla JS and capable of making wonderful web browser?
That gave me more peace and hope, and I want to be out, interacting with people, meet more diversity, and expand myself and might have the real chance to focus on pure mathematics! Let me reverse the process! 😆



https://www.indiepost.co.kr/post/10437?fbclid=IwAR1IDP4lbxZh4hpsRaXaymlF1EmUFuBjddeuYCJLyceAtRu4R59aj9aLuao
Emmet Simplified 😍
Tags: emmet, html, simple, learn
Published: 2020-04-23 10:03:50

---
title: Emmet Simplified 😍
published: true
description: How to make use of Emmet Abbreviations
tags: emmet, HTML, simple, learn
---

### Emmet is a web-developer’s toolkit that can greatly improve your HTML & CSS workflow

Type | Syntax | Example[^1] 
-|:-:|-
Child | <kbd>></kbd> | `nav>ul>li` 
Sibling |<kbd>+</kbd> | `div+p+bq`
Climb-up | <kbd>^</kbd> | `div+div>p>span+em^^bq` 
Multiplication | <kbd>*</kbd> | `ul>li*5` | 
Grouping | <kbd>(</kbd><kbd>)</kbd> | `(div>dl>(dt+dd)*3)+footer>p`
Item numbering | <kbd>$</kbd> | `ul>li.item$*5>{$}`
Item numbering  |  | `h$[title=item$]{Header $$$}*6`
Id | <kbd>#</kbd> | `div#title`
Class | <kbd>.</kbd> | `div.title`
Custom attributes | <kbd>[</kbd><kbd>]</kbd> | `p[title="Hello Rishi Abee"]`
Text| <kbd>{</kbd><kbd>}</kbd> | `a{Click me}`
Lorem (random length) | <kbd>></kbd>`lorem` | `p>lorem`
Lorem (defined length) | <kbd>></kbd>`lorem10` | `p>lorem10`

---
#### HTML boilerplate
> `!` <kbd>→</kbd>
> `link` <kbd>→</kbd>
> `https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css `

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

#### Usage example - Header
>  `nav.navbar.navbar-expand-md.navbar-dark.fixed-top.bg-dark>a.navbar-brand>{Brown Bag Session}^^main>((div.jumbotron>div.container>h1.display-3>{Hello Rishi Abee})+div.container)` <kbd>→</kbd>

#### Usage example - Body
>  `(h${Header $}*6)+(bq.blockquote3>p.mb-0>lorem10+footer.blockquote-footer>lorem2)` <kbd>→</kbd>

#### Usage example - Footer
>  `hr+footer.container>p>{UnLicensed}` <kbd>→</kbd>

[^1]: [Emmet cheatsheet](https://docs.emmet.io/cheatsheet-a5.pdf)
Elegant set of objects
Tags: javascript, python
Published: 2020-04-23 11:01:06

Once, at the same time, I needed to do the same thing in two different languages: javascript and python. I needed to do a set of unique objects from an array of non-unique objects.
Of course, I could create the extra array and fill it by looping for input array with some if statement with some extra logic. But JSON helped me :)

javascript
```
let filteredList = [...new Set(myList.map(JSON.stringify))].map(JSON.parse);
```
python
```
filtered_list = list(map(lambda x: json.loads(x), set(map(lambda x: json.dumps(x), my_list))))
```
As for me very elegant - but I think somebody can find some issues in this simple code. If regarding javascript I am overall calm, another thing is python. For me is not so clear. But I leave this part of code because I like it :)
100daysofcode Flutter
Tags: 100daysofcode, flutter
Published: 2020-04-23 15:12:06

day 45/100 of #100daysofcode #Flutter
Learning Flutter , courses Udemy from
@maxedapps

Today prepare for new section HTTP request, with firebase,
https://github.com/triyono777/100-days-of-code/blob/master/log.md
TerminusDB Webinar - Chat with Female Terminators
Tags: webinar, developer, chat, diversity
Published: 2020-04-23 22:38:44

---
title: TerminusDB Webinar - Chat with Female Terminators
published: true
description: In this Webinar, rather than focus on just tech, we want to know more about the core team behind TerminusDB. Currently, we have 2 female developers in the dev team (out of 6, not bad), and I have some questions to ask them. We want to be inspired not just by technological knowledge, but also by their experience as a developer in a male-dominated industry. Join us in the Webinar if you want to be inspired!
tags: webinar, developer, chat, diversity
---
In this Webinar, rather than focus on just tech, we want to know more about the core team behind TerminusDB. Currently, we have 2 female developers in the dev team (out of 6, not bad), and I have some questions to ask them. We want to be inspired not just by technological knowledge, but also by their experience as a developer in a male-dominated industry. Join us in the Webinar if you want to be inspired!
HTTP version evolution
Tags: http, network
Published: 2020-06-29 12:28:01

---
title: HTTP version evolution
published: true
description: 
tags: HTTP, network 
---
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/1deshry2rg4lnxo6dnts.jpg)

The **HTTP** protocol is the communication language between the browser and the server, the latest version has reached **HTTP 3.0**.

I have read some articles and made some records of the evolution of the **HTTP** version. here I will share some key points for you



### First version HTTP/0.9

First verssion **HTTP** mainly used for academic communication. used to transfer **HTML** hypertext content between networks, using a request-response model.  a request is sent from the client and the server returns data. 

In general the demand at that time was very simple, it was used to transmit small **HTML** files. 

Has three characteristics:

* There is only one request line. and there is no **HTTP** request header and request body

* The server did not return header information

* The content of the returned file is transmitted as a stream of **ASCII** characters



### HTTP/1.0

Supporting multiple types of file downloads is a core requirement of **HTTP/1.0**. including **JavaScript**, **CSS**, **pictures**, **audio**, **video** etc.

**HTTP/1.0** negotiates and communicates through request headers and response headers. requesting file types and returning file types. E.g

``` html
// request
accept: text/html
accept-encoding: gzip, deflate, br
accept-Charset: ISO-8859-1,utf-8
accept-language: zh-CN,zh

// response
content-encoding: br
content-type: text/html; charset=UTF-8
```



### HTTP/1.1

**HTTP/1.1** has made a lot of updates on the basis of **HTTP/1.0** including

* Improve the persistent connection. multiple **HTTP** requests can be transmitted on a **TCP** connection. as long as the browser or server does not explicitly disconnect, the **TCP** connection will be maintained.

* Immature **HTTP** pipeline to solve the problem of queue blocking by pipeline technology.

* Provide virtual host support, the **Host field**  is added to the request header to indicate the current domain name address, so that the server can do different processing according to different Host values.

* Provides perfect support for dynamically generated content, introducing **chunk transfer** mechanism. the server will divide the data into several data blocks of any size, each data block will be attached with the length of the last data block, and finally use a zero-length block as a sign of sending data

* Client **cookies** security mechanism



Continue to share tomorrow， Hope it can help you  :)
[From April 23 to 29] The things I knew and thought last week
Tags: typescript, go, design
Published: 2020-04-30 01:56:52

---
title: [From April 23 to 29] The things I knew and thought last week
published: true
description: From April 23 to 29
tags: typescript, golang, design
---

# [Typescript] What is the difference between d.ts and ts. Should I write an interface except for implementation?

A _.d.ts_ is defined for js file that does not exist type definition. We cannot write implementation in a _.d.ts_ file.


# [Tslint] disable unused importing error

We set this Eslint rule before we change.

eslint.json
```js
'@typescript-eslint/no-unused-vars': 'error',
```

This rule prevents us from productivity. We then changed this setting to "warn," and Webpack can build an app even imported variable is not used.

But this setting is not right generally. So I set this as "error" when testing an app in CI.

eslint.json
```js
'@typescript-eslint/no-unused-vars': 'warn',
```

Finally, we could get more productivity in development and keep clean code in production.


# [Golang] Get own function name for logging

I wanted to log an error message with the function name a caller called, and I referred to this. {% stackoverflow 46289376 %}

In my case, I can get a function name in this way.

```go
func getFuncName() string {
  pc := make([]uintptr, 15)
  n := runtime.Callers(2, pc) // get caller's function name
  frames := runtime.CallersFrames(pc[:n])
  frame, _ := frames.Next()
  return frame.Function
}
```


# [Vue] Managing common APIs within some util class

Now, I'm thinking.


# DB Migration early developments use not a binary format. After settling down development, use a binary format.

I used [MySQL Workbench](https://www.mysql.com/products/workbench/) in our team first. In the first month, we started our project, we changed(add, delete, and update) DB tables pretty often and we should change MySQL Workbench file sequentially because the file was binary data, we could not solve conflict with Git. Therefore, we came to the conclusion that in a development phase, we should use a text format DDL file, and after finish that, we can use a binary format DB management tool if we want because it will be less changing DDL.


# [Golang] change table name with TableName() in GORM

https://gorm.io/docs/conventions.html#Pluralized-Table-Name

I can change a table name arbitrarily with `TableName()`.


# [JavaScript] throw exception

```js
throw new Error('Error!')
```

Same of other langs.
The Beginning of my Coding Journey.
Tags: webdev, html, css, beginners
Published: 2020-04-28 20:24:50

It is often said that adventures start with a single step. I think that couldn't be more true with coding. I have been seeking for many years now an area of IT to hang my hat on. I started with going the Cyber Security route and even obtained my Security+ cert, but just quickly lost the passion for it. I have wandered aimlessly until recently where I saw ads on my Facebook news feed regarding Web Development. I have dabbled with HTML, CSS, JavaScript, Python and C# before but never really took to learning them for career purposes. Recently, I delving more into coding and I am hooked! The feeling of coding something for yourself and it working is one that cannot be described. I resolved within myself that it is time to stop dragging my feet and it is time to take action. I am now on my journey to becoming a Web Developer. I have found thus far the community of coders throughout the world is incredible and I hope to glean insight from the collective knowledge of other's. I am a beginner, but to call back to the first sentence, every journey begins with a single step. Any helpful tips or advice would be much appreciated!
Object Oriented Programming, Explained
Tags: oop, java
Published: 2020-04-28 23:21:47

Object Oriented Programming (OOP) refers to a type of software design in which programmers define the data type of a data structure, as well as the types of operations that can be applied to that data structure. OOP aims to implement real-world entities like inheritance, hiding, polymorphism, etc and to bind together the data and functions that operate on them so that no other part of the code can access this data except the function. There are a few key concepts essential to gaining an understanding of OOP that I will go over in this article. 
## Encapsulation
Encapsulation is achieved when an object keeps its state private, inside a class. Other objects don’t have direct access to this state. Instead, they can only call a list of public functions called methods. 
## Abstraction
In OOP, programs are often extremely large and separate objects communicate with each other a lot so maintaining this kind of codebase over many years can be a difficult challenge. Abstraction is a concept that aims to ease this problem. Applying abstraction means that each object should only expose a high-level mechanism for using it. In other words, only the essential details will be displayed to the user. In Java, abstraction is achieved by interfaces and abstract classes.
## Inheritance
Inheritance allows you to create a (child) class by deriving from another (parent) class to form a hierarchy. The child class reuses the fields and methods of the parent class and can also implement its own unique fields and methods. 
## Polymorphism
Polymorphism refers to the ability of OOP languages to differentiate between entities with the same name efficiently. This typically happens by defining a parent interface to be reused. It outlines some common methods, then each child class implements its own version of these methods. A real life example of polymorphism could be how a single person can possess different behaviors in different situations, like a man can be a father, a husband, an employee, all at the same time. Polymorphism allows you to perform a single action in different ways. In other words, it allows you to define one interface and have multiple implementations.
## Why Use OOP?
Object oriented programming has several advantages over procedural programming:
- OOP is faster and easier to execute
- OOP provides a clear structure for the programs
- OOP helps to keep code DRY (“Don’t Repeat Yourself”), and makes the code easier to maintain, modify, and debug
- OOP makes it possible to create full reusable applications with less code and shorter development time. 

For further reading on this topic, check out some of these sources:
- [A Basic Explanation of OOP](https://www.freecodecamp.org/news/object-oriented-programming-concepts-21bb035f7260/) by Alexander Petkov of freeCodeCamp
- [OOP Concepts in Java](https://www.geeksforgeeks.org/object-oriented-programming-oops-concept-in-java/) by RishabhPrabu of GeeksForGeeks
What are your favorite web development blogs?
Tags: discuss
Published: 2020-04-29 16:17:01

I love reading posts on modern web development and I'm always looking out for new content. Some of my favorites are:

- [Josh W Comeau](https://joshwcomeau.com/): Gatsby, React and sometimes CSS things
- [Overreacted](https://overreacted.io/): Dan Abramov's blog, great insights of React
- [Kent C. Dodds](https://kentcdodds.com/): Usually, the posts are on React and testing. Always interested in Kent's posts.
- [Ahmad Shadeed](https://ishadeed.com/articles/): Awesome posts on CSS.
- [Thomlom](https://thomlom.dev/): Shameless plug. One year ago I started my blog on front-end development. Today, I'm quite proud of its content and how it looks.

And you, what's your favorites technical blog?