teleren/devto huggingface dataset:
Coding podcasts and music!
Tags: podcast, javascript, beginners, webdev
Published: 2022-07-20 21:35:51

##Are you an animal who codes in silence? 
I have searched and reached all realms of Spotify and YouTube looking for the best coding playlists and podcasts. I can't work (especially not code lol) in silence. 

I found that while I'm doing my normal day to day job, Today's Top Hits on Spotify works but I lean more towards [The Fantasy Footballers Podcast] (https://open.spotify.com/show/5RaNsb5sKEBleahQa4MVC5?si=59b505980e1c4e25) or my new favorite [Front End Happy Hour](https://open.spotify.com/show/0Giuw6eNbTzP9CDZODDrA2?si=222258b372d84b7c).

##Tell me more about the Front End Happy Hour Podcast
Man oh woman. It is fun, it's a bunch of engineers from Netflix, Twitch and Atlassian who get together over drinks to discuss not only new tech stacks but the interview process, work culture and more. They bring in guests from other tech companies like LinkedIn on the show as well. I don't want to give away the best part of the show, but when they set it up and you listen through a whole show it's pretty fun. :) 

##What about those playlists? 
When I code, I don't want any music with words. I'm a huge fan of [LoFi Girl](https://www.youtube.com/c/LofiGirl) and [Code Pioneers](https://www.youtube.com/c/CodePioneers) on Youtube. Both are super chill with fantastic animations. I could watch a Code Pioneer "Midnight Coding Sesh" on YouTube all day lol. :) 

Spotify has some good ones too but right now I've been listening to [developer_focus()-concentration | programming | coding](https://open.spotify.com/playlist/1MZIjTu5sQT11G4XNaoqes?si=f42a34938a0a4332). Very chill but kinda trippy. I get lost in the sauce and find myself in my office working on my web app for 3 hours before I even realize it. 

What about you all? What do you listen to? Do you like 90s Country while you code? No judgment here. You do you! Just curious what others out there are listening to while they code/study/work. 

Happy Hump Day everyone!
#Azure – Creating an #AzureFunction ⚡ for #JulyOT
Tags: englishpost, azure, azurefunctions, bicep
Published: 2022-07-21 12:36:50

---
title: #Azure – Creating an #AzureFunction ⚡ for #JulyOT
published: true
date: 2022-07-20 21:28:22 UTC
tags: EnglishPost,Azure,AzureFunctions,Bicep
canonical_url: 
---

Hi !

In my [previous post](https://dev.to/azure/azure-azure-iot-and-bicep-creating-my-own-resources-for-julyot-28j9) I wrote about how (Thanks to Sam), I’m on the path to learn Azure Bicep 🦾. I’m also share how I’m using Bicep to create my demo environments for for JulyOT!

#### [https://julyot.dev/](https://julyot.dev/)

I shared a full Bicep file that, using an existing Resource Group:

- Create an Azure IoT Hub 
- Create a Storage Account
- Create a Function App
- Create an App Service Plan
- Create an Application Insights

This is the output view of the elements created on the Resource Group.

![resources created in azure](https://brunocapuano.files.wordpress.com/2022/07/image-1.png?w=750)

After this post, I had several questions around creating just an Azure Function, so let’s review a new Bicep file. With this remats

- Project name it limited to a length of 1-11.
- The Azure Function will be created on the same location of the Resource Group (line 32).
- The runtime will be “python”, we can remove the lines 35 and 36, I leave them just for reference.
- The hosting plan is defined in line 60, you may change it to fit your needs. 

{% gist https://gist.github.com/elbruno/9c1a10ec04b3ca96e9489abe07dae3ff %}

I hope this helps !

Happy coding!

Greetings

El Bruno

More posts in my blog [ElBruno.com](https://www.elbruno.com).

* * *
How to make a login and sign up form in python
Tags: python, database, csv, tutorial
Published: 2022-07-20 20:40:36

First start by installing the kittyscript library

```bash
pip install kittyscript
```

then import these libraries

```python
from kittyscript import *
import hashlib
```
here I'm using hashlib to hash the passwords and kittyscript to verify emails.

then make two if statements

```python
from kittyscript import *
import hashlib

S = input("Sign up or log in\n:")

if S == "Sign up":
    password = input("New Password\n:")
    NewUseremail = input("Your E-mail\n:")
    checkemail(NewUseremail)
    hashed_password = hashlib.sha256(password.encode('utf-8')).hexdigest()
    data = ["\n",NewUseremail, ",", hashed_password] 
    with open('index.csv', 'a', encoding='UTF8') as f:
        f.writelines(data)

if S == "Log In":
    Username = input("Your Username\n:")
    if Username in open('index.csv').read():
        Password = input("Your Password\n:")
        hashpass = hashlib.sha256(Password.encode('utf-8')).hexdigest()
        if hashpass in open('index.csv').read():
            print("Logged in")
        else:
            print("Invalid Username")
            exit()
    else:
        print("Invalid Username")
        exit()
```

and done
Multi Nested Dynamic Routes in NextJs
Tags: nextjs, javascript, tutorial, react
Published: 2022-07-20 20:40:27

Recently i've been working on a web app that im building in NextJs along side a lot of other technologies (via [create-t3-app](https://create.t3.gg/)). However, I came across a problem that I could not easily solve with some googling in the space of 15/20 minutes. So I thought that I would share my problem and solution, which will hopefully help others not go through the endless browsing of stackoverflow results as I did.

## The Problem:
I want to have multiple nested dynamic routes in my NextJs app.
So that I can build routes like:
``` '/product-catalog/123/product/1' ```

Now before I carry on with my solution, i'd like to add that basic dynamic routing is so easy.

All you have to do is have a folder structure like so:

```
- pages/
-- product-catalog/
--- [productcatalogid].tsx
```
This would produce the route:
```
/product-catalog/123
(123 being the productcatalogid parameter)
```

However, moving to multiple nested routes isn't available using the same principle. I.e. a folder structure like so:
```
- pages/
-- product-catalog/
--- [productcatalogid].tsx
---- product/
----- [productid].tsx
```
The above will simply result in a 404 everytime you go to request the page.

## The solution:
Simply implementing a folder structure like so:
```
- pages/
-- product-catalog/
--- index.tsx
---- product/
----- [productid].tsx
```
Seems to do the job nicely when dealing with multiple dynamic routes.

I hope this helped! For more information see the video that I found the solution on: https://www.youtube.com/watch?v=nfAxNTmme64
Svelte-kit tailwind component, does not load tailwind
Published: 2022-07-20 20:13:14

I am creating components with svelte-kit and tailwind, I have a parent component that I have some default properties and create a component that uses that parent component to make variations and thus create derivative components, I change the color of the letters, etc... What happens is that it does not load these variations, does anyone know why this is happening?

Parent component

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

Component with variation


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4atb8uuiv2ughmbpu17g.png)
Working From Home
Tags: workfromhome, productivity
Published: 2022-07-20 19:54:39

I've been an office employee for over 7 years, I was employed on my first ever job and being in office, I was thought that leaving yourself idle even for just minutes is bad, boss always have to look at employees if they are working in front of the computer, being a programmer in the office, if you're not busy on your computer 8 hours a day you're not being efficient. Because of this, I had to shut down the world around me and make music my fuel for coding. This was me for over 7 years, time in and time out is one of the most stressful things every weekdays, commuting is just pure pain for me as I'm not a morning person and I have a hard time waking up in the morning even as a child. There are times when I have stress at home that I just can't leave at home making me feel grumpy and make bad vibes ooze out of me. 

Last year I went fulltime working from home, and it feels a lot lighter for me, I can take breaks when I feel stuck and it's so mind-blowing, all along, when I feel stuck I stress about it as I had to fiddle on my computer because it feels like someone is always watching and just waiting to pounce, it gave me anxiety and my hair fell out, turned me into a stress-eater, when all I need is a break, stay away from the computer and think about the course of action I can make to solve problems, with this I'm still able to perform well and was more eager to focus and finish tasks. I'm actually very surprised that I'm able to scratch out things and start anew with better solutions rather than making ends meet with the current action I'm taking making everything look hacky, terrible and unclean. 

With this I realize that I love working from home, I love it when it's more output-driven rather than fiddling in front of the computer when all you need is to step away from it and think without anyone judging.

Today I had some mental and emotional stress I just can't get out of, I also have a meeting I need to attend to, but I excused myself out of it today and just focused on working because with the mental and emotional stress I just can't function as a social person. Am I the only one like this? Is this entitlement? I actually feel a little guilty doing this... How do you cope up when you go through this?
11 HTML5 TAGS I BET YOU HAVEN’T USED.
Tags: html, frontend, webdev
Published: 2022-07-20 19:40:10

"Write less, know less. Read less, know less"
                                   --unknown

Here I share some thoughts on some html5 tags that I rarely see used, despite the fact that they offer so much.

Take a read and share your thoughts.


https://medium.com/@stephengachoka/11-html5-tags-i-bet-you-havent-used-609168a733c2
📜 select * from 🚀 logfile with 🐘 file_fdw
Tags: yugabytedb, troubleshooting, logfile, fdw
Published: 2022-07-20 19:39:06


In the first post of this series, I traced the calls to DocDB with `yb_debug_log_docdb_requests`. The log goes to the PostgreSQL logfile but not though the PostgreSQL functions. This means that you cannot get them into the client when setting `client_min_messages`. This is why I connected from the server I was connected to, getting the file name with `pg_current_logfile()` but then going to the OS. However, we can access the OS from the PostgreSQL session and here is an example with `file_fdw`.

I am connected to YugabyteDB, with and create a `file_fdw` server to access files through a FDW foreign table. I go though an `awk` script that decodes the timestamp (`ts`) and adds a linne number (`nr`) to have an order. It also transforms the information to a `csv` format. When I query it, I return all lines into one value (with `string_add`) to get one row, with the last timestamp `as last_ts`. I do this to use `gset` to keep track of it so that the next call will show only the new lines `>:'last_ts'`

This is what I run to create all that and prepare the query:

```sql
-- create privileges, extension, and FDW server
do $do$ begin execute $sql$ grant yb_extension,yb_fdw to $sql$ || user; end; $do$;
create extension if not exists file_fdw;
create server if not exists file_fdw foreign data wrapper file_fdw;
-- create FDW table on current logfile
drop foreign table current_logfile ;
create foreign table current_logfile (ts timestamptz, nr int, log text) server file_fdw options ( program $bash$ awk '
/^[0-9]{4}-[0-9]{2}-[0-9]{2} [0-9]{2}:[0-9]{2}:[0-9]{2}[.][0-9]*/ { t=$1" "$2}
/^.[0-9]{4} [0-9]{2}:[0-9]{2}:[0-9]{2}[.][0-9]*/ { t=d" "$2}
{gsub(/"/,q q);print q t q "," q NR q "," q $0 q}
' q='"' d=$(date +%Y-%m-%d) '/home/opc/10.0.0.61/var/data/yb-data/tserver/logs/postgresql-2022-07-20_000000.log'
$bash$, format 'csv');
--
select now() as last_ts
\gset
deallocate logfile;
prepare logfile(timestamp) as
select
 max(ts) as last_ts,e'\n'||string_agg(log,e'\n' order by ts,nr) log
 from current_logfile where log like 'I%' and ts>$1
;
\pset format unaligned
```
With `log like 'I%'` I filter to get only the YugabyteDB information message. You can remove this to show all lines including the PostgreSQL messages.

Now, I can show the new lines since the last call with:
```sql
execute logfile(:'last_ts');\gset
```

## Example

```sql


-- set start timestamp and enable log docdb requests
select now() as last_ts;\gset
set yb_debug_log_docdb_requests=true;

-- run query
select count(*) from demo;

--  show log since start timestamp and reset to last time
\pset format unaligned
execute logfile(:'last_ts');
\gset
\pset format aligned
```
This shows the read request to DocDB
![screenshot](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6q1scxe9hysw35lgyuzc.png)

I use this on a lab to understand better the calls from YSQL query layer to DocDB distributed storage and transactions
Welcome Thread - v183
Tags: welcome
Published: 2022-07-20 19:22:49

---
title: Welcome Thread - v183
published: true
description: Welcome to DEV! A thread of hellos and intros.
tags: welcome
canonical_url: 
---

![Elmo waving hi!](https://media.giphy.com/media/3pZipqyo1sqHDfJGtz/giphy.gif)

### Welcome to DEV!

1. Leave a comment below to introduce yourself! You can talk about what brought you here, what you're learning, or just a fun fact about yourself.

2. Reply to someone's comment, either with a question or just a hello. 👋 

**Great to have you in the community!**
New Things Added - Laravel 9.20 Released
Tags: laravel, php, webdev, programming
Published: 2022-07-20 19:21:15

Let's get started quickly I found new things in Laravel 9.20 Released I wanted to share with you.

- allow Collection random() to accept a callable
https://github.com/laravel/framework/pull/43028

```php
$comments = $user->comments->random(5);

// Now
$comments = $user->comments;
$comments = $comments->random(min(5, count($comments)));
$comments = $user->comments->random(fn($items) => min(5, count($items)));
```

- feature: Str::inlineMarkdown()
https://github.com/laravel/framework/pull/43126

```php
Str::markdown('Use [Laravel](https://laravel.com)!') 
// <p>Use <a href="https://laravel.com">Laravel</a>!</p>

Str::inlineMarkdown('Use [Laravel](https://laravel.com)!') 
// Use <a href="https://laravel.com">Laravel</a>!
```

- Added required directive
https://github.com/laravel/framework/pull/43103
```php
<input type='email' name="email" @required( !auth()->user()->is_admin )>
<input type='password' name="password" @required( !auth()->user()->is_admin )>
```

- Add replicateQuietly to Model
https://github.com/laravel/framework/pull/43141
This method is similar to the existing saveQuietly, incrementQuietly, decrementQuietly...

```php
$replicated = $model->replicateQuietly();
```

- Change Policy 403 Code For Security
https://github.com/laravel/framework/pull/43097


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

I hope you enjoyed with me and to learn more about this release visit the sources and search more. I adore you who search for everything new.
Source :- https://www.youtube.com/watch?v=gHpurEE5Lfs
Source :- https://www.youtube.com/watch?v=kkwQLpIitdE
Building the database of tomorrow
Tags: database, cloud, javascript, rust
Published: 2022-07-20 19:19:25

WE ARE LIVE!!!

After years of building cloud-based SaaS systems, with realtime APIs, complicated security permissions, and multiple separate database backends, in 2015 we started conceptualising and planning a new database platform for building and scaling applications more quickly, while still allowing for the storage and querying of data in a structured yet flexible manner. The result was SurrealDB.

Taking inspiration from a range of databases including MySQL, OrientDB, CouchDB, InfluxDB, DynamoDB, MongoDB, RethinkDB, CockroachDB, Neo4j, and Firebase, development began on SurrealDB in 2016 with the intention of creating a scalable cloud graph database, built using Golang.

We wanted to build a database that we didn’t have to manage, that handled schema-less or schema-full data patterns, that could operate like a relational database (but without the JOINs), that could compete with the best document databases (but with a nicer more powerful query language), and that enabled us to build real-time applications effortlessly. Finally we wanted to build applications directly against our database, right from Chrome, Edge, or Safari. No more complicated APIs, no more complicated backends, no more complicated (and often error prone) security permissions. A database that allowed us to focus on our apps, not our infrastructure.

In 2021 the decision was made to open source SurrealDB, making it available to other developers and organisations in a private beta. Having learnt a great deal about building a future-ready database, the decision was made to re-build using Rust, in order to enforce data-sharing guarantees.

Today we are very, very excited to announce that SurrealDB is now in open beta to the world - SurrealDB 1.0-beta! The first beta version supports a large amount of functionality, with the ability to run in a highly-available, highly-scalable distributed environment. A highly-performant query language enables use of many different data types, and embedded JavaScript functions can be used for more complex functions and triggers.

Please give SurrealDB a star us on [GitHub](https://github.com/surrealdb/surrealdb), follow us on [Linkedin](https://www.linkedin.com/company/surrealdb/), follow us on [Twitter](https://twitter.com/SurrealDB), join us on [Discord](https://surrealdb.com/discord), and check out our [website](https://surrealdb.com/). If you have any questions about installing, starting or using SurrealDB, or you have an idea for a feature you would love to see in SurrealDB, let us know on [GitHub Discussions](https://github.com/surrealdb/surrealdb/discussions) and [GitHub issues](https://github.com/surrealdb/surrealdb/issues). We shall appreciate it immensely. Meanwhile, stay cool in this crazy weather and thank you for all the support over the years!

Tobie
Founder & CEO, SurrealDB
Don’t sleep on dotnet command line!
Tags: dotnet, programming, csharp
Published: 2022-07-20 18:44:58

If, like me, you’ve been developing Web APIs in .NET since the days of version 3.5 (or 2, or even 1.1!), then you’ve probably ran into the scenario of having to run multiple instances of Visual Studio to debug a multi-tiered or distributed application. If you’re still doing it to this day, there’s a trick to make life easier on us and on our poor laptops memory: run .NET Core apps from the terminal, even Web APIs!

Open a new terminal and browse to the project folder. From there, just do:

`> dotnet run`

Yes, simple like that. It triggers a build if the binaries are not present and starts up the application at the preconfigured endpoints. And if you're building .NET apps in Linux or Mac OS (you know you can do that, right?), it works just as well in the Unix terminal.

Bonus tip: If you haven’t tried the new Windows Terminal with tabs and customizable themes, check it out from Microsoft’s [official Github page or from the Windows Store](https://github.com/microsoft/terminal). It supports Windows Command Prompt, PowerShell, WSL, Azure and Visual Studio command line APIs.

It’s great to have multiple projects running locally while you work on an issue in one of the application layers. And great for not having to startup the entire Visual Studio suite several times.

What was the highest number of Visual Studio instances you had running on your machine at the same time?
Todo App Using A New Web Component Framework
Tags: javascript, webdev, beginners
Published: 2022-07-20 18:14:00

A Demo App Made Using [Tatva.js](https://github.com/rare-earth/tatva.js). Tatva is Web Component Framework that requires no build step. It uses a tiny implementation of Virtual Dom.

### How is it different from Stencil.js?
- No build step required. load the framework directly from CDN.
- Does not uses JSX. Instead uses Hyperscript functions.
- Does not uses non-standard decorators. Write Web Components in Pure Javascript.

### Similarities with other frameworks
- Uses Lifecycle events similar to React, but in Web Component-ish way. instead of ``componentDidMount`` and ``componentDidUnmount``, use ``componentDidConnect`` and ``componentDidDisconnect``.
- Uses Virtual DOM
- State Management is similar to React Class Components
- Minimal PropTypes implementation for automatically converting attributes that are set on the component.

## Unique features
- Tatva utilizes the Web Component API for handling props and Lifecycle events, instead of implementing its own. it just combines Virtual DOM with the already existing Web Component API.
- If you want to update the component when an attribute changes, just put the attribute name in the ``observedAttributes`` list.

### Todo App Demo
```javascript
import { Component, h, text } from "https://unpkg.com/tatva@latest";

class TodoApp extends Component {

    state = {
        todo: '',
        todos: []
    }

    setTodo(e) {
        this.setState(state => ({
            ...state,
            todo: e.target.value
        }))
    }

    addTodo(id, todo) {
        this.setState(state => ({ 
            ...state, 
            todos: [...this.state.todos, { id, todo }],
            todo: ''
        }))
    }

    removeTodo(todoId) {
        this.setState(state => ({
            ...state,
            todos: this.state.todos.filter(({ id }) => id !== todoId)
        }));
    }

    handleFormSubmit(e) {
        e.preventDefault();

        this.addTodo(crypto.randomUUID(), this.state.todo);
    }

    render() {
        return (
            h('main', {},
                h('form', { onsubmit: e => this.handleFormSubmit(e) },
                    h('input', {
                        oninput: e => this.setTodo(e),
                        placeholder: 'Enter Todo',
                        value: this.state.todo
                    })
                ),
                !this.state.todos.length
                    ? h('p', {}, text('No Todos.'))
                    : h('ul', {},
                        ...this.state.todos.map(({ id, todo }) => 
                            h('li', { key: id },
                                text(todo),
                                h('button', 
                                    { onclick: () => this.removeTodo(id) }, 
                                    text('Remove')
                                )
                            )
                        )
                    )
            )
        )
    }

}

customElements.define('todo-app', TodoApp);
```