teleren/devto huggingface dataset:
The power of "Alone Together"
Tags: architecture, alonetogether
Published: 2022-10-01 17:25:21

---
title: The power of "Alone Together"
published: true
date: 2022-10-01 12:48:00 UTC
tags: softwareArchitecture, aloneTogether
canonical_url: http://roundcrisis.com/2022/10/01/the-power-of-alone-together/
---

In my previous post about [Bytesize Architecture sessions](http://www.roundcrisis.com/2021/09/28/bytesize-architecture-sessions/) I described briefly that one of the key aspects of the session is to have “Alone together” time where each of the participants of the session will have **a few minutes where they are working on the same task but not collaborating** , and they are in the same room (virtual or not).

![A team (of caricature animals) working for a few minutes on the designated task](http://roundcrisis.com/images/2022/2022-10-01-17-24-10.png)

The quiet time allows a break to engage on the task at hand and have some time to think (time to think during a meeting is sadly underrated ). Because of it, each participant learns to:

- Realise that sometimes they don’t have the full picture, and come up with more concrete areas for later investigation .
- For people new to the system, it builds confidence in the parts of the systems they have learned by revisiting what they know. New people generally bring great questions. The questions some might have anyway but are tired of, or afraid to ask.
- For some people with less confidence or experience, they generally realise how much they do know. It also has the effect of building on that experience since, this is a systems thinking exercise, with a very low failure risk.
- Finally, with some iterations, the group can see that they have more or less homogeneous knowledge, and don’t need to always lean on the same people

Meetings are generally not very effective, getting all of that in a few minutes is  _the power of Alone Together_
Um projeto Spring Boot - P3
Tags: tutorial, spring, java, iniciante
Published: 2022-10-01 12:44:17

Faala pessoal, tudo bom?

Dando continuidade às publicações sobre REST API's, nessa publicação falo sobre como criar um novo projeto Spring. _Simbora_?


## **Gerando um novo projeto** 
- Com o Spring Tools Suite 4 aberto, vá em File > New > Spring Starter Project e modifique os seguintes campos:

- **Nome** : _library-api_;

- **Type** : _Maven Project_;

- **Java Version** : _11_;

- **Group** : _com.projects.library_
esse é o identificador do projeto do Maven.

- **Artifact** : _library-api_
um projeto pode conter vários artefatos

- **Description** (esse é opcional) : o meu: _API de Biblioteca_

- **Package** : _com.projects.library_


**Adicionando dependências ao projeto**
- Clicando em **Next**, a próxima tela será para incluir as dependências do projeto. 
A versão do Spring Boot mantenho a 2.7.4.

- Adiciono, inicialmente, as dependências:
**a. Spring Web:**
É um inicializador, ele serve pra adicionar um conjunto de dependências que evitam do dev inserir dependências isoladas manualmente, podendo ocorrer conflitos. Resumindo, serve pra otimizar o tempo na configuração de um novo projeto.
**b. Spring Boot DevTools:**
é uma ferramenta que, por exemplo, toda vez em que ocorrem modificações no projeto, ele já reinicia o servidor da aplicação.


**Finalizando a criação**
11. Clica em Next > Finish.
Um fato interessante, o SSP gera o projeto na nuvem através do Base Url e os parâmetros de configuração estão no Full Url, então o processo é:

-> Selecionamos nossas configs 
-> O SSP manda pra nuvem essas configurações 
-> Na nuvem o projeto é gerado e baixado como .zip 
-> O Spring descompacta o .zip no workspace. 
-> Seu projeto localmente é concluido.


**OBS 1**
Uma segunda possibilidade é gerar o .zip no [site do initializr](https://start.spring.io/)


**OBS 2**
Caso o projeto apresente algum erro siga esses passos:
1. Clique com o botão direito sobre o projeto;
2. Selecione Maven > Update Project... ;
3. Selecione "Force Update of Snapshots/Releases";
4. Clique em OK e aguarde;

Seguindo esses passos é bem provável que o projeto já esteja configurado corretamente. 

Chegamos ao fim de mais uma publicação, você pode acompanhar os posts anteriores aqui:

- [Primeiro post](https://dev.to/devs-jequie/um-projeto-rest-api-2pc9)
- [Segundo post](https://dev.to/fllaviacorreia/configurando-o-ambiente-de-desenvolvimento-4a7h)

O link do projeto no GitHub você acessa [aqui](https://github.com/fllaviacorreia/library-api).

Até mais!
What I've been reading (week 39, 2022)
Tags: watercooler, news, discuss
Published: 2022-10-01 12:33:53

Each week I share a few things that I've been reading. Here's seven from this week:

* [Scaling Engineering Teams via RFCs: Writing Things Down](https://blog.pragmaticengineer.com/scaling-engineering-teams-via-writing-things-down-rfcs)

* [Brompton T-Line review – Trailblazing titanium folding bike is a big leap forward](https://www.cyclingnews.com/reviews/brompton-t-line-review)

* [TypeScript Tips by Matt Pocock](https://www.totaltypescript.com/tips)

* [Closing a 30 pixel gap between native and web](https://blogs.windows.com/msedgedev/2022/09/27/closing-pixel-gap-native-web-window-controls-overlay)

* [Postmortem Culture: Learning from Failure](https://sre.google/sre-book/postmortem-culture)

* [Announcing Turnstile, a user-friendly, privacy-preserving alternative to CAPTCHA](https://blog.cloudflare.com/turnstile-private-captcha-alternative)

* [Will Serving Real HTML Content Make A Website Faster? Let's Experiment!](https://blog.webpagetest.org/posts/will-html-content-make-site-faster)

---

I also [tweet these as I find them (@philw_)](https://twitter.com/philw_) and post them on my personal site at https://wolstenhol.me/#reading.

What were your favourites? Was there anything you found useful?

{% user philw_ %}
JS Errors in the Console, with a twist
Tags: javascript, beginners
Published: 2022-10-01 12:04:38

> Oh no! My site, it's broken!
> What ever shall I do? Better open the console to see what's wrong...

## It happens

Errors happen, so we have to handdle them. And since javascript has the console-object, most if not all js-developers use it. 
Yet having console errors littered around on your site is not great, (I could be wrong but) it might even influence your SEO score in search engines, so some delegating is in order.

## Better not flood the user's console

Flooding the console of a regular user with errors and exceptions is rather inefficient and unnecessary. They don't know how to open the developer tools, never mind navigate to the console.
The only thing website-users need to know is whether or not all interactive functions on the site work, that's it. And that can be done by showing just a _"Something has gone wrong"_ message in a nice and well designed pop-up.

## But a flood for them is a sip for me.

Yes, developers do use and need the console for first line debugging, users do not. 
So let's hide all messages from the console unless a developer visits the site. A dumbed-down developer-mode if you wish.

First, convert all loud errors into silent ones. Use the try-catch block to exit the function early when something goes wrong and show a simple error message to the user. That's better than crashing the whole thread, wouldn't you say?

Great! But now the developer can't assess any errors though. To remedy, let's create our own console function:

`const dev_log = ()=>{}`

This function is going to pass a message to the console if and only if a condition is met. Otherwise it will exit the function early with `return`.

`const dev_log = (_error) => {`
&emsp; `if(!*condition*) return;`
&emsp; `console.log(_error);`
`}`

But what condition? You could use any: login, ip-address, local host... Or whatever floats your boat.
I like checking the hash in the url, you know: `yoursite.com#hash`.
It's the easiest to set up and has no real implications for the website, since the hash is mostly used to highlight articles, or navigate one-pagers.
So let's do that. You can access that hash from the location-object.

`const dev_log = (_error) => {`
&emsp; `const is_debugging = location.hash == "dev";`
&emsp; `if(!is_debugging) return;`
&emsp; `console.log(_error);`
`}`

And that's it. Now the only thing left is to call this function every time we try and catch errors;

`try {`
&emsp; `foo();`
`}`
`catch(error){`
&emsp; `show_error_to_user();`
&emsp; `dev_log(error);`
`}`

Ofcourse you could expand the function to support multiple types of console functions like `console.error`, `console.group` or `console.time` even, make it fit your needs.

So now only visitors using `yoursite.com#dev` will be able to inspect any errors you logged to the console.
What do you think?
DAY 10: VALID NUMBER
Tags: codereview, java, programming
Published: 2022-10-01 11:52:44

Hey! is day 10 of 10 days coding challenge with I4G. Today's task was to check if a given string is a valid number.

**Thought process:**
**Understanding of the problem:** The task here is to validate that an input is a valid number. A valid number can be:

- A decimal number or an integer.
- (Optional) An 'e' or 'E', followed by an integer.

A decimal number can be split up into these components (in order):
- (Optional) A sign character (either '+' or '-').

- One of the following formats:
- One or more digits, followed by a dot '.'.
- One or more digits, followed by a dot '.', followed by one or more digits.
- A dot '.', followed by one or more digits.
- An integer can be split up into these components (in order):
- (Optional) A sign character (either '+' or '-').
- One or more digits.

**Solution: **To solve this I employed two java library: regex matcher and regex pattern. The regex matcher check if a given input matches a given pattern. It returns true if it matches and false if it does not.

**Algorithm:**
1. import regex matcher and regex pattern from java util library
2. Trim the given string to remove white spaces and store it in the original string
3. Check if string is empty, if so, return false.
4. Instantiate the pattern class and declare the required pattern
5. Instantiate the Matcher class and check if the string matches the given pattern.

checkout my code here: https://leetcode.com/problems/valid-number/submissions/812626535/
MINISCULE STEPS...
Published: 2022-10-01 11:49:03

Past two weeks were spent catching up with various techs in the Full-stack development. Time spent covering the fundamentals on HTML 5, CSS 3, JAVASCRIPT jQUERY, BOOTSTRAP, WORDPRESS & PHP. 

Next few days, the path will be leading into the following stops below: 

- MySQL 
- APIs 
- Mobile APPs
- Python 

Marching on...
Hacktoberfest 2022: Resources
Tags: hacktoberfest, opensource, beginners
Published: 2022-10-01 11:47:14

---
title: Hacktoberfest 2022: Resources
published: true
description: Compilation of some Hacktoberfest resources and new information for this year
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/p491djml7rysa2fdk7bq.png
series: Hacktoberfest Journey
tags: hacktoberfest, opensource, beginner
---
# Hacktoberfest 2022: Resources
Welcome to [Hacktoberfest](https://hacktoberfest.com/) 2022! Here's some stuff that's changed since last year and new information:

## Warnings
This year, if you make two or more pull requests that get marked as spam/invalid will be permanently disqualified (you will never be able to participate in Hacktoberfest ever again)

## Resources
It's a bit hard to get started so here's some nice resources to look at:
### Swags
[https://hacktoberfest-swag.com/](https://hacktoberfest-swag.com/) and [https://hacktoberfestswaglist.com/](https://hacktoberfestswaglist.com/) are good resources when it comes to finding some companies that provide swag. These are also hacktoberfest accepted repositories that you can contribute to on Github.
### Repositories
This is where I put in a self insert of a [list of valid repositories to contribute to](https://vivian-dai.github.io/Hacktoberfest-2022-Repos/)

Comment below if you know any other neat resources!
Hacktoberfest 2022!
Tags: hacktoberfest, digitalocean, beginners, github
Published: 2022-10-01 11:35:13

Hi hackers!
Today is the first day of the Hacktoberfest event taking place annual October
You only contribute your change through 4 Pull-Request to any repository on Github. Then you will have a chance to get a T-shirt when having 4 Pull-Request are accepted
Now, I have just published a [frontend-master repository](https://github.com/thuongtruong1009/frontend-master) that is fundamental for any wants to contribute to Open-Source code

Now, let's start!

[![Frontend-master repository](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/r0kx5a9jsa98nm6yp61f.png)](https://github.com/thuongtruong1009/frontend-master)

Happy coding!
Bug fix release 1.61 of perl-workflow and then some
Tags: opensource, release, perl
Published: 2022-10-01 11:09:15

---
title: Bug fix release 1.61 of perl-workflow and then some
published: true
description: Bug fix release of the Perl distribution Workflow
tags: opensource, release, perl
---
Today we released bug fix release 1.61.

We had discovered a minor bug, it has been patched and release 1.61 has been uploaded to PAUSE/CPAN - Thanks to Oliver Welter who discovered and patched the bug.

I can see that I forgot to post about two bug fix releases:

- 1.60
- 1.59

Since the [last release post was on 1.58](https://dev.to/jonasbn/release-158-of-perl-workflow-a-maintenance-release-3ed9). Both were both released prior to this, so I will mention them here.

I do not know how come I forgot to write up the announcements for the two bug fix releases, probably due to workload. 

Anyway, about workload - I should be celebrating and contributing to [Hactoberfest](https://hacktoberfest.com/), but instead I am doing maintenance, _but_ it is still open source, so I guess it does count _just a little_.

Here follows the change log of release 1.61, 1.60 and 1.59

## Change Log

## 1.61 2022-10-01 bug fix release, update recommended

- We have removed some code, which was no longer used, which was causing some grievance see PR [#203](https://github.com/jonasbn/perl-workflow/pull/203) from by Oliver Welter (@oliwell)

## 1.60 2022-03-02 bug fix release, update recommended

- We have discovered a minor regression, founded in our eager to implement more clean code. This has been addressed via PR [#195](https://github.com/jonasbn/perl-workflow/pull/195) by Erik Huelsmann (@ehuelsmann).

  It was followed up by PR [#196](https://github.com/jonasbn/perl-workflow/pull/196/files) by Oliver Welter (@oliwell).

  We are now setting the bar a bit lower for the 1.x releases in regard to best practices and code quality and focus on improving the code for 2.x, so we do not experience any more regressions.

## 1.59 2022-02-02 bug fix release, update required

- Unfortunately we discovered a minor mishap, where a dependency was referenced without being properly declared as a dependency, which could result in inability for the distribution to work in a clean environment. This has now been addressed via PR [#190](https://github.com/jonasbn/perl-workflow/pull/190)
Difference Between Compiled Languages and Interpreted Languages
Tags: programming, beginners
Published: 2022-10-01 10:31:05

## Difference between Compiled Languages and Interpreted  Languages

Any program is written using human readable code that the machine cannot understand , but for the program to be executed by the processor it has to be converted into a language that the machine can understand and this where interpreters and compilers come in.

Some languages are converted directly into the machine language and these are **compiled languages**  while others need a intermediate software   to convert them into  machine language and these are **interpreted languages**

#### Examples of compiled languages

1. C
2. C++ 
3. Go 
4. Rust

#### Examples of interpreted languages

1. PHP
2. Ruby
3. JavaScript
4. Python
Create React page with Dark mode using Material UI
Tags: react, javascript, webdev, node
Published: 2022-10-01 10:24:00

**Prerequisite**

- Material UI Install 
- React APP Installation 

## Let's Starts

First install the MUI material 
for npm 
`npm install @mui/material @emotion/react @emotion/styled`

or for yarn 

`yarn add @mui/material @emotion/react @emotion/styled`

In App.js 

- Import the file from mui/material 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wgy8bal15hw8b5598vjx.png)

- createTheme use to set the theme
- ThemeProvider use to set the theme 

- use Create theme 
`let theme = createTheme({
  palette: {
    mode: "dark",
  },
});`

then in the return function App() 
`<ThemeProvider theme={theme}>    
      <Table />
    </ThemeProvider> `

- Final, use CssBaseline from @mui/material

_Adding <CssBaseline /> inside of the <ThemeProvider> component will also enable dark mode for the app's background._

`<ThemeProvider theme={theme}>
        <CssBaseline />
        <main>Hello this is testing</main>
      </ThemeProvider>`

## All Sets, Let Run the App 

`npm start `
The difference between <b></b> and <span></span>
Published: 2022-10-01 10:23:30

The answer is simple...


`<b></b>`incorporates the **bold text** property while `<span></span> `

doesn't☺

or...

The `<b>` and `<span>` tags are both HTML tags used to format text on a web page, but they have different purposes.

The `<b>` tag is used to make text bold, which means that it will be displayed in a thicker font weight than the surrounding text. This tag is used to highlight important information, such as keywords in a sentence, or to make text stand out.

The `<span>` tag, on the other hand, is a generic container for inline elements. It is used to group elements together and apply styles to them. It doesn't have any default rendering and it's used mostly in conjunction with CSS selectors. It's used to format text in a specific way, for example, change the color, font, size, or add a background color. It can be used to change the appearance of text, but it doesn't change the font weight.

In summary, `<b>` tag is used to make text bold, while the `<span>` tag is used to group elements together and apply styles to them.
Explaining pass-by-value and pass-by-reference in C for 1st year IT student
Tags: computerscience, c, beginners, interview
Published: 2022-10-01 08:59:12

## TL;DR
When you **pass by value** what you’re doing is passing some data and the function then makes a **copy** of that data inside that function. This variable is scoped to the function block. Modifying this variable only affects the variable inside the function because it only exists as a copy inside the function. It’s scoped.

With **pass by reference** you are passing the address or the actual location of where your data lives. By doing this you can update the actual value of whatever data is at the memory address. You don’t have a copy of the object, you have the location of the actual object and therefore can directly modify it from inside the function.

_(This TL;DR is contributed by **@codebytesfl** - Thank you!)_

## Pass-by-value
When you declare a variable, it allocates a memory for that variable. When you call a function `foo(variable_name)`, it means you pass the value of that variable in the memory to a function. Whatever the function does, it doesn't affect to the memory of the variable. Value of the variable remains the same.

Example code:

```
#include <stdio.h>

void foo(int x);

int main() {
    int a = 1;
    
    foo(a);
    
    printf("a: %d", a); //a: 1
    
    return 0;
}

void foo(int x) {
    x = 5;
}
```

In the sample code above, when you call `foo(a)`:
- It actually call `foo(1)`
- In the `foo(int x)` function, it allocates a new memory for `x`, then sets `x` to `5`
- In the `main` function, `a` is still `1`

## Pass-by-reference
As mentioned, when you declare a variable, it allocates a memory for that variable. Memory has _memory address_. When you call a function `foo(variable_memory_address)`, it means you pass the _memory address_ to a function. If you change the value of the memory in the function, you actually update the value in the memory of the variable. That's why variable value will be changed.

Example code:

```
#include <stdio.h>

void foo(int* px);

int main() {
    int a = 1;
    
    foo(&a);
    
    printf("a: %d", a); //a: 5
    
    return 0;
}

void foo(int* px) {
    *px = 5;
}
```

In the sample code above, when you call `foo(&a)`:
- It actually call `foo(0xAB)` (assumed _memory address_ of variable `a` is _0xAB_)
- In the `foo(int* px)` function, it creates a pointer `px`, and `px` points to _0xAB_
- When you set `*px = 5`, it means it sets the value at memory _0xAB _to `5`
- Then in the main function, as value in the memory of variable `a` was changed to `5`, value of `a` now is `5`.
can I use jquery plugins not developed for svelte
Tags: svelte
Published: 2022-10-01 08:52:40

Hi, Like to know if I'm limited to using packages/plugins developed for Svelte, or if I can also install jquery plugins like [lozad.js](https://apoorv.pro/lozad.js/) or [magnify.js](https://thdoan.github.io/magnify/) in my Svelte projects. How do I know which ones I can use?
Thanks for any help
Callbacks In JavaScript
Tags: javascript, webdev, programming, beginners
Published: 2022-10-01 08:20:13

Before discussing callbacks, let's take a look at an example

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

_Output:_

```
secondFunction   
firstFunction    
```

In the above example we can see that the secondFunction is executed before the firstFunction even though firstFunction is called before the secondFunction.This happens because of asynchronous nature. Here secondFunction has a timeout of only 1000 milliseconds so it will be executed first and then firstFunction is executed with a timeout of 2000 milliseconds.
If we want to execute secondFunction only after the execution of the firstFunction then we have to use callbacks.

**Callbacks:** In JavaScript callbacks are nothing but the functions which are passed as an argument to another function, which is then invoked inside the outside function.

_Example:_


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

_Output:_

```
firstFunction
secondFunction
```

In the above example we can see that secondFunction is passed as a
callback to the firstFunction which is then invoked inside the firstFunction only after the execution of firstFunction. Now we can see that firstFunction is executed first eventhough it has 2000 milliseconds of timeout. 

**Benefits Of Callbacks:**

1. Can be used when you want to invoke certain function only after
   the execution of another function

2. Can be used when you are waiting for certain results to arrive. 
   For example, data coming from an API will take some time, so we 
   have to wait for the data to perform further operations.
What is the difference between <main> and <body> in HTML?
Published: 2022-10-01 08:14:22

The difference between <main> and <body> is in the content embedded in these elements. 

<main> captures the "main" elements unique to a particular document. It doesn't capture repetitive elements or contents such as the navigation bar, side bar, and the footer. 

<body> on the other hand can capture all content embedded in it. Including footers, navigation bars, copyright stamps etc.
Pure CSS Figma Logo
Tags: codepen, html, css, webdev
Published: 2022-10-01 08:13:03

---
title: Pure CSS Figma Logo
published: true
tags: codepen,html,css,webdev
---

{% codepen https://codepen.io/AsyrafHussin/pen/KKRRwRV %}

<p>Speed Code Video
<a href="https://twitter.com/asyrafhussin4/status/1576096834946113536" target="_blank">https://twitter.com/asyrafhussin4/status/1576096834946113536</a></p>