teleren/devto huggingface dataset:
49 Days of Ruby: Day 9 - Arrays
Tags: ruby
Published: 2021-04-05 03:57:32

---
title: 49 Days of Ruby: Day 9 - Arrays
published: true
description: Join us on a 49 day learning journey through Ruby!
series: 49 Days of Ruby
tags: #ruby
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/9m73qaetuse3nm3y3it8.png
---

**Welcome to day 9 of the 49 Days of Ruby! 🎉**

Today is all about another important data type, the **array**! 

Arrays are one of the most common data types you will use from your Ruby toolkit. They serve all kinds of purposes and are a general use structure to hold information.

## What exactly is an Array?

An array is an ordered indexed collection of data.

That sounds nice, but how does it work? It is best to see with an example:

```ruby
coffees = ["espresso", "americano"]

coffees[0]

# => "espresso"

coffees[1]

# => "americano"
```

In the above example, we created a new array called `coffees` and put two types of coffee in it; espresso and americano 

In order to retrieve the coffee types we added into our array we need to access them by their **index** number: **The first item starts at index 0**.

Thus, to get our espresso, we do: `coffees[0]`. To access our americano, we do: `coffees[1]`. The item at index number 1 is the second item in the array.

## Experiment With Arrays

Now it's time for you to experiment with arrays!

In order to do so, we're going to learn about **iteration** and demonstrate one method to iterate with. Iteration is when you access each item in a collection and do something with it.

The `#each` method in Ruby is a popular and often used way to iterate over a data collection. This is how it works:

```ruby
coffees = ["espresso", "americano"]

coffees.each |coffee|
  puts "Today, I will have an #{coffee}"
end

# => "Today, I will have an espresso"
# => "Today, I will have an americano"
```

We learned previously about *string interpolation*, which is where you combine a string of text with a variable, and the data in the variable is used inside the string.

In this case, we are using string interpolation and iteration together to construct a new sentence for each value inside our `coffees` array.

Your task today is to open up IRB on your computer and experiment with arrays and the `#each` method. What can you do? What ideas from the previous lessons can you combine with these new skills? Share them on Twitter with hashtag #49daysofruby!

**Come back tomorrow for the next installment of 49 Days of Ruby! You can join the conversation on Twitter with the hashtag [#49daysofruby](https://twitter.com/hashtag/49daysofruby).**
Configure Authorization in OpenAPI(Swagger UI) for JWT in ASP.Net Core Web Api
Tags: csharp, aspnetcore, development
Published: 2021-04-05 03:37:24

OpenAPI Specifications are popular choices for REST Api documentation and Swagger UI is interactive API documentation in ASP.Net Webapi. 

Authorization needs to be configured for Swagger UI to bear Json Web Tokens(JWT) in the authorized APIs.

Here's how you can add security schema in the dependency container.
<code>
public void ConfigureServiceExtensions(IServiceCollection services, IConfiguration configuration)
        {
            services.AddSwaggerGen(c =>
            {
                c.SwaggerDoc("v1", new OpenApiInfo { Title = "MyProject", Version = "v1.0.0" });

                var securitySchema = new OpenApiSecurityScheme
                {
                    Description = "JWT Authorization header using the Bearer scheme. Example: \"Authorization: Bearer {token}\"",
                    Name = "Authorization",
                    In = ParameterLocation.Header,
                    Type = SecuritySchemeType.Http,
                    Scheme = "bearer",
                    Reference = new OpenApiReference
                    {
                        Type = ReferenceType.SecurityScheme,
                        Id = "Bearer"
                    }
                };

                c.AddSecurityDefinition("Bearer", securitySchema);

                var securityRequirement = new OpenApiSecurityRequirement
                {
                    { securitySchema, new[] { "Bearer" } }
                };

                c.AddSecurityRequirement(securityRequirement);

            });
        }
</code>
Serverless - Focus on code!
Tags: azure, serverless, functions
Published: 2021-04-05 03:34:36

I delivered a session on serverless for the TopCoder community!

In the session, I have covered - how to accelerate application development with serverless computing, develop apps efficiently, and solve complex orchestration problems. We will see how to build, debug locally, and operate at scale in the cloud and integrate services using triggers and bindings.

{% youtube -_sSL0H1ADQ %}
Python VS Ruby
Published: 2021-04-05 03:10:13

## The Language
**Ruby**
- Designed by Yukihiro Matsumoto in 1995

**Python**
- Created by Guido van Rossum in 1991

## The Usage
**Ruby**
- very human friendly
- More than one way to do the same thing
- Dynamic, reflective, object-oriented, general-purpose programming language
- Used widely for websites such as Hulu, Twitter, ZenDesk, Basecamp, Shopify, Urban Dictionary, GitHub

**Python**
- most understandable way to do something and that is how it should be done
- Used for websites such as Google, Yahoo Maps, Dropbox, Venmo, YouTube
Malicious Docker Cryptomining Images Rack Up 20M Downloads
Tags: docker, devops, security, cloud
Published: 2021-04-05 03:02:58

At least 30 malicious images in Docker Hub, with a collective 20 million downloads, have been used to spread cryptomining malware, according to an analysis.

Full story:

https://threatpost.com/malicious-docker-cryptomining-images/165120/
PLAYER GENERATOR SINATRA/ACTIVE RECORD PROJECT AT FLATIRON SCHOOL
Tags: codenewbie, sinatra, ruby, flatiron
Published: 2021-04-05 02:58:45

I have just finished creating my second fully functional personal project at flatiron school. This is a Sinatra web app that has CRUD (create, read, update, delete) functionality. My app allows a user to create an account, log in and create a football(real football lol) player with certain attributes. The user can also edit and delete their creations but not those of other users. However, all creations by all users are available for all to view.

This project was inspired by my love for the FIFA video game series by EA Sports, especially Ultimate Team mode, and I plan to continue to build it out in the future to include more features such as allowing users to make player cards and build squads.

The process of making this project was definitely rocky for me in all honesty. I believe this is due to the fact that I did not finish all the lessons before I started with the project. My first hurdle came when I had to implement the signup feature. Next came the problem of having to figure out how to get my nav bar icons to appear on every page of the web app. Thankfully I figured out this could be solved by placing the navbar inside my layout.rb file instead. There were even times where syntax errors kept me stagnant on one feature for hours and sometimes even days.

Overall this was definitely my most challenging test at Flatiron school so far but I absolutely loved every bit of it. Good old Google search along with my cohort mate and friend Luis Castillo and DJ Ritchey(our cohort lead) helped me a lot along the way and I am deeply grateful to them.

I am definitely looking forward to taking on the next phase (Ruby on Rails). Can't Wait!!! Till next time, Bye!!
Create image inside a text.
Tags: html, css, javascript, webdev
Published: 2021-04-05 02:55:42

---
title: Create image inside a text.
published: true
description: Random image on each reload using HTML,CSS , JS.
tags: HTML,CSS,javascript,WebDevelopment
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/a6jlyojv64z3glwpht06.png
---

A web page with background-clipped text created using CSS with random image functionality by vanilla JS.

Check out the video on https://youtu.be/6G-juiJIU8E

 {% youtube 6G-juiJIU8E %}

Follow me on GitHub to find some of my projects: https://github.com/salRoid

Please like, share, and subscribe to the channel will be dropping a lot of things ❤️❤️.
People Counter
Tags: flutter, dart, androidstudio, vscode
Published: 2021-04-05 01:52:17

Good morning, good afternoon or good night Dev

My first project in Flutter, i come with this article to start my series of Flutter, a course that I took a while and now I will dedicate myself to the weekends to do it. This simple project made it possible to learn many things about the Widget.


The widgets most used in this project were:
* Text
* FlatButton(is depreciated)
* Column, Row
* Image.assets
* Padding
* Stack(Widget overlay)
* Stateful, Stateless

The most important thing about this first app I found was knowing how to work with the difference between Stateful and Stateless, but as I already work with React Native I know the difference theory, but I didn't know how to work with Flutter.



Stateful => It is used to work with widgets the state in the application, and so we can see changes in the screen of certain components, as it has in this project, when we click on the +1 or -1 buttons it changes the state of how many people can enter the restaurant.



Stateless => Serves to work with widgets more visusias that do not change anything visually, as the name says, "stateless" what do you mean stateless.

link video: https://youtu.be/iJ0EbieiZOQ
Install VSCODE for beginners
Tags: vscode, programming, beginners
Published: 2021-04-05 01:36:15

# How to I stall VSCODE for beginners
###### If you thought to start to learn programming, Awesome decision!

#### In the video below , I explain how you can install and configure VSCODE.


#### I will also show a few themes, extensions, icons and also product icons..

###### I will be showing this on a windows computer


{% youtube v-opkVZAv1U %}

Do comment if you have any doubts or clarifications...
Free resources for AWS
Tags: aws, cloudformation, cloud, cloudskills
Published: 2021-04-05 01:35:41

Over the last 10 years of work I've created a lot of code, cloudformation templates and documents/diagrams that have helped customers on AWS.

Now I'm slowly open sourcing these to help anyone else become an AWS expert. 

Would love your feedback and any requests for any given CloudFormation, Script, AWS CLI commands or any other thing related to AWS.

Thanks for taking a look, the 2 documentation and cloudformation repos are available at: https://github.com/awsexp

I'll be dropping more files over the next few weeks so either star the repo or follow me here on @awsexpert 
Thanks!
Criando seu próprio tema com styled-components
Tags: javascript, css, braziliandevs, html
Published: 2021-04-05 01:18:28

# O que é tema
Tema são as cores, tamanhos de fontes, espaçamento entre elementos da aplicação e o que mais você quiser.

# Porquê perder tempo com isso, não posso só aplicar tudo isso pelo css?
Pode sim, o problema é que pode virar uma bola de neve. A cada componente novo você usa medidas diferentes para margins e paddings, cores mais claras ou escuras e tamanhos de fontes divergentes, fazendo com que a aplicação não tenha nenhum padrão de estilização.

# Quais os pontos positivos ao usar um tema?
* A aplicação seguirá um padrão de cores, tamanhos e medidas.
* Menos CSS redundante, mantendo um código mais limpo.
* Alterações como cores, tamanho de fontes e etc são triviais, já que toda aplicação busca informações do tema.

# Certo, então como crio um Tema?
Bom, vamos lá então. Nesse artigo estamos usando styled-components e irei supor que você está usando Typescript (por favor, esteja :D) para ter o type-checking do nosso tema.

## Criação do tema em si
Podemos criar um arquivo chamado `theme.ts` para definir nosso tema:
```
export const theme = {
  colors: {
    primary: '#000000',
    secondary: '#FFFFFF',
  }
}
```
No mesmo arquivo exportaremos também um `type` do nosso tema para ter o type-checking:
```
export type ITheme = typeof theme;
```

## Type-checking do tema para o styled-components
De acordo com a documentação do **styled-components**, devemos extender a interface de Tema original com o nosso type, para isso precisaremos de um arquivo `.d.ts`, no qual irá se chamar `styled.d.ts`
```
import 'styled-components';
import { ITheme } from './theme';

declare module 'styled-components' {
  export interface DefaultTheme extends ITheme {}
}
```

## ThemeProvider, a parte mais fácil!
Agora que já temos nosso tema criado e com typechecking, só precisamos fazer nossa aplicação inteira conhecer ele. o **styled-components** faz isso através do componente `<ThemeProvider />` utilizando **Context API** por debaixo dos panos.
No nosso **App.tsx**:

```
import { ThemeProvider} from 'styled-components';
import { theme } from '../theme.ts';

export default function App() {
 <ThemeProvider theme={theme}>
  ...resto da aplicação
 </ThemeProvider>
}
```

## Utilizando o tema
Com o nosso tema configurado, conseguimos usá-lo em qualquer componente styled-components, exemplo:
```
 import styled from 'styled-components';
 
export const Container = styled.main`
  background: ${({ theme }) => theme.colors.primary} // aqui vai ter typechecking!!
`;
```
Awesome CSS Tooltip | CSS Hover Effects | Using Only HTML & CSS | content : attr( data-tooltip )
Tags: codepen, showdev, html, css
Published: 2021-04-05 01:00:09

---
title: Awesome CSS Tooltip | CSS Hover Effects | Using Only HTML & CSS | content : attr( data-tooltip )
published: true
tags: codepen, ShowDEV, html, css
---



{% codepen https://codepen.io/ahmadbassamemran/pen/poRwEON %}


<hr/>
[Please Like, Share and Subscribe  my channel and click the bell icon to get new video updates:](https://www.youtube.com/AhmadEmran?sub_confirmation=1)
<hr/>


{% youtube hrJfzxgrbnU%}
App Platform: Handling GitLab submodules
Published: 2022-09-20 17:07:51

---
title: App Platform: Handling GitLab submodules
published: true
date: 2021-04-05 00:00:00 UTC
tags: 
canonical_url: https://jonfriesen.ca/articles/app-platform-handling-gitlab-submodules
---

Git submodules are a bit of a pain; that said we are iterating on this and trying to make it better in the future. I do have a workaround that will hopefully handle your needs:

> This assumes that your submodule is hosted in the same account/team as your app repository.

When an app is created from a GitLab project, we create and assign a deploy key to that project. Our build system uses that deploy key to check out the repository code as well as all submodule repositories. This means we need to enable that deploy key on the submodules repository.

Get the deploy key UUID from the app repository by going to the project, then

```
1. Settings
2. Repository
3. Deploy Keys
4. Copy the deploy key name (it’s a UUID)
5. then go to the submodule repository, and

```
 ![](https://jonfriesen.ca/_next/static/media/deploy-key.61764db5.png)
```
1. Settings
2. Repository
3. Deploy Keys
4. Privately accessible deploy keys
5. Search for the deploy key matching the UUID copied from the above
   step and click Enable.

```
 ![](https://jonfriesen.ca/_next/static/media/deploy-key-enable.070192a5.png)

You will also need to use the git ssh URL instead of the git https url in your .gitmodules file. So [git@gitlab.com](mailto:git@gitlab.com):owner/repo.git instead of [https://gitlab.com/owner/repo.git](https://gitlab.com/owner/repo.git).
Can pair programming replace code review?
Tags: codereview, practices, pairprogramming, productivity
Published: 2021-04-08 08:08:28

---
title: Can pair programming replace code review?
published: true
date: 2021-04-05 00:00:00 UTC
tags: codereview, practices, pairprogramming, productivity
canonical_url: https://jhall.io/archive/2021/04/05/can-pair-programming-replace-code-review/
---

It’s almost inevitable that when I participate in a conversation about pull requests and code review, someone suggests [pair programming](https://en.wikipedia.org/wiki/Pair_programming) as an alternative.

For those unfamiliar:

> Pair programming is an agile software development technique in which two programmers work together at one workstation. One, the driver, writes code while the other, the observer or navigator, reviews each line of code as it is typed in. The two programmers switch roles frequently.  
> — [Wikipedia](https://en.wikipedia.org/wiki/Pair_programming)

These days there are also many tools for [remote pair programming](https://en.wikipedia.org/wiki/Pair_programming#Remote_pair_programming), with a shared screen.

At first blush, this does indeed sound like it should solve the problem of code review during the course of writing code. And to some extent, I think it does. In fact, pair programming is far better than code review in addressing some of my [reasons for code review](https://jhall.io/posts/why-code-review/):

1. **Mentoring** Pair programming probably does this far better than after-the-fact code review. What better experience than to have a more experienced developer interacting with you _as you code_?
2. **Reduced bus factor** By pairing, you guarantee that two people are familiar with the code. This is also probably better done with pairing, than post-facto code review, since it’s impossible to do a superficial code review while pairing.

However, there are other areas where I think a post-facto code review is superior to pair programming:

1. **Higher quality code** No doubt, a certain number of WTFs will be found and prevented while pairing. But many code WTFs are the kinds of things that make sense at the moment, but are unclear out of context. Two brains _in context_ aren’t likely to catch these. You need a fresh perspective to catch these.
2. **Better communication** The communication that happens during pairing will naturally be improved by pairing. But written communication is also important—the kind that happens when discussing code in a pull request. And lest you think that if you eliminate PRs this skill is no longer necessary: developers write about their code all the time, and many are [terrible at it](https://stackoverflow.com/help/how-to-ask).

Perhaps on a sufficiently experienced team, where communication about code, and contextual WTFs are low, pair programming can completely replace post-facto code review. But for the majority of teams, I prefer to retain traditional code reviews, even when using pair programming.

* * *

Does your experience differ? I’d love to hear how pair programming has worked for you.
What does TailwindCSS 2.1 improve?
Tags: tailwindcss, css, frontend, programming
Published: 2021-04-05 21:31:10

---
title: What does TailwindCSS 2.1 improve?
published: true
date: 05/04/2021
tags: TailwindCSS,CSS,Frontend,Programming
canonical_url: https://www.elian.codes/blog/what-does-tailwindcss-2-1-improve/
---

# What does TailwindCSS 2.1 improve?

TailwindCSS 2.1 just got released. Read [the official blogpost about that here](https://blog.tailwindcss.com/tailwindcss-2-1). I'm excited for it since it brings the new Just-In-Time engine to the core, I wrote [a detailed blogpost about what it is and how to use it](https://www.elian.codes/blog/what-is-tailwindcss-jit-and-how-to-use-it) some time ago, which actually did very well.

## Tailwind JIT

The JIT engine got added to the core which means that you don't have to install a separate package and do some PostCSS changes. Initially the JIT engine had some issues with some CSS classes and properties, but most of them already got ironed out.

### Using JIT engine in TailwindCSS 2.1

Using the JIT engine in TailwindCSS 2.0.4 required to set the PostCSS config to include another package called `@tailwindcss/jit` as seen below:

```
// postcss.config.js

module.exports = {
  plugins: [
    require('@tailwindcss/jit'),
    require('autoprefixer'),
  ]
}

```

Where you now only need the following line `mode: 'jit'` in your `tailwind.config.js`

```
// tailwind.config.js

module.exports = {
  mode: 'jit',
  purge: {
    enabled: true,
    content: [
      //...
    ],
  },
  darkMode: 'class',
  theme: {
    //...
  },
}

```

You can even remove the `@tailwindcss/jit` package completely from your project.

### using it with the @nuxtjs/tailwindcss module

[The TailwindCSS module for NuxtJS](https://tailwindcss.nuxtjs.org/) supported JIT mode since v4.0.1, but now you don't even have to set the mode.

Previously we set it by adding this to our `nuxt.config.js` file:

```
// nuxt.confug.js

tailwindcss: {
  // other @nuxtjs/tailwindcss
  jit: true // or false
},

```

Now we don't have to include it here anymore, but instead add it as `mode: 'JIT'` in the `tailwind.config.js` file:

```
// tailwind.config.js

module.exports = {
  mode: 'jit',
  // other TailwindCSS options
}

```

## Support for CSS filters, blending modes & isolation utilities

This is a CSS feature I haven't quite used that much, but it's nice to see TailwindCSS become a very complete and sophisticated CSS framework.

To read more about those check out [the official TailwindCSS blogpost about v2.1](https://blog.tailwindcss.com/tailwindcss-2-1#new-filter-and-backdrop-filter-utilities)

## Upgrading from 2.0.4 to 2.1

Upgrading is nothing more then `yarn upgrade` or `yarn add tailwindcss@latest`
How to get the operating system's current user group id using Node.js?
Tags: node
Published: 2021-04-05 00:00:00

---
  title: How to get the operating system's current user group id using Node.js?
  published: true
  tags: Nodejs
  date: Mon Apr 05 2021 05:30:00 GMT+0530 (India Standard Time)
  canonical_url: https://melvingeorge.me/blog/get-operating-system-current-user-groupid-nodejs
  cover_image: https://melvingeorge.me/_next/static/images/main-84345494d68aa55313b4118f769fbf67.jpg
  ---
  [Originally posted here!](https://melvingeorge.me/blog/get-operating-system-current-user-groupid-nodejs)
  
To get the OS current user group id or (`gid`) in Node.js, you can use the `userInfo()` method from the `os` module and then use the `gid` property from the object returned.

```js
// require os module
const os = require("os");

// invoke userInfo() method
const userInfo = os.userInfo();

// get gid property
// from the userInfo object
const gid = userInfo.gid;

console.log(gid); // 20
```

See the above code live in [repl.it](https://replit.com/@melvin2016/get-the-current-user-group-id-using-nodejs).

That's all! 😃

### Feel free to share if you found this useful 😃.

---
Friendly Reminder: Failing A Coding Interview Doesn't Make You A Bad Developer
Tags: watercooler, discuss, career, productivity
Published: 2021-04-04 22:50:16

---
title: Friendly Reminder: Failing A Coding Interview Doesn't Make You A Bad Developer
published: true
description: Failing A Coding Interview Doesn't Make You A Bad Developer
tags: watercooler, discuss, career, productivity 
---
There is so much more to being a developer than just being able to solve data structure and algorithm problems. Keep your head up. You got this!
I drew a synthesizer with HTML & CSS
Tags: codepen, html, css, showdev
Published: 2021-04-04 22:42:26

I made a new drawing using only HTML & CSS. This time I chose to go for the Muson toy synthesizer. I've been wanting to draw it for a while now, so I'm glad I finally got to do it.

![Muson drawn in HTML & CSS](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vjdlai6h50v0dvnounf8.png)

Tutorials: <a href="https://fossheim.io" target="_blank">https://fossheim.io</a>

Patreon: <a href="https://patreon.com/fossheim" target="_blank">https://patreon.com/fossheim</a>

Buy Me A Coffee: <a href="https://buymeacoffee.com/fossheim" target="_blank">https://buymeacoffee.com/fossheim</a></p>

{% codepen https://codepen.io/fossheim/pen/BapZQjK %}

Other CSS drawings I've made:
{% codepen https://codepen.io/fossheim/pen/BaKQGZJ %}
{% codepen https://codepen.io/fossheim/pen/jObGxQQ %}
{% codepen https://codepen.io/fossheim/pen/xxboBzO %}

More on [CodePen](https://codepen.io/collection/nwzQJq?cursor=ZD0wJm89MCZwPTEmdj00) and [GitHub](https://github.com/sarahfossheim/art.css).