teleren/devto huggingface dataset:
The first steps in Github Pages
Tags: github, jekyll
Published: 2022-11-29 08:08:26

---
title: The first steps in Github Pages
published: true
date: 2022-10-14 00:00:00 UTC
tags: Github,Jekyll
canonical_url: https://robvanpamel.github.io/2022/10/14/CreatingGitHubPages.html
---

_“Are you serious, Rob, you don’t know how to create Github pages?”_

Yes, I never looked into to be honest. I know you can create them with regular HTML, CSS and some JS, but I want to work on something new, so I’ll start with Jekyll and markdown.

I want something that is easy to maintain, so I am able to proceed with it with not too much effort and overhead. Jekyll and markdown seems to be a good fit. <!--more--> But as I’ve never used github pages before so, it’s all new for me. As the purpose of the github pages is to serve as a blog, it’s a very good starting point. Allright lets dive into it.

## Specify a theme

The first thing you need to do is add a \_config.yml, which looks like this in my case. Which just specifies the theme and the installed plugins. As a menu is required, the Jekyll menus are added over here.

```
theme: minima
plugins:
- jekyll-menus

```

This gives already a clean look to your page, although it isn’t fancy yet. But that is something that wil be fixed later, content over presentation, right? For those who know me, I’m not that frontend guy which works on that slick webpage. I’m the one sitting quietly in the back trying to figure out why we experience a too high latency :smirk: .

Okay, next step is adding the blogs itself, which is actually pretty easy.

## Adding blog posts

A blog post can be added very easily by adding a new markdown page in a folder called `_posts`. The only convention you need to be aware of is the name of your file. This requires the format of `<YYYY-MM-DD-TitleOfYourBlogPost>`. In this example, it is `2022-10-15-CreatingGitHubPages`, so that aint’t too hard, is it?

At the top of your blogpost, you can add more metadata, for example title and date, which can be used by some plugins. See below for the example.

```
---
title: "The first steps in Github Pages"
date: 2022-10-14
---

```

## About page

Every blog needs an `about` page, so this one as well. This can be done, by adding a new markdown page where you specify all the contents. If you want to be page to be accessable, you need to tell Jekyll in which menu you want it to appear. That can be done, by adding some metadata at the top of your page again. See the example below.

```
---
title: About
menus: header
---

I am a .NET consultant with a focus on architecture and cloud. I ....

```

That’s it for now, and I’ll explore some more about it, and will tell you more in an upcoming post! To be continued…
Create-React-App Issues
Tags: react
Published: 2022-10-13 23:51:38

I believe I really messed myself up. 
Using npm installing and deinstalling react features I believe I entered npm rm * and it remove a few things that now when I run npx create-react-app my-app. I get the following error.
Error: Cannot find module '...\node_modules\create-react-app\index.js'       
    at Function.Module._resolveFilename (node:internal/modules/cjs/loader:985:15)       
    at Function.Module._load (node:internal/modules/cjs/loader:833:27)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:81:12)
    at node:internal/main/run_main_module:22:47 {
  code: 'MODULE_NOT_FOUND',
  requireStack: [].

I have tried uninstalling Node.js, npm reinstall, npm i react-modules. Still get the same error, I think I just need the files to place in the correct location to correct it, but not sure. any direction would be appreciated.
[Desafio] - Gambiarra: API Pública Sem Segurança
Published: 2022-10-13 23:26:05

> Conteúdo original em https://twitter.com/zanfranceschi/status/1580700049817804801

---

Ei dev,

Às vezes a gambiarra não é culpa sua, é de quem demanda a feature/evolução das aplicações.

Pega esse desafio aqui que vai doer no seu coração. Além de você ficar mais gambiarra proof, você vai exercitar seu cárdio.

cc @sseraphini

↓

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

---

Imagina que você cuida duma API acessível via internet. Essa API usa um esquema de autorização via access token (JWT). Bem trivial.

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

---

Aí, o seu diretor, que era de marketing e é metido a digital transformation facilitator e que só vai até a página dois de engenharia de software, vem com a seguinte demanda:

"A nossa API tem que TAMBÉM aceitar requisições sem aquelas coisa de access token..."

---

Ele continua...

"Ah, e esses clientes especiais vão passar uma identificação num header lá... aí vc autentica e valida esse header."

...e sai de férias pra Punta Cana.

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

---

Você sabe que o cara é irredutível e não vai mudar de opinião sobre os riscos de segurança e lixo que está propondo.

O que você faz? Quais medidas você tomaria pra implementar isso pra que haja pelo menos uma diminuição dos riscos de segurança e sua API não se degrade tanto.

---

Vale usar recursos de infra, código, etc. – o que você quiser. O importante é pensar na gambiarra que vai ter que fazer pra satisfazer a demanda do Zé Ruela!

Conta aí pra gente sua solução! 🤭
Null safety explained.
Tags: flutter, dart, nullsafety, framew
Published: 2022-10-13 22:54:20

The Dart language has recently been on the rise due to the exploding popularity of its child framework- flutter. The language has a unique feature called null safety and I bet you must have heard about it if you ever tried to learn dart. As a javascript developer, I was fascinated by the feature and kinda felt guilty of suffering painful runtime errors when building the code for production. The null safety was introduced to Dart in its 2.0 version. I strongly believe that necessity is the mother of invention, before the introduction of the null safety in Dart, flutter developers had to write a lot of if statements checking if variables had a null value or not. A lot of apps crashed due to variables having unexpected null values. It was really a nightmare and the dart lang maintainers had to come up with a solution and boom THE NULL SAFETY. Null safety simply applies one principle: variables cannot be null at the time of initialization by default unless you explicitly assign them to be nullable. Developers love clarity and thrive in strict environments. Every developer would rather suffer on the code editor than on the build/deployment terminal. You may need a variable to be null, for example, when building an App that fetches data from a backend API asynchronously, you will need the variable to initially be null as it awaits its promise to resolve. The null safety allows the variable to be nullable that is, its value be null until its reassigned or compiled just as null if at all it makes sense in your use case. Null safety reduces a lot of runtime errors and saves us from debugging hell.
```
//variables are assigned as nullable by putting a question mark after the type annotation

String? name; //nullable
String name; //error , non-nullable variables cannot be null
```
Sometimes, you may need to have a variable assigned its value later in the program execution flow rather than at the time of initialization. Dart has a solution for that too. The late keyword is used to indicate that the variable is non-nullable and declared without a value with the hope of having its value assigned later in the program. Here is an example;

```
//non-nullable but initialized without a value

late String name;
print(name);  // error -  the late variable is unassigned at this point

//assign a value 
name = 'Jay';
print(name); // jay
```
I'm available for a free mentorship!
Tags: mentorship, career, beginners
Published: 2022-10-13 22:29:13

Hi! I'm Tomasz Cichociński 👋

I have over 7 years of professional software engineering experience.

I want to share my knowledge to **empower juniors to become remarkable seniors**! I'm offering a **free mentorship**, no hidden costs, it's my voluntary work!

Do you feel you need help with your career? Or maybe you're stuck with some technical challenges?

Learn more at: [cichocinski.dev/mentorship](https://cichocinski.dev/mentorship)
How to create an Express JS middleware
Tags: javascript, node, express, tutorial
Published: 2022-10-13 22:25:36

**Hey there!** Today I'm going to show you how to create a express js middleware

Setup > read more on [Creating an express server](https://dev.to/sonicx180/create-an-express-server-5267)


Okay, now that we have our server, we can add the middleware.
After the constant variable `const app = express()` and before the ```app.get('/', (req,res) => {
 res.send("Hello World!")
}``` , add this line of code.

```
app.use((req,res,next) => {
console.log(req.method + " " + req.ip);
next();
})
```
And that my friends, is a basic middleware function.
Let me break it down for you. 

`app.use()` is an express function for middleware.
Then we create an ES6 arrow function.
We log the method (like the HTTP verbs `GET, POST`) the user is using into the console and their ip.
The last line of code is the `next` function. If you don't put that, express will not move on to the next middleware.


## A trick you can do with middleware

**Use middlware on a certain route **
`app.use('/route',middleware);`

Or even ```app.get("/route",middleware, (req,res) => {
res.send("I used Middlware!")
}```

And that's about it. Read more on middleware at [Express Js using Middlware](https://expressjs.com/en/guide/using-middleware.html).
Thanks to freecodecamp for example middleware!

Like and Follow if you haven't!
Adding support for the `--config` option in an SSG
Tags: git, opensource, beginners, ssg
Published: 2022-10-13 22:20:21


This week I got the opportunity to contribute to [Ririio](https://github.com/Ririio)'s SSG named [ririio-ssg](https://github.com/Ririio/ririio-ssg).

## Overview
`ririo-ssg` is similar to other Static Site Generators I have worked with in the past few weeks, given that it is programmed in Javascript with similar requirements. `ririo-ssg` is a great CLI tool that can convert `.txt` and `.md` files into a static site. However, the tool could not work with config files in `.json` format to override the tool's default behaviour. 

## Filing an Issue
As usual, I started by filing an [issue](https://github.com/Ririio/ririio-ssg/issues/14) `ririo-ssg` Github repo. The owner was quick to respond by assigning the issue to me. After the assignment, I started working on the implementation I had in mind that would enable the SSG to process `JSON` config file. 

## Writing the Code
Writing the code was not as difficult as I initially thought. I started by creating a new git `branch` to write my code. Also, I set up a `git remote` named `upstream` to stay in sync with the original repository. 
`ririo-ssg` utilizes the `commander` module to process `commands`, which is simple. I just had to update the `options` so the CLI can work with the `--config` and `-C` options with argument. Parsing the `JSON` object in the `config` file was even easier, given that Javascript has a built-in `JSON.parse` function to do the job. 

### Creating the PR
I created the [PR](https://github.com/Ririio/ririio-ssg/pull/15) with the initial implementation for the `-C` option. I received feedback from the _owner_ and reflected the changes in subsequent commits. 

### Challenges Encountered
- I have a habit of writing modular code spanning into multiple files. Initially, I created a new file that would be read as the `JSON` config file. However, I ran into some issues with some of the functions by doing that. I consulted with _the code owner_ and worked with his recommended approach instead. 
- The central issue was reading and writing to the `.env` file. This was a problem because the SSG utilized functions such as `readFile` and `writeFile` from the `fs` module. Consequently, some values in the `.env` file are not overwritten unless the tool is run with the `-C` or `-config` option multiple times. I was able to fix this problem by replacing `readFile` function with `readFileSync` and `writeFile` with `writeFileSync`. Replacing the code with synchronous functions ensured the program execution was halted until all the changes were properly reflected in the `.env` file.

## Outcome
Users can now pass a `config` file containing a valid `JSON` object when using either the `-C` or `--config` options. 
An example of a valid `JSON` object accepted by this tool is:
```
{
  "input" : "./text-files",
  "output" : "output-folder",
  "lang" : "uk",
}
```
Invalid and unsupported `key-value` pairs will be ignored.
Building a free component library for react developers.
Tags: javascript, webdev, react, productivity
Published: 2022-10-13 22:06:55

You can copy Html and React code and integrate them onto your site, new components every week, and updates on twitter 

![stats component from copyui.com](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/cg5z32drv88d8vi0c2ik.png)

<blockquote class="twitter-tweet"><p lang="en" dir="ltr">Just added a dashboard component to <a href="https://t.co/YPbU8meb4D">https://t.co/YPbU8meb4D</a> 🔥👀 <a href="https://t.co/fPb3JYsrtB">pic.twitter.com/fPb3JYsrtB</a></p>&mdash; Alohe (@alemalohe) <a href="https://twitter.com/alemalohe/status/1580661456260825088?ref_src=twsrc%5Etfw">October 13, 2022</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>


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

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

![copyui.com](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9gb6zcvskx28xix8nqe6.png)

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

Any special request for a specific component? Follow and DM me on [twitter @alemalohe](https://twitter.com/alemalohe) and I'll see if your requests can fit on the site.

Also any feedback on the site (copyui.com) or any of the component codes on there, is appreciated 😊
Where Did All The Focus Time Go? Dissecting 1.5 Million Meetings
Tags: management, productivity, podcast, devops
Published: 2022-10-13 22:03:30

Where has all the focus time gone? Why does there seem to be less of it at big companies than at startups? And do managers really have as little as they claim?

It should come as no surprise to our listeners that we're big fans of data here at Dev Interrupted. The coolest thing about having Dan Kador, VP of Engineering at Clockwise, on the show is that he brings data we already intuitively understood but could not quantify.

Armed with data from 1.5 million meetings, 80,000 engineers and over 5,000 companies, this episode answers every question your engineering team has wondered about meetings - and might just reaffirm every suspicion you've had too.

{% spotify spotify:episode:1lB96lnloAQHlqQijPrn1E %}

## Episode Highlights Include:
* (2:58) Dan's career journey
* (6:24) What is [The 2022 Software Engineering Meeting Benchmark Report](https://www.getclockwise.com/eng-meeting-benchmarks)?
* (8:43) How the data was collected
* (13:50) Is there a Clockwise secret sauce?
* (20:46) The time it takes to enter a flow state
* (25:17) The "Coordination Tax"
* (35:21) How to improve your engineering team based on the data

***While you’re here, check out this video from our [YouTube channel](https://www.youtube.com/c/DevInterrupted?sub_confirmation=1), and be sure to like and [subscribe](https://www.youtube.com/c/DevInterrupted?sub_confirmation=1) when you do!*** 

{% youtube k4aFyFQKi-s %}

## [You’re invited to Interact on October 25th!](https://devinterrupted.com/event/interact/?utm_source=dev.to&utm_medium=referral&utm_campaign=202210%20-%20Event%20-%20Interact%20-%20Referral%20-%20Distro%20-%20Podcast%20Blog)

*Want to know how engineers at Slack and Stripe connect their dev teams’ work to the business bottom line? Or how team leads at Shopify and CircleCI keep elite cycle time while minimizing dev burnout and maximizing retention?*

*These are just two of the topics we’ll tackle at [Interact](https://devinterrupted.com/event/interact/?utm_source=dev.to&utm_medium=referral&utm_campaign=202210%20-%20Event%20-%20Interact%20-%20Referral%20-%20Distro%20-%20Podcast%20Blog) on October 25th.* 

*A* ***free, virtual, community-driven engineering leadership conference,*** *[Interact](https://devinterrupted.com/event/interact/?utm_source=dev.to&utm_medium=referral&utm_campaign=202210%20-%20Event%20-%20Interact%20-%20Referral%20-%20Distro%20-%20Podcast%20Blog) is a one-day event featuring over 25 of the most respected minds in development, all selected by the thousands of engineering leaders in the Dev Interrupted community.* 

## [Register now!](https://devinterrupted.com/event/interact/?utm_source=dev.to&utm_medium=referral&utm_campaign=202210%20-%20Event%20-%20Interact%20-%20Referral%20-%20Distro%20-%20Podcast%20Blog)


![Register now!](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/p9xpvwbw5xfawom98qga.jpg)
Guía rápida para usar Markdown
Tags: markdown, spanish, guia
Published: 2022-10-13 21:36:31

Markdown es sencillo de aplicar para dar formato a nuestro texto. Muy útil en la creación de archivos README.md en github. 
Aquí tienen una guía básica con ejemplos, más unos enlaces interesantes para profundizar en este lenguaje de marcado. 
 
## Líneas separadoras
---
___

```md
---
___
```
## Citas

> "Esta es una cita." 
```md
> "Esta es una cita."
```
## Encabezados

# h1
## h2
### h3
#### h4
##### h5
###### h6
```md
# h1
## h2
### h3
#### h4
##### h5
###### h6
```
## Imágenes 
![Logo Markdown](https://upload.wikimedia.org/wikipedia/commons/thumb/d/db/Markdown-mark-half.svg/320px-Markdown-mark-half.svg.png)
```md
![Logo Markdown](url de la imagen)
```
## Itálica
*Itálica 1* Itálica 2_
```md
*Itálica 1* _Itálica 2_
```
## Negrita
**negrita 1** __negrita 2__
```md
**negrita 1** __negrita 2__
```
## Tachado
~~tachado~~
```md
~~tachado~~
```
## Listas
### Ordenadas
1. uno
 1. sub uno
 2. sub dos
2. dos
3. tres
```md
1. uno
 1. sub uno
 2. sub dos
2. dos
3. tres
```
### desordenadas
- uno
- dos
- tres
```md
- uno
- dos
- tres
```
## Código
Para mostrar bloques de código, lo encerramos dentro de 3 backticks de apertura y cierre. Adicionalmente, si en los primeros tres backticks ponemos el nombre del código del bloque, nos resaltará la sintaxis que este tiene. 
```json
   {"nombre": "pepe"}
```
## Enlaces
[google](www.google.com "la pagina de google")
```md
[google](www.google.com "la pagina de google")
```
## Email
<linomattos7@gmail.com>
```md
<linomattos7@gmail.com>
```
## Tablas
| uno |  dos  | tres  |
| --- |  ---  |  ---  |
|  1  |   2   |   3   |
```md
| uno |  dos  | tres  |
| --- |  ---  |  ---  |
|  1  |   2   |   3   |
```

## Enlaces interesantes:
#### Lenguajes soportados para el resaltado de sintaxis. 
https://www.rubycoloredglasses.com/2013/04/languages-supported-by-github-flavored-markdown/
#### Sintaxis básica de Markdown.
https://www.markdownguide.org/basic-syntax
#### Sintaxis extendida de Markdown
https://www.markdownguide.org/extended-syntax/
Como criar uma aplicação completa usando NodeJs em apenas 5 meses
Published: 2022-10-13 20:49:51

Um louco sem resultados é chamado de louco. Um louco com resultados é chamado de gênio.

E é com essa frase clichê do Steve Jobs que eu te faço uma pergunta, você alguma vez pensou em fazer um software que impacte de VERDADE a vida das pessoas? Algo que te traga não só retorno financeiro, mas orgulho em ver as pessoas usufruindo desse sistema.

Qual o sentido de estudar tanto tempo algo extremamente complexo como programação pra ganhar pouco e obedecer ordens? Vale a pena servir aos interesses de corporações que tratam programadores como meros digitadores de código que traduzem regras de negócio em forma de sistema?

Porque nós lutamos tanto pra servir os interesses de gestores que vomitam prazos esdrúxulos nos forçando a trabalhar fora do horário?

Porque não usamos as nossas habilidades pra construir algo importante? Algo que sirva as pessoas e nos sustente a longo prazo?

Essa é uma pergunta que eu me fiz durante anos, e ao longo do tempo descobri que através do compartilhamento e criação de conteúdo eu sou capaz de mudar a vida de pessoas que trilham o caminho árduo da programação.

É através desse inconformismo que eu gravei cada aula, organizei cada commit e desenvolvi cada linha dos meus projetos.

Pois através do conhecimento podemos mudar a realidade em que vivemos, e só a experiencia é capaz de nos ensinar o que é melhor pra nós e pra nossa carreira.

Podemos fazer muitas coisas e todas elas sairem uma porcaria. Podemos fazer menos coisas e elas sairem razoavelmente bem… ou podemos ter poucas coisas, focar nelas e elas sairem com excelência.

E é exatamente por isso que eu criei o bootcamp CrazyStack, com videos que vão direto ao ponto e que te levam a outra dimensão de maneira leve e descontraída. Abordando Node js, Mongo DB e Fastify do jeito que tem que ser. Sem criar alto acoplamento com libs, orms ou frameworks.

Esse bootcamp mudou minha vida como programador e criador de conteúdo, e vai mudar a vida de muitas pessoas que desejam elevar a sua senioridade sendo arquitetos das próprias soluções. Foram 3 anos criando e refatorando o projeto ensinado, + de 2mil testes cobrindo 90% do código.

Num projeto de agendamento online, serão criados casos de uso envolvendo regras de negócio complexas como listagem de horários disponíveis de acordo vários horários de funcionamento, geração de pedidos a partir de agendamentos efetivados, avaliações dos clientes e muito mais.

Viaje nessa loucura!!
[CLIQUE AQUI](https://hotmart.com/pt-br/marketplace/produtos/aprenda-nodejs-e-react-native-do-zero-ao-infinito/P34477060O)


[LINK DO REPOSITÓRIO](https://github.com/gumiranda/CrazyStackNodeJs)
How to register a S3 repository used to store Elasticsearch Snapshots.
Tags: devops, aws, boto, python
Published: 2022-10-13 20:46:32

Hello, I would like to share with a small python function I have designed to register a AWS S3 bucket as a snapshot repository for AWS Opensearch.

```
import boto3
import requests
from requests_aws4auth import AWS4Auth

region = 'eu-central-1'
service = 'es'
role_arn = "arn:aws:iam::<accountid>:role/EsSnapshotRole"
host = '<elasticsearch Endpoint>' 
path = '/_snapshot/moo-es-snapshots'
url = host + path

credentials = boto3.Session(profile_name="moo-stag-es").get_credentials()

awsauth = AWS4Auth(credentials.access_key, credentials.secret_key, region, service, session_token=credentials.token)

#Register repository

payload = {
  "type": "s3",
  "settings": {
    "bucket": "<bucket-name>",
    "region": region,
    "role_arn": ""
  }
}

headers = {"Content-Type": "application/json"}
try:
   r = requests.put(url, auth=awsauth, json=payload,        headers=headers)

   print(r.status_code)
   print(r.text)

except Exception as e:
        print(e) 
```

I hope you like the tutorial, if you do give a thumps up! and follow me in [Twitter](https://twitter.com/TVelmachos), also you can subscribe to my [Newsletter](https://dashboard.mailerlite.com/forms/167581/67759331736553243/share) in order to avoid missing any of the upcoming tutorials.

#### Media Attribution
I would like to thank [Clark Tibbs](https://unsplash.com/@clarktibbs) for designing the awesome [photo
AWS Community Builders partnership with Techne Summit Alexandria 2022
Tags: aws, technesummit
Published: 2022-10-13 20:16:08


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

[AWS Community Builders](https://aws.amazon.com/developer/community/community-builders/) are proud to announce our partnership with Techne Summit Alexandria 2022. Techne Summit is coming to you on Nov. 5 - 8. There will be lots of exciting things planned for you with a lot of Content planned, over several Industry-Focused Tracks! Hurry up and book your ticket now. 
[https://alex.technesummit.com/2022#tickets](https://alex.technesummit.com/2022#tickets)