teleren/devto huggingface dataset:
What is "good" site/api flow?
Tags: webdev, programming, discuss, startup
Published: 2023-07-28 22:02:03

Hello World!

Hierarchy, flow, layout and user experience. These are all factors essential to web dev, without them, buyers wouldn't know where to buy and complainers wouldn't be able to find the damned support email.

But what is good site flow?

Keeping in line with my last post, I'm still doing "market research" for Zitemap, the site/api structure visualization tool I'm building, and I'm trying to find out what defines "good" site flow and "ripping-my-teeth-out-cos-i-cant-find-the-api-endpoint" api structures.

Any comments are welcome, If you do comment, it would be nice to know whether you're hacking solo, from startupland, or in big-tech.

Peace!
Day 793 : Zombie
Tags: hiphop, code, coding, lifelongdev
Published: 2023-07-28 22:00:05

_liner notes_:
- Professional : Today was a half day, so I was able to get a blog post draft that I wrote submitted for review and the accompanying code for a demo pushed to a GitHub repo to also be reviewed. Responded to a community question. Did some more work on another demo application I've been building. Not a bad half day.

- Personal : Last night I picked up some projects on Bandcamp and prepared my posts for Twitter, Bluesky and Threads the next day. Don't really remember doing anything else.

![The stone statues of Stonehenge, England at sunset.](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/u297pgwoui28iolc1c6a.jpg)

So after work, I was looking at some stuff for my van's battery situation and then took a nap. Got up and started putting together the radio show. I've a little ahead on the tracks so I'll probably do less and get the show prepared quicker. That way I'll have more time to go through stories for the radio show and work on my side project. I just found out that the "Zom 100" anime has been airing. There's like 3 episodes out. It's about a zombie outbreak and looks interesting and I'm going to try and get caught up. There's supposed to be a live-action version releasing soon.

Have a great night and weekend!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube B1lBBsoc4ws %}
The 47th Day of the 100 Days of Code Challenge
Published: 2023-07-28 21:24:06

Hey guys!

Worked some more on the real-time transcription app, decided to drop multi-client support at this stage since the transcription calls are not thread-safe and this is not a priority.

What was a priority is understanding why the diarization identifies speakers as unknown so frequently.

I tested Diart and found that the diarization is pretty much on-point, it's just that the transcriber didn't work quite well. It overshot the start and end times, exceeding the duration of the stream.

It seems to happen more frequently when using the small model rather than when using the large-v2 model, but it still happens. I started by testing Diart separately without any transcription and then printed out everything that would aid me in understanding the source of the problem.

- Diarization results

- Time shift (the time that should be added to the start time the transcription generates for a given segment, as the diarization accounts for the entire stream and it may already have been transcribing for 120 seconds, for example.)

- Transcription start and end times

- Transcription start and end times after time shift

That's when I found the start times can sometimes be 20 seconds, which doesn't make sense since the audio data being transcribed is 2 seconds long.

I'm currently exploring ways to fix this, hoping to solve this tomorrow and finally release a working version of this! If this works, will move on to exploring ways to re-format the transcription live and implementing Whisper implementations that will give a performance boost of up to 80%.

Happy coding everyone!
UTF-8 code points U+1234 meaning
Tags: unicode, utf, raku
Published: 2023-07-28 21:15:17

**Code point** (ssometimes written as "codepoint") is an ordinal position in addressable encoding space.

In ASCII code points were very straightforward because addressable space was continuous. Binary value of a character converted to decimal **was** a code point. There were 128 code points defined, as you already know from previous posts. For example `a` character with binary value of `01100001` is at codepoint `97`. 

```
raku -e '0b01100001.say'
97
```

Raku also provides convenient method to get <u>decimal</u> codepoints:

```
$ raku -e '"a".ord.say'
97
```

In UTF-8 things get complicated. In previous post about [UTF-8 internal design](https://dev.to/bbkr/utf-8-internal-design-5c8b) I explained that **`1`**`xxxxxxx` starting byte is forbidden in multibyte characters, which makes namespace non-continuous.

UTF-8 code points are usually written in <u>hexadecimal</u> notation as `U+0105`. Let's first learn **how to convert code point to binary value of character**.

**1.** Convert hexadecimal value to bits.

```
$ raku -e '0x0105.base( 2 ).say'
100000101
```

**2.** Find smallest possible character byte length that can fit this amount of bits (9 in this case). Control bits does not count.

- `0`**`xxxxxxx`** - This has 7 bits left, too small.
- `110`**`xxxxx`** `10`**`xxxxxx`** - This has 11 bits left, perfect!

**3.** Fill free bits with our codepoint `100000101` bits starting from the right.

`110xx`**`100`** `10`**`000101`**

**4.** Fill remaining free bits with `0`s.

`110`**`00`**`100` `10000101`

**5.** Done:

`11000100` `10000101`

Let's check which character `U+0105` points to:

```
$ raku -e 'Buf.new( 0b11000100, 0b10000101 ).decode.say'
ą
```

And just to confirm:

```
$ raku -e '"ą".ord.base( 16 ).say'
105
```

The opposite conversion is straightforward - take binary representation of a character, throw away control bits and convert it to hexadecimal.

**Coming up next:** [Glyphs and graphemes](https://dev.to/bbkr/utf-8-glyphs-and-graphemes-331b).
Day 14: This is lost
Tags: day14, javascript, 100daysofcode
Published: 2023-07-28 20:00:00

In JavaScript, the context of `this` can be lost in certain situations, leading to unexpected behavior. 

## Passing a Method as a Callback:
When you pass a method as a callback function to another function or event handler, the context of this can change unexpectedly.

```javascript
const obj = {
  nom: 'John',
  sayHello: function() {
    console.log(`Hello, ${this.nom}!`);
  }
};

// Using the 'sayHello' method as a callback to setTimeout
setTimeout(obj.sayHello, 1000); // output: Hello, undefined!
```

when setTimeout executes the `sayHello` method, the context of `this` is no longer `obj`, but it becomes the global object. As a result, `this.nom` will be `undefined`.

To solve this issue, you can use function borrowing to explicitly set the context of this before passing the method as a callback

```javascript
setTimeout(obj.sayHello.bind(obj), 1000);
// or
setTimeout(() => obj.sayHello(), 1000);
// or
setTimeout(function() {
  obj.sayHello();
}, 1000);
```

## Invoking a Method Returned from a Function:
Another common scenario where the context of this can be lost is when invoking a method returned from another function

```javascript
function createCounter() {
  return {
    count: 0,
    increment: function () {
      this.count++;
    },

    getCount: function () {
      console.log(this.count);
    },
  };
}

const counter = createCounter();
const incrementFn = counter.increment;
incrementFn(); // What will happen here?
```

when we assign `counter.increment` to `incrementFn`, it loses its association with the counter object. So, when we call `incrementFn()`, this inside the increment function becomes the global object (window or global), and count will not be accessible.

To preserve the correct context of `this`, you can use `bind`

```javascript
const incrementFn = counter.increment.bind(counter);
incrementFn(); // Output: 1
```

## Summary:-

Being mindful of these situations where the context of `this` can be lost is crucial to writing correct and predictable JavaScript code. Using appropriate binding techniques or arrow functions can help ensure that `this` behaves as expected in different contexts.
AWS CloudQuest Networking-Monitor and analyze Network Traffic
Tags: aws, cloudquest, cloud
Published: 2023-07-28 19:57:08

1. Setup CloudWatch log group 

In creating log group there is option for setup "retention setting". Retention setting can be used how long **log events** are kept in CloudWatch Logs. They are very useful in detecting problems with applications in real time, because CloudWatch is service to monitor in real time situation in AWS. 

Expired log events get deleted automatically. Just like metric filters, retention settings are also assigned to log groups and the retention assignes to a log group is applied to their log stream. 

Option "Never expire" can increase your log storage **COSTS.**


![cwatch-never-expire](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qlr878xe3692utfadogm.png)

**AWS System Manager**, feature Session Manager is fully managed AWS System Manager. Session Manager help users to manage services: 
- EC2
- Edge devices
- On-premises servers
- Virtual Machines (VMs) 

Session Manager allow to user specify amount of time to allow a user to be inactive before the systems ends a session. 

If you are planning to play this task "Monitor and analyze Network", the task have error during connection on EC2 instance. 

**AWS Support is contacted so I hope so that it will be resolved soon.** You can see error on the [link](https://www.youtube.com/watch?v=cwmmf43w2aI).
Deployment nightmare - como medir o sucesso do seu release - parte 1
Tags: productivity, release, softwaredevelopment
Published: 2023-07-28 19:35:34

Trabalhando por 15 anos com desenvolvimento de software, já enfrentei diversas sextas-feiras, antes do deployment de um release em produção, com frio na barriga e com a certeza que meu final de semana certamente estaria perdido.

Muitas vezes seguíamos todo o processo de desenvolvimento,com longos períodos de teste mas não tínhamos confiança de que tudo ocorreria bem após a implantação do software.

Após alguns anos de experiência trabalhando em diversas funções em TI, posso dizer que é possível ter um final de semana tranquilo e implantar software com confiança em produção.

Um artigo apenas não seria suficiente para discutir todos os fatores e processos que envolvem um deployment por isso pretendo escrever uma série de artigos sobre o assunto.

O primeiro passo é o diagnóstico. Comece estabelendo algumas métricas. Sugestões:

1. Tempo de desenvolvimento do release: deve incluir desde do início do desenvolvimento até implementação em produção;
2. Número de defeitos encontrados em pré-produção;
3. Número de defeitos encontrados em pós-produção;
4.Taxa de rollback: (total de deployments revertidos)/(total de deployments). O ideal é que esse número seja zero.

Você pode acrescentar mais métricas mas acredito sejam um bom começo. Elas ajudarão a entender o cenário atual e são base para entender se as mudanças que serão aplicadas aumentam ou diminuem a eficiência. 

Antes de implementar qualquer mudança no seu processo, eu recomendo colear esses dados em pelo menos 5 deployments.

No próximo artigo eu discutirei sobre branch strategy.

Até breve,
#mathlighting
Tags: programming
Published: 2023-07-28 19:33:24

**Mathlighting** is the act of silencing the people who criticize a _clunky_, _counter-intuitive_ or _more complicated than absolutely necessary_ programming language/framework/library with claims of mathematical superiority.

### Examples

_"Of course it is hard to get it at first, but writing your code in 6 separate layers like this will eliminate side effects, which are mathematically proven to be bad for your code!"_

_"I repeat, we have eliminated the billion dollar mistake, there are no `NullExceptions` in our language! Once you have _taken the time_ to _really_ understand it, you will see its superiority!"_

I say it again: unless you do actual calculations, **clarity** >> **mathematical claims**. But even when you do calculations proper naming, scoping functions/actions into understandable sized blocks and laying out those steps in a logical order will make your and your colleague's life better.
What is observables in Angular?
Tags: angular, rxjs, typescript
Published: 2023-08-30 18:53:00

---
title: What is observables in Angular?
published: true
date: 2023-07-28 18:30:00 UTC
tags: Angular,RxJS,Typescript
canonical_url: http://www.codetolive.in//angular/rxjs/typescript/what-is-observable-in-angular/
---

We will first understand the RxJS library before going to the observables in Angular.

**_What is RxJS?_**

RxJS is a library for developing asynchronous and event-based applications by using observable sequences.

**_What is Observable?_**

It is an invokable collection of values and events. It is defined as a function to push values, and it is not executed until the consumer subscribes to it. The consumer will receive the notifications until the subscription has been unsubscribed.

It provides support for passing messages within the application. It is frequently used in Angular as a technique to handle asynchronous and event-based programming.

**_Example of observables:_**

```
// Import the RxJS namespace
import {Observable} from 'rxjs';

// Implement the method returns the observable
search(userId:string): Observable<UserInfo[]> {
   return this.http.get(apiURL?userid= + userId)
}

// Subscribe to the observable method to receive the notification
this.search().subscribe(
  (userList: UserInfo[]) => this.users = userList,
  (error: any) => this.errorMessage = error
);

```
SyntaxError: Unexpected end of JSON input
Tags: javascript, fetch, webdev, errors
Published: 2023-07-28 18:16:43

My front-end javascript code shows `SyntaxError: Unexpected end of JSON input` by each time running, I can locate the error comes from my fetch function.
In the beginning, I thought it was because my JSON content in the fetch request has some issue, after several guesses, I realized that is because PUT method has no response body.

My problem function as below:
```
function func(email) {
  fetch(`/emails/${email.id}`, {
         method:'PUT',
         headers: { 'Content-Type': 'application/json' },
         body: JSON.stringify({read: true})})
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(err => console.log(err))
}
```
It is my the first time write a fetch with PUT method, When I try to deal with fetch response, I copy the GET method process, by those "then". 
Actually, PUT method has no response body, so the problem comes from the `then(response => response.json())`.

Then finialy, I changed the code like this, no more error.

```
function func(email) {
  fetch(`/emails/${email.id}`, {
         method:'PUT',
         headers: { 'Content-Type': 'application/json' },
         body: JSON.stringify({read: true})})
  .catch(err => console.log(err))
}
```
🎉 Exciting News! My CodePen Project Gets Picked! 🌟
Tags: webdev, codepen, css, ui
Published: 2023-07-28 17:41:12

Hey everyone! I am absolutely thrilled to share some amazing news with all of you! My latest CodePen project, where I created a **LOGO REVEAL CARD**, got picked by the CodePen team! 🎉🏆

Having my project picked by the CodePen team is truly an honor. I'm humbled to be featured among so many talented creators on the platform.

{% codepen https://codepen.io/Smit29/pen/WNYYRab %}
Dear Recruiters...
Tags: careerdevelopment, webdev, satire, humor
Published: 2023-07-28 17:37:21

Dear recruiters,

Thank you for letting me know about the exciting / fantastic / other overused expletive you use to describe your opportunity. I'm repeatedly thrilled to learn that you don't understand my resume, job experience or the industry you're recruiting for at all, and dodge inquiries to test your understanding of the job by asking me counter questions.

I am happy that you decide to reach out to me with a brief description to get me interested, but fail to tell me anything about the company or the work I'd supposedly be doing. No, really, please keep sending me spam about your exciting opportunities. I love the fact that you're a middleman when I could be better spend my time wowing a potential employer rather than jumping through your hoops. I feel great knowing you get a placement bonus if I am offered and accept a job, when secretly you regard me as mere meat for the grinder.

I'm delighted you have chosen to add my profile to your internal database of candidates without my consent, and that the security of your system is worse than the PERL code I wrote in my teens. No, it's fine, please keep a database of my prior addresses, financial information and phone numbers. 

Moreover, I'm still happy to work with you despite spending twenty years in this industry and not a single blasted time being placed by you or anyone of your ilk. Trying to get me to accept a lower salary than I am worth puts a smile on my face, and I would love it if you continued.

Oh, and if I say I'm not interested in an opportunity - however exciting - I would be more than happy to send you my Rolodex of developers I've worked with; I'm certain that they'll enjoy being headhunted, contacted out of the blue, and otherwise spammed regardless if they're happy with their current employment or not. 

From the bottom of my heart, thank you. You bottom-feeding parasites are a much cherished benefit to my industry, and I look forward to doing the same song and dance with you in the future. 

Charmingly Yours,

-Ryan

_Authors Note: This post is designed for humour only, and not intended to devalue technical recruiters, be inflammatory or cause deep discussions about recruiters in your province/state/country/city._
Cookies
Tags: webdev, programming, ruby, ai
Published: 2023-07-28 17:32:56

## Introduction

I was creating an AI chatbot running on GPT using Ruby. I wanted to user to be able to keep a history of their chat without losing the previous answer due to a rerender. This problem helped me understand cookies.

Cookies are a type of web storage that store strings with a key.

```ruby
require "sinatra/cookies"

cookies.store("key","value") 
```

When cookies are stored they are stored in the cookie hash. Every property in the hash has a key and a value. The value can only be a string.

What if we want to store a hash or an array?

```ruby
require "json"
require "sinatra/cookies"

employees = [{"first_name" => "Aldo", "last_name" => "Portillo", "occupation" => "Bartender"}]

cookies["employees"] = JSON.generate(employees)
```

We need to convert the hash/array to a string. Luckily the JSON Gem has a method for that.

We now have a cookie with key employees and a string value that used to be an array. What if we want to add another hash to the array?

```ruby
require "json"
require "sinatra/cookies"

#Get string from cookies and convert it to an array
employees = JSON.parse(cookies["employees"])

#Add a new employee
employees.push({"first_name" => "John", "last_name" => "Burn", "occupation" => "Server"})

#Modify cookie 
cookies["employees"] = JSON.generate(employees)
```

We extract the cookie from local storage, Parse the string to convert it to an array again, push the hash into the array and store the mutated array back in as a cookie by converting it to a string.

##### Quick note

I am declaring the hashes using rocket notation so the keys are strings; as opposed to, symbols. For some reason I don't understand, when the new hash was pushed the keys were symbols and after the next was pushed the previous hash's keys converted to strings. This caused an issue when trying to iterate over the array of hashes since the first n number of hashes' keys were strings and the last hashes' keys were always symbols.
Do you take notes?
Tags: beginners, studies
Published: 2023-07-28 17:22:29

Hello everyone! I'm having a lot of thoughts right now (I can't even write this text, I have wrote and delete stuff a several times), but I was wondering how does programmer students takes notes? Or do they even take any notes? I've been learning JS for some time now and I always change the way I take notes and review things that I learned. Do you ever take notes while you are learning how to code? And do you review it? I also have some trouble with reviewing things, I always have the thought that to learn things we should review the things we learned, but I don't really know how I can apply it in coding studies. 
Anyway, I'd love to hear some opinions (and even advice) on this topic.
From Scratch To Senior 2
Tags: beginners, programming, learning, career
Published: 2023-07-28 17:07:38

Hello, dear readers! 👋 Welcome back to my personal blog, where I share my journey and progress in the world of programming! 😁 In this post, I'll continue to update you on my path from a beginner programmer 👶 to a junior developer 👦, and hopefully, I'll be moving closer to becoming a middle-level developer 👨 with exciting job opportunities. Ultimately, I aim to reach the senior developer level 👴 in the future.

Goals Update:

Mastering Basic Syntax: I've made significant progress in understanding the basic syntax of popular programming languages. I feel confident in languages like C, C#, and C++, and I can now write simple code snippets without much trouble.

Advancing in C++: I've dedicated a lot of time to improve my knowledge in C++. I've learned about essential concepts like vectors and strings, which has allowed me to create more complex programs.

Learning New Libraries: As I continue to grow, I'm striving to explore new libraries. Recently, I've been focusing on the Standard Template Library (STL) in C++, and I've become familiar with containers like vectors. My next target is to delve into other useful containers like lists and deques.

Exploring Backend and Embedded Systems: My curiosity for backend and embedded systems has been sparked. While I'm not an expert yet, I'm eager to learn more about these subjects and explore their possibilities in my future projects.

Challenges and How I Overcame Them:

Throughout this journey, I faced several challenges that required me to seek guidance and support. When I encountered obstacles or couldn't understand certain programming concepts, I turned to ChatGPT for help. As a beginner, ChatGPT has been an invaluable tool in answering my questions, providing explanations, and guiding me in the right direction. It has helped me gain clarity on various topics and offered suggestions to improve my code when I got stuck.

As a result, I've become more confident in tackling programming challenges, and I've learned to break down complex problems into manageable pieces. My problem-solving skills have grown, and I'm no longer afraid to experiment and learn from my mistakes.

Current Level: **Intermediate Beginner**

**What are my goals:** 

- continue learn STL (deque, map)

- Learn technologies like HTTP and RESTful APIs. (Should I or it to early?)

**My knowledge now:**

- Basic of C,C#.

- Knowledge in C++ and some libraries like vector, string and list.

- Did a little different tasks on leetcode on easy level (c language)
-little bit Unity.

That's it for this blog post! Thank you for joining me on this exciting programming journey. I'm looking forward to sharing more progress and knowledge in the next blog! Until then, happy coding! 😊🚀

Wanted to ask couple of questions:
Should I use chatgpt for learning?

Should I use chatgpt helping me with coding or I should do all by my self?

What I should learn next? And recommend me some resources please.