teleren/devto huggingface dataset:
Design Web API endpoint without leaking data to monitoring service
Tags: architecture, azure, security, csharp
Published: 2022-01-09 10:45:49

---
title: Design Web API endpoint without leaking data to monitoring service
published: true
description: SSL is not enough, Web API endpoint design can leak sensitive data to a monitoring service. 
tags: architecture, azure, security, #csharp
//cover_image: https://direct_url_to_image.jpg
---

Right now SSL is a standard, but it is not enough to protect sensitive data. We can make a small mistake that can leak data that should be protected. For example — passwords. Even if you use cryptography to conceal the password bad endpoint design can expose it to a monitoring service or to a logger.

Here is a very common scenario. We decided to introduce the endpoint that will allow our users to restore passwords if they receive a restoration code.

``` csharp
[HttpPut("ChangePassword/{email}/{newPassword}/{code}")]
[ProducesResponseType(200)]
[ProducesResponseType(401)]
[ProducesResponseType(404)]
public IActionResult ChangePassword(string email, string newPassword, string code)
{
    // do logic
    return Ok();
}
```

Because I am using Azure in this example I will use [Application Insights](https://docs.microsoft.com/en-us/azure/azure-monitor/app/app-insights-overview) as a monitoring service for this app.
 
Let's hit the endpoint and check what we will be able to see in logging:

![Application Insights Logs](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yfehz7v3sa7hn7l01q60.png)

So as you see, It exposes the password of the user. To prevent this we need to change our Web API endpoint. Instead of using the URL itself, we will put data in the body.

``` csharp
[HttpPut("ChangePassword")]
[ProducesResponseType(200)]
[ProducesResponseType(401)]
[ProducesResponseType(404)]
public IActionResult ChangePassword([FromBody] ChangePassword body)
{
    // do logic
    return Ok();
}
```

Let's check the logs!

![Application Insights Logs](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hwscfl5m8kxu5rli4rmp.png)

As you can see all the sensitive data should be put in the body of the request and not in the URL. SSL will encrypt everything but the monitoring service or logger will expose it. 

Thank you and be safe!
Menampilkan Raw Html Di Vue
Tags: tutorial, vue, javascript
Published: 2022-01-09 10:20:16

Tutorial kali ini cukup mudah,hanya bagaimana kita menampilkan **html mentah** atau biasa dibilang orang, **raw html**.

Jika kita punya variabel yang berisi tag html,seperti dibawah ini.

```javascript
textHtml: `<b>Ini teks bold</b>`
```

lalu menampilkan seperti ini.

```html
<p>{{textHtml}}</p>
```

Maka akan keluar hasil seperti dibawah.


![Menampilkan Raw Html Di Vue
 1](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ijsia3weh8i9gmrtu1ev.png)

Bisa dilihat tag **<b>** tidak terrender.Jika ingin variabel tersebut terrender kita harus menggunakan **directive** bernama **v-html**.

Sehingga kode kita menjadi.

```html
<p><span v-html="textHtml"></span></p>
```

atau bisa langsung di tag **<p>**

```html
<p v-html="textHtml"></p>
```

Hasil yang kita dapatkan seperti gambar dibawah,tag html akan ikut dirender.

![Menampilkan Raw Html Di Vue 
2](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/raou9ieddk5i8nzzzl60.png)

Sekian tutorial kali ini,saya rasa cukup mudah membuatnya di **vue**, karena hanya menambahkan directive **v-html**.
JS- Ternary Operator
Published: 2022-01-09 10:17:50


TL;DR The ternary operator is a shortcut for if/else

It contains three operands

A condition
A question mark ?
A colon :

if/else
```
let fruit;
if(fruit === "Apple"){
    return "It is a fruit";
}else{
    return "It is not a fruit";
}
```

Ternary operators
```
let fruit;
let ternary = (fruit === "Apple") ? "It is a fruit" : "It is not a fruit";
```
See how it got executed in one line
ZigZag Conversion – LeetCode Solutions
Tags: leetcode, python, algorithms, datastructures
Published: 2022-01-09 10:07:14

LeetCode has a hard coding Problem in Its’ Algorithm Section: “ZigZag Conversion of Given String”. Today We are going to solve this problem.

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

Question
The string "PAYPALISHIRING" is written in a zigzag pattern on a given number of rows like this: (you may want to display this pattern in a fixed font for better legibility)

P   A   H   N
A P L S I I G
Y   I   R
And then read line by line: "PAHNAPLSIIGYIR"

Write the code that will take a string and make this conversion given a number of rows:

string convert(string s, int numRows);
Examples
Input: s = "PAYPALISHIRING", numRows = 3
Output: "PAHNAPLSIIGYIR"
Input: s = "PAYPALISHIRING", numRows = 4
Output: "PINALSIGYAHRPI"
Explanation:
P     I    N
A   L S  I G
Y A   H R
P     I
Input: s = "A", numRows = 1
Output: "A"
Conditions
1 <= s.length <= 1000
s consists of English letters (lower-case and upper-case), ',' and '.'.
1 <= numRows <= 1000
Solution to Zigzag Conversion is given here https://hecodesit.com/zigzag-conversion-leetcode-solutions/
Artificial Intelligence in Future
Published: 2022-01-09 10:02:44

While Artificial Intelligence has been a thing for a long time, it is only recently that the rate of progress has been accelerating. At this point, many people are wondering what the future might hold as AI becomes more and more integrated into our daily lives. With the 2020s on the horizon, it’s finally time that we ask: what will happen when AI achieves human-level intelligence?

This post discusses some of the possibilities posed by this development (and how to avoid disaster!). We [discuss ](https://www.olehanaarabic.com/)what humans can do for work with robots handling most of our tasks. We talk about how artificial intelligence interacts with us in aspects like healthcare and education.
Membuat Slug Di Laravel
Tags: slug, laravel, programming, tutorial
Published: 2022-01-09 09:53:02

**Membuat Slug di Laravel**.Apa itu slug? Slug sendiri adalah bagian dari **URL/Permalink Website** yang merujuk pada sebuah konten secara spesifik.Slug berada di bagian belakang dari permalink,setelah nama domain anda.Kalau biasanya temen-teman buat detail **data** masih dengan angka seperti dibawah ini.

```
https://medanincode.com/post/ci4/2/
```

Dimana **2** adalah id dari si **data**,ini kurang ramah **SEO Friendly**,kita akan merubah menjadi seperti dibawah ini agar lebih **SEO Friendly**.

```
https://medanincode.com/post/ci4/passing-data-controller-ke-view-di-codeigniter-4/
```

#### Str::Slug

Cara paling mudah adalah menggunakan perintah **Str::slug('parameter')** jadi ketika menyimpan hanya menggunakan code seperti dibawah ini.

```php
<?php
...

public function store(Request $request){
    $post = new Post; 
    $post->title = $request->title;
    $post->slug = Str::slug($post->title, '-'); 
    $post->body = $request->body;
    $post->save();
    
}
```
Tapi kalau hanya dengan cara ini akan ada kendala jika post memiliki **title** yang sama.Karena slug juga bersifat **unique**.Daripada teman-teman pusing memikirkan logikannya bisa menggunakan package **cviebrock/eloquent-sluggable**.

#### Package cviebrock/eloquent-sluggable

Untuk menggunakan package **cviebrock/eloquent-sluggable** pertama yang dilakukan adalah install package.

```cmd
composer require cviebrock/eloquent-sluggable
```

Setelah terinstal publish konfigurasi file agar bisa merubah settingan default dari package.

```cmd
php artisan vendor:publish --provider="Cviebrock\EloquentSluggable\ServiceProvider"
```

Update Model laravel teman-teman,contohnya menjadi seperti dibawah ini.

```php
<?php
use Cviebrock\EloquentSluggable\Sluggable;

class Post extends Model
{
    use Sluggable;
    /**
     * Return the sluggable configuration array for this model.
     *
     * @return array
     */
    public function sluggable(): array
    {
        return [
            'slug' => [
                'source' => 'title'
            ]
        ];
    }
}
```

**title** adalah nama kolom table yang akan dijadikan patokan dari **slug**.Atau jika ingin menggunakannya tanpa menambahkan di **model** panggil fungsi **SlugService::createSlug** seperti contoh dibawah ini.

```php
<?php
...
use Cviebrock\EloquentSluggable\Services\SlugService;
...
public function store(Request $request){
    $post = new Post; 
    $post->title = $request->title;
    $post->slug = SlugService::createSlug(Post::class, 'slug', $post->title);
    $post->body = $request->body;
    $post->save();
    
}
```

Sekian tutorial kali ini,jika ada yang kurang jelas bisa ditanyakan dibawah.Kalau diatas susah gak ada kolom komentar.
Day 1 of 100 - Java: 100DaysChallenge, game rules
Published: 2022-01-09 09:47:37

Starting point

Docs for Java: 
1. https://docs.oracle.com/en/java/index.html
2. https://docs.oracle.com/en/java/javase/17/docs/api/index.html

My initial goals:
1. Build something (anything) with Java
2. Get the grasp of the Java language syntax
3. Tools for working with Java
4. Communities to involve with for learning

Curriculum:
Intermediate
1. Collections
2. Lambda expressions
3. Generics
4. Exception handling

Advanced
1. Java streams
2. Reflections API
3. Classes and interfaces

---

Understandings

You cannot achieve very good performance, so keep consistency and reading the basic programs, revising regularly and try not to compare with other very good performing coders.
Fastest way to learn ! ⏩
Tags: programming, discuss
Published: 2022-01-09 09:43:32

In the last 2 years, I worked as trainer/mentor at various bootcamps. And got a chance to interact with thousands of learners. One of the most frequently asked questions is, how to learn anything **_fast_**? How to master XYZ technology in hours/days/week? 


![Flash](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1bv76hheoy2ptoijc1db.gif)
 
This is an interesting question. There are topics that I read a few weeks back and hardly remember anything 🤷‍♂️. There are topics that I learned years ago and still remember vividly. Here is what I learned by learning and failing to learn many things so far in the last 15+ years

People (including me) typically try following things to speed up learning.

**1. Choosing a faster medium** 📺

Most learners choose video over books. Assuming video content can be consumed quickly and less boring than books. While some claim that text can be consumed faster. As per Educative, the average video tutorial is spoken at 150 words per minute, while you can read at 250

**2. Increasing speed of consumption** ⏩

Like watching a video at 1.5x+ speed which is also highly promoted by other fellow developers. I watch all videos at 1.5x speed. Or doing speed reading so you can finish a book quickly.

**3. Preferring short version of the content** 🧵

Instead of reading through the complete book, just read a summary of it. Or watching a quick/high overview video etc. Or just asking someone to explain the concepts.

But does it help? What works for you? Let’s keep this boring topic aside for a moment and talk about something more interesting. 

Something like food 🍔 Suppose you are sitting at your favorite McDonald, and order your favorite big mac burger. Now there are two ways to finish the tempting burger

![Burger](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/h6ni7e8dhi3p3l1upk7h.gif)
 
1. Finish the burger quickly by gulping it down. You will save some of your eating time. But your stomach would have to work hard to digest it further. Also, you may not get optimum energy out of it.
2. Or you can take your sweet time, chew it well. So your stomach does not have to work hard and you will get good energy out of consumed food.

So what is more important? Finishing burger quickly or getting optimum energy out of it?

The same applies to learning. Is it about learning fast so you can forget it quickly or is it about learning well so you can successfully implement it?

In my personal experience, I learned 

> ##  The way to learn fast, is to learn well!

Do not worry about the medium you are using or the time you are taking. It is irrelevant. It is more important that you should understand it well and should be able to apply it in your work.

What is the topic you really enjoyed learning? What is your secret of learning well?
Getting started with React Native #3 - Setup
Tags: reactnative, android, ios
Published: 2022-01-09 09:42:25

## Let get it on!
First of all, I want to setup the basic dev environment... I'll stick with the official guide on [React Native](https://reactnative.dev/docs/getting-started).
Let's see...

1. ![Aaah. A nice clean terminal.](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/l8gq7dn364pz2ukl4u7v.png)
2. Let's see... Is nodejs installed?

![Yup! Even the current version. Yay!](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/k0icxmqbn3el76v3ibxi.png)
3. Next step... Totally on purpose... make a type to see, if the audience is following along. Then do the right step...

![Haha! GOTCHA! No seriously... install a jdk!](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d91g0ika6sxgeicmaykb.png)

4. Downloading Android Studio even though I don't want to use it...

![Time for a cup of coffee. Thanks to my potatoe internet connection.](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fuzb4a0uk71wraounikx.png)

5. Watchman? What the hell is watchman? Well.. alrighty... Install Watchman then... I'll stick with the dist-package though...

![Hello there!](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jz91n3e9vg9b6ds9j4sk.png)

6. Guess that's it... Woohooo! Let's code... Right? RIGHT?

![react-native: 'HAHA! NOOB! NEVER!'](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/g94rplgns4jk315vw3fl.png)

7. A decade later...

![Install #1](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zwuaqj94fi9joe9zg62m.png)

![Install #2](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zldwc1hei0djoibwg0ng.png)


![Install #3](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8ujwyc56d89zr4n2t527.png)

That's it, right? Let's get it on!

![GNAAAAAAH!!!!!](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qsnh0ounnyshwwoypgns.png)

8. Forget about it! Let's docker it...

![Aaah... beautiful docker magic!](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/e7msa98mwek1kz3n63y6.png)

Well after losing a lot of precious time installing half of the internet without any benefit... That's it for now... My suggestion for the react-native-community... go fix those Install-hell! Thanks! xoxo
How to setup Tailwind in your project
Tags: webdev, tailwindcss, css
Published: 2022-01-09 09:41:42

Tailwind is a utility-first framework consisting of various classes to help you build clear and responsive designs fast inside HTML markup file.
In this post, you will learn how to set up tailwind in you project step-by-step.
1. Create a new directory:
```powershell
mkdir tailwind-website
```
2. Generate a `package.json` file:
```powershell
npm init -y
```
3. Now we can install all our required dependencies. Simply install Tailwind using the command:
```powershell
npm install tailwindcss
```
4. Inside your project folder, create these files:
```md
./public
./src
   ../styles.css
```
Our project will have two stylesheets, one inside `public` folder, which will contain all the Tailwind classes we talked about earlier. To get this, we'll make use of our second CSS file which is in the `src` folder.

5. Add custom styles for Tailwind in your source file:
```css
/*   src/styles.css:   */
@tailwind base;
@tailwind components;
@tailwind utilities;
```
Now we need to write a script that will process Tailwind classes inside our `public` folder.
6. Write the build script inside `package.json`. You can name it whatever you want. I call it `build-tw`:
```json
 "scripts": {
 "build-tw": "tailwindcss build src/styles.css -o public/styles.css"
 },
```

> `src/styles.css` → source css file
> `public/styles.css` → output css file

The final step is to run the script. Simply open your terminal and run the command:
7. run the above script:
```powershell
npm run build-tw

# runs tailwind and generate the output css file 
# (public/styles.css) where all our css lies.
```

And it's done. Check out the file `public/styles.css` which was empty before.  All the Tailwind CSS utilities can be now found in `public/styles.css`.

That's all for this one. Let me know if you've any doubts. Thank you for reading!
HTML email signatures
Tags: html
Published: 2022-01-07 23:01:09

Tenemos que admitir que usar una imagen como firma de correo electrónico es estéticamente superior si tienes (o eres) un buen diseñador. Pero cuando hablamos de utilidad las firmas HTML llevan por mucho la delantera; Ahora si queremos que las firmas HTML sean mas estéticas, podemos hacer un esfuerzo para lograrlo pero si quieres hacer funcional una imagen... bueno, inténtalo y me platicas como te va con dolores de cabeza y la perdida de cabello.

En primer lugar, si sólo utilizas una imagen como firma de correo electrónico, corres el riesgo de que tus correos electrónicos sean tratados como spam. Esto se debe a que la proporción texto:imagen es demasiado baja.

Y en segunda, si quiero seguirte en alguna red social? o marcar a tu móvil? o entrar a tu web? deberé copiar el texto de la imagen a mano. Debería haber una forma mas fácil, no?

Pues sí: **Hipervínculos**. Esto significa que puedes dirigir a tus clientes o contactos exactamente a lo que buscan, tanto si se hace clic en el logotipo o en un icono de una red social, la persona que haga clic será conducida exactamente a lo que busca.

Lamentablemente estas no son tan sencillas de hacer y las aplicaciones que hay por internet suelen tener un costo, así que como primer proyecto del año me di un fin de semana para dar una solución rápida y elegante a este problema.

[Mail-sign](https://mail-sign.vercel.app/) pruébala, y no dudes en dar tu opinión o sugerencia, cualquiera es bienvenida.
School and finance
Tags: discuss, growth, finance, improvement
Published: 2022-01-09 09:05:03

---
title: School and finance
published: true
description: Why financial literacy isn't taught in school?
tags: discuss, growth, finance, improvement
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/youxl04x5u6jz6bufl5w.jpg
---

_Originally published on [my blog](https://www.nikola-breznjak.com/blog/daily-thoughts/school-and-finance/)._

Why financial literacy isn't taught in school?

P.S. I know, the drawing looks like a kidney. And no, the joke is not lost on me 🙂

---

This is [why I write](https://www.nikola-breznjak.com/blog/daily-thoughts/why-do-i-write-these-daily-thoughts-posts/) these "daily thoughts" posts.
What's So Trendy About Web3.0 That Everyone Went Crazy Over It?
Tags: web3, internet, blockchain, beginners
Published: 2022-01-09 08:56:56


You have probably seen the term “ web 3.0 ” drifting on the internet. Simply put, web 3.0 is the new form of the web’s process. These changes that web 3.0 is taking to the net is starting to make it to a whole new level. Expert scientists and web experts think that these modifications are starting to make the web smarter and our lives easier. Therefore, to see these paradigm-shifting changes, get’s first see the development of the internet as we learn it.

Presently, to the best of my learning, there is no pragmatic explanation for web 3.0 yet and the technology that can make us there has not yet grown yet. Then to get a better familiarity with web 3.0, let us see the example. In web 2.0, users will interact with sites that have predetermined behaviours according to the information of users. Users will search for data using different search engines which generally give acceptable results if there is sufficient data regarding the search. Still, this search is just for keywords and takes in the most common information available, and does not comprehend the context of this quest. So if the person searches for an insect named the Camaro and uses just that one language, So almost 90% of the search outcomes exist for the Chevy Camaro model of auto and not the insect because the automobile is the most common search outcome and gets the most prolific information. Simply put, Web 2.0 is built around the user, producer to build a way to enable and engage them. Though whatever has an advantage will surely have a disadvantage, Web 2.0 has a few drawbacks and they are:

1. Lack of control.
2. Lack of privacy.

Lucky enough Web 3.0 nullifies these disadvantages. Here are a few of the advantages of Web 3.0:

1. Privacy.
2. Data Ownership & Sharing.

Berners-Lee's conception of the Semantic system is in obvious contrast to the advocates of web 2.0, which he gets strongly criticised. This Semantic system may more properly be referred to as one process of web 3.0, which includes more improvements in this “ back-end ” information structure, particularly information tags, to support natural language searches and data mining.  (Britannica .) 

Web 3.0 will be a total reinvention of the web, something that Web 2.0 was not. Web 2.0 was simply an expansion from the original Web which can be compared to a library, as Web 1.0 was essentially an info dump, a place where people just positioned walls upon walls of text which people can read but usually not interact with. Web 2.0 revised this by allowing user interaction with dynamic websites that acted more like applications than simply pages of information.

Does any of this interest you? I sure hope so. 

Do well to follow me on:

- [Twitter](https://twitter.com/obubuoge) 
- [GitHub](https://github.com/ogeobubu) 

Thank you for reading🎊
C++ Language Base of All Coding
Published: 2022-01-09 08:32:16

Let's take a few minutes to talk about C++. C++ is the language that all other coding languages are based on. Ever wonder why? Well, if you've ever tried to code without any understanding of what you're doing, it can be a little daunting...

C++ is a programming language that has been around for decades now as an alternative to original BASIC and COBOL languages, which were all the rage in their day. C++ became famous for creating powerful and complex programs like the original Internet browser and multimedia server, as well as advanced 3D graphics applications such as Maya (and similar applications, including Blender), the game engine Crystal Space and the player-versus-player online games Quake III and Day of Defeat.

C++ is one of three basic languages used to program operating systems, alongside Basic, a language actually more suited to making video games because it is much more restrictive than C++ in what you can do.

Source: [OLEHANA](https://www.olehanafrance.com/)
Elm: ushering in a new era of web development
Tags: elm, javascript, pythonic
Published: 2022-01-09 08:32:02

_This article may very well read as yet another critique of Javascript no one asked for, but seeing as Javascript == web dev, I just wanted to put my thoughts out there on why Elm is a herald of great things to come… _ 


I am partial to languages that adhere to a “pythonic philosophy”. In other words, the community strives toward a standard way of doing things. 

Throughout its long tenure, Javascript has become an overwhelming and unwieldy beast. Mastery over the multi-headed chimera  requires one to wade through the accumulated clunk and navigate a dense ecosystem. It has become heavily reliant on an infinitely growing list of external tools, libraries and frameworks. 

Of course all these points lend to Javascript’s flexibility and range. It is a wholly capable language but at the critical cost of compromise to its clarity of practice. It is very much a personal preference, but if you give me 3 ways of doing something, 2 of those ways are wrong. When multiple patterns exist, they tend to get in each other’s way and lead to incoherence in the codebase. 

All of this is to say I am very excited to see the future of web app languages like Elm that are adding much needed modernization and streamlining to frontend development.