teleren/devto huggingface dataset:
|JavaScript| JavaScript: Basics
Tags: javascript, html, css, webdev
Published: 2020-11-30 23:54:05

---
title: |JavaScript| JavaScript: Basics
published: true
description: 
tags: javascript, html, css, webdev
//cover_image: https://direct_url_to_image.jpg
---

The focus of this post was to include new information from Colt Steele Web Developer Bootcamp Updated Version.  
HTML: The Essentials
           
              -Primitives and The Console 
              -JavaScript Numbers
              -What is NaN
              -Variables and Let
              -Booleans


###Primitives and The Console 

Primitive Types are the basic building blocks of JavaScript.

             -Number 
             -String
             -Boolean
             -Null 
             -Undefined 

These are the different types of information that can be stored with JavaScript primitives. 

###JavaScript Numbers
JavaScript has one number type
Positive numbers
Negative numbers
Whole numbers (integers)
Decimal numbers 


###What is NaN
NaN is Not a number 
Nan is a numeric value that represents something that is...not a number. 
May represent a value that is not a number, such as  a typeof. 


###Variables and Let

Variables are like labels for values 
We can store a value and give it a name so that we can refer back to it later, use that value to do something or change it later. 


###Booleans

Booleans are used to store yes or no / truth and false values. 

```javascript

let isLoggedIn = true; 

let gameOver = false; 

const isWaterWet = true; 

```

Booleans are very simple, there are only two possible options either true or false. That's it.
|CSS| CSS: Frameworks: Bootstrap
Tags: javascript, html, css, webdev
Published: 2020-11-30 23:43:19

---
title: |CSS| CSS: Frameworks: Bootstrap
published: true
description: 
tags: javascript, html, css, webdev
//cover_image: https://direct_url_to_image.jpg
---


           

              -What is Bootstrap
              -Intro to the Bootstrap Grid
              -Responsive Bootstrap Grids
         
            
            
         

###What is Bootstrap
Bootstrap is a CSS Framework. A framework provides a starting point to create all kinds of different websites. Bootstrap consist of components which are different pieces that can be inserted into our code for use. 

####Components 
Bootstrap gives us access to a bunch of pre-built components that we can incorporate into our websites. 

####Grid System 
Bootstrap also comes with a grid system, which help us construct our own custom, responsive layouts. 


###Intro to the Bootstrap Grid
The grid system helps us layout content on a web page. The grid system only works inside of a container, therefore it is required to have at least one container or more on a page for the grid system to work. There must be a container class any time we want to use the grid. Then we must create a row using the class of row. 

```bootstrap 

<div class="container">
<h1 class="display-1 text-center text-primary">The Grid System</h1> 
<div class="row">
</div>

```

Every row in bootstrap has 12 units of space. 


###Responsive Bootstrap Grids
The grid system allows us to create responsive layouts and shift content around based upon the screen size.
The *worst* AWS failure in history?
Tags: video, aws, reinvent
Published: 2020-11-30 23:38:44

---
title: The *worst* AWS failure in history?
published: true
description: a short video on re:Invent, AWS and outages
tags: video, aws, reInvent, 
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/zq782l26whpp72gcdl30.jpg
---

*Cover image by [MichaelKirsh](https://commons.wikimedia.org/w/index.php?curid=61193330)*

For those of you not keeping track, a single AWS region, US-East-1, suffered a major outage last week. Many of the teams affected were on holiday for Thanksgiving within the US, leaving many red-rimmed eyes by the time the issues resolved.

{% youtube wEBtDiNTnA0 %}

While there have been some critiques that absolutely hit the mark correctly, such as this from Forrest:

{% twitter 1332690337232510977 %}

It's fair to say that a number of critics are 'punching above their weight' and don't really understand the complexities involved. While I certainly don't understand the ins and outs of this failure I think the follow things are pretty clear:

* a single failure, no matter how severe, does not mean you shouldn't be using a particular cloud
* there is no simple way to completely uncouple services, so there will always be issues of cross dependency
* you probably shouldn't host your status dashboard on your own services (does this mean the AWS status page should be hosted on Azure? yes.)
Enabling C# 9 in Xamarin & .NET Standard Projects
Tags: csharp, dotnet, xamarin
Published: 2020-11-30 18:20:25

---
title: Enabling C# 9 in Xamarin & .NET Standard Projects
published: true
date: 2020-11-30 18:19:13 UTC
tags: csharp,dotnet,xamarin
canonical_url: https://montemagno.com/enabling-c-9-in-xamarin-net-standard-projects/
---

Whoa! .NET 5 is out and C# 9 is out! This means you are ready to use records, new pattern matching, and more! But wait a second... your apps haven't been upgraded to .NET 5 yet or are a project type that don't support .NET  so you don't have access to the new C# 9 features :( Or do you!?!?!?! Yes, of course you do! Most new features in C# are compiler based and not necessarily runtime based.  When you create a new project the compiler determines a default C# language based on these rules:

| Target framework | version | C# language version default |
| --- | --- | --- |
| .NET | 5.x | C# 9.0 |
| .NET Core | 3.x | C# 8.0 |
| .NET Core | 2.x | C# 7.3 |
| .NET Standard | 2.1 | C# 8.0 |
| .NET Standard | 2.0 | C# 7.3 |
| .NET Standard | 1.x | C# 7.3 |
| .NET Framework | all | C# 7.3 |

So, if you are using .NET Standard 2.0 (the default for Xamarin.Forms) you only have access to C# 7.3 by default, which is sad. However, you can override the default inside of the .csproj. Simply open it up and add the property group:

```xml
<PropertyGroup>
   <LangVersion>preview</LangVersion>
</PropertyGroup>
```

You can also pick the specific version of C# that you would like:

```xml
<PropertyGroup>
   <LangVersion>9.0</LangVersion>
</PropertyGroup>
```

Now you are ready to start using C# 9 and convert all those classes over to records... almost! I say almost because there is one quirk with enabling C# 9 in non-.NET 5 project and when you use a record you will be granted with a `System.Runtime.CompilerServices.IsExternalInit` is no defined or imported error.

![](https://montemagno.com/content/images/2020/11/image.png)

This can easily be fixed by adding the following code into any file. I like to add it into the AssemblyInfo.cs file:

```csharp
namespace System.Runtime.CompilerServices
{
    public class IsExternalInit { }
}
```

There you go! now you can start using all those new fancy features!! Checkout these docs:

- [What's new in C# 9](https://docs.microsoft.com/en-us/dotnet/csharp/whats-new/csharp-9)
- [What's new in .NET 5](https://docs.microsoft.com/en-us/dotnet/core/dotnet-five)
- [Versioning C# in projects](https://docs.microsoft.com/en-us/dotnet/csharp/language-reference/configure-language-version)
Website Feedback
Tags: webdev, portfolio, review, design
Published: 2020-11-30 23:00:46

Hey there,

I have been working on [this website](https://hentaichan.pythonanywhere.com/home) on and off since the middle of October if I recall right. It's still missing a contact page, and I didn't publish a blog post there yet but other than that feel free to attack my horrible design choices! 😅 

Might be slow to load because I currently host this site under pythonanywhere's free tier until I can afford to upgrade my plan and buy a custom domain name. I have also identified other reasons for the slow first contact that I need to address soon, though SEO isn't a priority for me because I will primarily use this site to share my stuff.
Day 266 : Thank You
Tags: hiphop, code, coding, lifelongdev
Published: 2020-11-30 22:38:22

_liner notes_:
- Saturday : Don't know where the day went! I was working on putting together the show and next thing I knew, it was time to do the show. haha Had a great time though as usual. The show had a "Thank You" feel to it giving the time of year. The recording of this week's show is at https://kNOwBETTERHIPHOP.com

![Radio show episode image of a white plastic bag with the words "Thank you" vertically printed in red multiple times with the words November 28th 2020, TanksGiving](https://dev-to-uploads.s3.amazonaws.com/i/lcyyuzgt5r79w40xx996.jpg)

- Sunday : Pretty productive day. Did some post radio show promo work. Worked on a sample app that will be a portion of a larger side project I'm working on. Wanted to test out to see what an API could do and if it fits my needs. Got the application working and it's pretty cool. I can definitely see it doing what I need after a few more tweaks. Had my friend that plans meetups in the area try the dashboard I created at https://otech.events again. Ran into a couple of issues the last time that I fixed. Everything worked fine this time. Pretty happy with the way it turned out. Ended the night watching "The Walking Dead: World Beyond" show. 

- Professional : Started my day with going on a live stream with my manager as he is building a backend for our application using Ruby on Rails. Never used it before so it was a really good learning experience. After that, it was pretty much back to back meetings haha. Worked on some documentation for the rest of the day.

- Personal : Was pretty wiped after the day so I took a quick nap. Woke up and remembered that I didn't send the email promo blast for the radio show. Got to get that done.

![A view of a mountain range in Klaussen Pass, Switzerland with a small village in the valley](https://dev-to-uploads.s3.amazonaws.com/i/je1p4p96zwklivk6thjx.jpg)

Need to get the aforementioned email blast done. Probably do some light coding on my side project. I want to get the radio show edited and submitted to the station early, because last time, the week went by so fast that I turned it in on Friday morning. I like to get it submitted in advance so they have to time get it in the system at the station. Found out that "Legion" is on Hulu, so I'll probably watch a couple of episodes that I didn't get a chance to see when it was on TV.

Have a great night!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube x-CCc_ODT7k %}
Why developers should be "lazy"
Tags: beginners, tips, management
Published: 2021-03-21 17:58:49

---
title: Why developers should be "lazy"
published: true
date: 2020-11-30 22:32:36 UTC
tags: beginner, tips, management
canonical_url: https://alexandrubucur.com/blog/2020/why-developers-should-be-lazy/
---

Looking back to all the years I've been developing and all the developers I worked with, the best developers were always the "lazy" ones.

What do you mean by "lazy" you might ask, or why do I think that "lazy" developers are great?  
  
It's rather simple:

1. A "lazy" developer is going to write less code to get the job done.  
   Since he wants to have things working, not tinker with overcomplicated abstractions or feel the need ro fill lines of code to justify work.
2. A "lazy" developer is going to have more readable code.  
   Since he knows that 80% of the time you're reading code, not writing it.
3. A "lazy" developer doesn't want to do support or extra work.  
   So that's why he's extra careful in testing and writing tests so he can have minimal downtime.

That's pretty much it :)
Beautiful iOS feature in pure CSS (video)
Tags: css, webdev, youtube, video
Published: 2020-11-30 22:11:17

Hi guys! 👋
So, after a pretty long break, I decided to try some YouTube again! So, instead of an article, there's a video!

Join me for a brief moment to discover a pretty *"newish"* CSS property that can help you achieve a beautiful iOS-like **frosted glass effect** in your next web app!

{% youtube sx2TA4HoomY %}

If you like what you see and haven't subscribed already, then you know what to do. 😉

Thanks for reading/watching and have an awesome day!
Refactoring HTML code with help of regex search and replace
Tags: html, refactoring, regex
Published: 2020-11-30 21:49:39

Recently I had to do a lot of refactoring in HTML templates. Current IDEs usually don't provide many tools for refactoring HTML code so we had to help ourselves. Let's see if we could leverage old good search & replace and a bit of regular expressions.

The goal was to remove old component `record-item` from templates and replace it with new markup composed just of divs and spans. This one simple change just repeated so many times it would be tedious to do it all manually:

```html
<!-- old code -->
<record-item label="Name">
    {{ details.name }}
</record-item>
<record-item *ngIf="details.color" label="Color">
    {{ details.color }}
</record-item>

<!-- new code -->
<div class="record">
  <span class="label">Name</span>
  <span class="value">{{ details.name }}</span>
</div>
<div *ngIf="details.color" class="record">
  <span class="label">Color</span>
  <span class="value">{{ details.color }}</span>
</div>
```

The complication was that `record-item` component had one input as attribute that needed to be converted as content of `span` element in the new code. On top of that a condition like `*ngIf="details.color"` could be set on the old component which would also need to be present on `div` element in the new code. 

I originally thought that the optional condition is a complication that would require two distinct search regulars - one for occurrence with the condition and the other for occurrence without the condition. It turned out later that it would not. Let's check the regular.

Regular expression for search and replace:

```jsx
//search regex
const search = /(<hfc-review-section-item) (\*ngIf="[^"]+")? ?label="(.*)".*>(.*)<\/hfc-review-section-item>/

//replace with
const replace = "<div $2 class="record">\n<span class="label">$3</span>\n<span class="value">$4</span>\n</div>"
```

Every piece of code that needs to be transferred into new one is captured in its own group.

Group for possible condition `*ngIf="..."` has optional modifier `?`

Then a final result is composed from new HTML markup and captured groups.

Finally, I was able to successfully replace all my templates with this simple regex and have saved a lot of time and avoided possible typos by not doing it manually.
S3E1 Learn JMeter Series - Inter Thread Communication
Tags: performance, webperf, testing, tutorial
Published: 2020-11-30 21:44:23

Welcome to Learn JMeter Series!

In this Season 3, Episode 1, you will learn following:

🔹 Inter Thread Communication

{% youtube yqOBDF8hXZM %}

☑ Buy me a tea 🍵 : https://www.buymeacoffee.com/qainsights
☑ [My Blog](https://qainsights.com)
☑ [My Udemy Course](https://www.udemy.com/course/performance-testing-using-truweb)
100 days of code — Dia 13
Tags: python, productivity, programming, 100daysofcode
Published: 2020-11-30 21:38:07

<h2>(30/11/2020)</h2>
[Nos finalmente...]

Esse semana, provavelmente, estaremos finalizando o projeto e hospedando o mesmo. Foi um mês de desenvolvimento e o conteudo pedido esta sendo entregue na data regulamentar, agora só temos que alinhar alguns detalhes e decidir a melhor hospedagem para o sistema.

- Terminei de ler o livro do Machado de Assis (O alienista) e o livro "o que é o racismo". Deixarei para ler o livro "Uma carta de amor" futuramente, então irei retira-lo da lista de livros que estou lendo e começarei a ler o livro "histórias sobre ética".

> O que é racismo: 82/82 páginas;
> Histórias sobre ética: 0/12 capitulos;
> O Alienista: 13/13 capitulos;

*Se hidratem, comam frutas, leiam bastante, a terra não é plana, vacinas salvam vidas e bolsonaro vai tomar no cu.*
AWS re:Invent Session: Building a Continuous Vulnerability Remediation Habit
Published: 2020-11-30 21:09:40

Catch my #aws #reInvent2020 session "Building a Continuous Vulnerability Remediation Habit" at 12 noon PST tomorrow to learn how @gitlab leverages the psychology of human habit formation to onboard #DevSecOps habits. Check it here: https://url2go.to/mjaqw @AWSreInvent
Top 5 Changes in webpack V5
Tags: webpack, aws, cloud, cloudnative
Published: 2020-11-30 21:08:59

Are you using webpack to bundle your React or JavaScript application? Well, there's a new version of webpack with some surprising changes. From deprecated features to new configuration options, you'll want to prepare your application before migrating to this new version. Watch this video for more details!

Table of Contents:
0:00 Introduction
0:22 What is webpack version 5?
1:58 1) Deprecated features have been removed
3:19 2) More plugins moved to webpack core
4:26 3) Node.js polyfills have been removed
6:15 4) Webpack configuration changes
8:01 5) Requires Node.js version 10+
10:48 How to migrate from webpack v4 to v5
15:14 My experience upgrading to webpack v5
19:48 Final thoughts

---

🙏 Thanks for taking a look at my content!

📨 Join my newsletter for more: https://ryanlewis.dev

🎥 Subscribe to my [YouTube channel](https://www.youtube.com/channel/UCFqsAphTD7FXKYDCg5zdrOA)!

---

[YouTube](https://www.youtube.com/channel/UCFqsAphTD7FXKYDCg5zdrOA) | [Twitter](https://twitter.com/ryanmurakami) | [GitHub](https://github.com/ryanmurakami) | [Site](https://ryanlewis.dev)
JS101–1 Making Javascript Function Simple
Tags: javascript, functions
Published: 2020-11-30 20:23:55

Javascript functions are easy. Functions can perform calculations, manipulate data, and can store them. It is a block of code that executes when it receives a call.
Javascript function starts with a keyword function at start and name of the function after a keyword, it is called “function declaration” or function definition.

```
function nameOfFunction(){
    return "You have just called a function";
}
nameOfFunction()
```
The above function will print “You have just called a function”.
Dynamically, parameters can be passed to the function to provide values at run time. The parameters are unlike other languages, it does not require parameter data types explicitly. Javascript will automatically assign the data type to the variable or parameter.

```
function nameOfFunction(parameter){
     return "Value of Parameter is : " + parameter;
}

nameOfFunction("Dynamic Value")
```
Upon calling of above function it will print “Value of Parameter is : Dynamic Value”.
As earlier mentioned, the calculation can be performed from the javascript function, an example would be

```
function myFunction(a, b) {
     // Function returns the product of a and b  
      return a * b;
}
// Function is called, return value
myFunction(45, 55);
// furthermore, the returned value can be store in variable
var value = myFunction(45,55)
// this will print 100 in console. 
console.log(value)
```

Even more, you can perform more complex calculations as below

```
function toCelsius(fahrenheit) {
  return (5/9) * (fahrenheit-32);
}
var celsiusValue = toCelsius(77);
console.log(celsiusValue)
```

Javascript can perform almost any calculation and any valid mathematics expression.
Simple Flight Database: Database Design
Tags: database, beginners, learning
Published: 2020-11-30 20:22:20

**Database Design** is the process of defining how a database will be structured. This primarily includes tables, their relationships, and the columns each table contains.

Today we are going to design the database of a Car Rental Service.
To design a database first we need to make user stories.

## **1. User Stories**

According to Wikipedia, In software development and product management, a **user story** is an informal, natural language description of one or more features of a software system. User stories are often written from the perspective of an end-user or user of a system.

For our Simple Flight Database, these are user stories.
**a)** An airplane is assigned to several flights. A flight is assigned to only one airplane.
**b)** A pilot can perform several flights. A flight is performed by several(normally at least two) pilots.

## **2. Entity Relationship Diagram**

![Simple Flight Database](https://dev-to-uploads.s3.amazonaws.com/i/f5q560v3zlzzfx5dgkkq.png)

## **3. Relational Model**
![Relational Model](https://dev-to-uploads.s3.amazonaws.com/i/8f23bmvz4hjwo1pi3sj0.png)
Watching stock prices with Node-RED and Webhook2Telegram
Tags: javascript, telegram, automation, node
Published: 2020-11-30 21:01:48

---
title: Watching stock prices with Node-RED and Webhook2Telegram
published: true
date: 2020-11-30 20:08:47 UTC
tags: javascript, telegram, automation, nodejs
canonical_url: https://muetsch.io/watching-stock-prices-with-node-red-and-webhook2telegram.html
---

# Motivation
I hold a few stocks and I want to stay up-to-date about their quotations. However, I found it a bit tedious to actively log in to my portfolio every day to see what has changed. So I decided that I needed a notification system that **automatically informs me about the relative price changes** for all of my stocks once a day. Since I get all kinds of notifications – including security alerts from my server, updates in my GitHub feed, and more – via [Telegram](https://telegram.org), the choice to use that messenger for stock price notifications as well was quite obvious. Another obvious decision what have been to write a small Python script, that gets executed once a day via CRON. However, this time, **I didn't want to write any code**, but instead try the flow-based visual programming tool Node-RED.

[Node-RED](https://nodered.org/) is a JavaScript-based platform to compose logical workflows through combining small, elementary building blocks together. Such building block, called nodes, include functionality to ingest data (e.g. via HTTP calls, MQTT subscriptions or reading a file), process it (e.g. string replacements, logical condition checks, aggregations, etc.) and output it in some way again (again, via HTTP, MQTT, files, etc.). Without writing any code, but only through configuring these elementary operations, whole programs can be built. While Node-RED is primarily used in IoT contexts, it basically serves any purpose. An even more comprehensive and "mature" alternative is, to some extent, [Apache NiFi](http://nifi.apache.org/). However, while Node-RED is perfect for tinkering and small projects, NiFi focuses on scalability and Big-Data-like workloads.

# Flow
The resulting flow, that fulfills the above mentioned purpose looks like this.

[![](https://apps.muetsch.io/images/o:auto/rs,s:640?image=https://muetsch.io/images/nodered-flow.png)](https://apps.muetsch.io/images/o:auto?image=https://muetsch.io/images/nodered-flow.png)

The flow's entry node is an `inject` node, that holds a JSON array of all my stocks' symbols (e.g. `QCOM`) and is automatically executed once every afternoon. The message is then split into multiple, individual messages, namely, one for every stock symbol. A `http request` node then calls the [Alphavantage API](https://www.alphavantage.co/) once for every message to fetch the intra-day price changes. Subsequently, the response is parsed, post-processed and formatted as Markdown. Eventually all individual messages are combined into one again before my [Webhook2Telegram](https://github.com/muety/webhook2telegram) bot is requested to send me the message as a last step.

![](https://apps.muetsch.io/images/o:auto?image=https://muetsch.io/images/nodered-flow2.png)