teleren/devto huggingface dataset:
CSSBattle | #15 Overlap
Tags: css, cssbattle, challenge, overlap
Published: 2022-03-15 01:35:59

Welcome to CSSBattle Challenges!

In this short article, I go through my solution for [CSSBattle - #15 Overlap](https://cssbattle.dev/play/15) challenge. Please refer to the code snippet below to get a better insight into my thought processes and the implementation detail.

---

> #### Challenge:

![Overlap Challenge](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0lubcyqs08n8p1c6wsds.png)

---

> #### Solution:

```html
<div class="container">
  <div class="circle left"></div>
  <div class="circle right">
    <div class="hidden-circle"></div>
  </div>
</div>

<style>
  * {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
  }
  .container {
    width: 100%;
    height: 100%;
    background: #09042A;
    position: relative;
  }
  .circle {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 150px;
    height: 150px;
    border-radius: 50%;
  }
  .left {
    background: #7B3F61;
    transform: translate(calc(-50% + -50px), -50%)
  }
  .right {
    background: #E78481;
    transform: translate(calc(-50% + 50px), -50%);
	overflow: hidden;
  }
  .hidden-circle {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    background: #09042A;
    transform: translateX(-100px);
  }
</style>
```

---

> #### Key Takeaway(s):
- use overflow hidden to adjust shape of parent element

As always, I welcome any feedback or questions regarding the implementation detail of the challenge. Otherwise, I hope this was useful!
How to Vercel
Tags: vercel
Published: 2022-03-15 01:32:49

## First things first, what is Vercel?
Vercel is a platform that allows users to streamline the website deployment process. Unlike github, it's so easy to use that my hungover post spring break butt could figure out how to use it. 

## Getting Started

1. before getting started with Vercel, you must create an account on the website, feel free to link an existing github account for ease of access.

2. Next, you will want to fork and clone [This repository](https://github.com/btopro/ist-vercel-demo) into your local machine.

3. Then you will open up the code through VScode, add a `.env` file that contains [these lines](https://gist.github.com/btopro/96bfbd6a5673b98d03d9f64b8f5c5c60) and push it all back to your github repo.

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

## Working within Vercel

4. From this point forwards, we will be working within Vercel to add our github repos. Within the main page, add your repos by clicking the plus button and you will be prompted to make changes.
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/75tdeua9tcha1z2pxbj2.png)

5. Change the location of the output directory to `dist` in order to ensure that it goes through.
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rwbgp1psv8jii9fol81y.png)

6. congratulations, if you managed to follow these steps you should now have a static webpage uploaded to Vercel. 

https://vercel.com/kfo5087/ist-vercel-demo

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

## My 11ty Websites

1. Hello-world
https://vercel.com/kfo5087/11ty-hello

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

2. 11ty-Template
https://vercel.com/kfo5087/11ty-template

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

3. Haxllty
https://vercel.com/kfo5087/haxerman11ty

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

Shout out to Michael Potter for showing us Vercel and overall this tool is much easier to use in comparison to Github Pages.
Repost: Flatiron School Phase 1 CLI Project
Tags: cli, beginners
Published: 2022-03-15 01:05:21

(This was posted on the Learn.co blogging platform for my Phase 1 Flatiron School project; it is being cross-posted here due to the transition to Canvas and the removal of the Learn.co blogging function).

I have just completed my CLI Project! I had a little bit of a hard time getting started, mostly due to the decision between scraping and using an API. I had never used an API and felt unfamiliar with them. I had attended a few study group sessions and learned a little bit more about the pros and cons of scraping vs. using an API, and ultimately opted to use an API in my project. It was also a little bit new for me writing code without tests to pass, but it was a great learning experience.

Once I found a list of public APIs, the idea of building an app around drink recipes became very appealing, so this is what I ultimately chose. With the limited availability of bars and restaurants during 2020 and into 2021, I have been trying to experiment with at-home cocktail recipes. I figured I would actually potentially use this app in my real life outside of Flatiron School, so that became a bonus perk of this project.

Originally I had planned to only make this project about margarita recipes, but I was pushed by Dustin during study group to expand this to any drink recipe. I therefore was able to modify the code so the API would take any drink recipe input and, if valid, output a recipe with instructions for the user. This was a pretty cool unexpected feature I wasn’t planning on originally having, but made the project more fun and ultimately more useful.

Once I got the API class working, I moved on to displaying the objects. Once this worked, I also added the feature of asking for a new input if the user put in a drink that the API did not have a recipe for.

This project definitely taught me a lot about Object Oriented Ruby and I am happy to have synthesized my skills into this project. I was able to connect with peers I hadn’t met before and work with others and learned a lot at the CLI study group sessions. Now that I’ve completed the first project I feel more confident in my abilities to tackle the next ones and am more aware of the resources available to me.
Getting Started with Vercel
Published: 2022-03-15 00:53:16

## **About Vercel**

Vercel is a high-performance front-end framework and static website platform.  Vercel is great for front-end teams because 1. It is easy to use and 2. It generates an efficient way of creating static sites.  Pertaining to the Developer Experience (DX), Vercel provides clarity, an ease of use, stability, and function.  

## **Creating a Project and Deploying with Vercel**

First, create a personal account on Vercel and link it to your GitHub account.  You can also create your personal account with your email, GitLab, or Bitbucket.

Second, from the Dashboard, select New Project and you have the option to import from an existing Git repository or use one of Vercel's many templates.  In the Build & Development settings, I recommend changing the root directory to dist or _site. 


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4vg9rqsqzqgtu0qrdv6s.PNG)

Third, through a build step, you will deploy your project to transform it into a production-ready site.  Once your project has been successfully deployed, it will be saved to your dashboard. 

## **Vercel Command Line Interface Commands**
Make a preview deployment:
$ vercel
Make a production deployment:
$ vercel --prod

## **My Vercel Deployments**
[my vercel-demo on GitHub](https://github.com/maw6a0/vercel-lab8)
[my vercel dashboard](https://vercel.com/dashboard)

My Dashboard:

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jfvbtcl45ppm2lsyyzw6.PNG)
My Weather App Vercel demo:
[weather app vercel demo page](https://vercel.com/maw6a0/vercel-lab8)

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

My 11ty Vercel demo:
[11ty vercel demo](https://vercel.com/maw6a0/eleventy)

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

Another 11ty Vercel demo:
[another 11ty vercel demo](https://vercel.com/maw6a0/11ty)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/97kzjjjt6vk27x88o3wb.PNG)

Citations
1. https://vercel.com/guides/deploying-eleventy-with-vercel
2. https://dzone.com/articles/developer-experience-dx-devs-are-people-too
Hello world um pouco por trás dos panos
Tags: java, beginners
Published: 2022-03-15 00:46:28

Falando do famoso "Hello World" .
Bom... a primeira coisa que nos deparamos ao interagir com alguma linguagem é o famoso hello world, e no java não foge a regra, ora, mas como funciona um pouco mais por tras dos panos ele?
Aqui tento explicar um pouco os passos para a criação até a execução da classe Hello world

No geral temos 5 fases que o programa passam até rodar de fato sua instrução, sendo elas, edição, compilação, carregamento, verificação e execução. 

A primeira parte se resume a criar um arquivo com um programa editor. usando esse editor, faz as edições e correções necessárias e o salvamos em um dispositivo de armazenamento secundário, até aqui pense no seu disco rígido(Hd). Um nome
de arquivo que termina com a extensão .java é indicado que o arquivo contem o código-fonte java.
Na compilação o compilador cria bytecodes e os armazena em disco, o arquivo com o nome atribuído termina .class, após isso, temos o carregamento onde o carregador de classe lê os arquivos .class que contêm bytecodes a partir do disco
e coloca esses bytecodes na memoria. O  verificador de bytecode confirma que todos os bytecodes estão validos e não será violado restrições de segurança do Java. E por fim a execução, a JVM lê os bytecodes e compila no momento correto,
famoso (Just In Time- JIT) para que o computador possa entender.
Ok... agora sabemos como é realizado a execução de um simples programa, e olhando um pouco mais para o arquivo hello world, o que encontramos ?
Normalmente para escrever o simples hello world, será preciso fazer isso aqui :


`class HelloWorld{
public static void main(String[] args){
    System.out.println("Hello World");  // exibe a string
     }
  }`


Podemos dizer que temos 2 componentes, nossa definição de classe e o main método.


a forma mais básica para definirmos nossa classe será :

`class HelloWorld{
   ...
  }`


nossa palavra class inicia uma definição de classe chamado HelloWorld e o código para cada classe aparece entre as chaves.


Main método

Na linguagem de programação java toda aplicação deve conter um main método, e seguir essa assinatura :
Algo curiosos é que os modificadores de acesso podem ser escritos em qualquer ordem, porem a convenção é usar public static, nos argumentos podemos nomear como quiser, mas sempre é definido como args ou argv.
O main método é parecido com main função do C, é ponto de entrada do aplicativo e logo, invocara métodos exigidos pelo programa.
O main método ele aceita o argumento, que é uma array com elementos do tipo String, matriz na qual o sistema de tempo de execução passa informações para o app.

`public static void main(String[] args){
    ...
}`


Por fim a saída dos dados :
É usado a System da biblioteca principal para imprimir o "Hello World", biblioteca essa tambem conhecida como Application Programming Interface ou API.

System.out.println("Hello World");
Total Share
Tags: flutter, spanish, opensource, ushieru
Published: 2022-03-15 00:33:21

> En un capitulo más de esta serie llamada: 
> "Ingeniero aburrido un fin de semana"

Han visto que Huawei tiene una funcionalidad llamada Huawei Share? (Algo muy al estilo de AirDrop).

Bueno, pues mi laptop la tiene y yo no tengo un smarthphone Huawei pero me pareció interesante el concepto. Y bueno, si hacemos algo así que todos podamos usar independiente del OS? que funcione en red, que te parece? todos los dispositivos cuentan con comunicación TCP/IP, así que porque no?

## Manos a la obra. 👏

Para este proyecto decidí usar Flutter porque ya compila en todos lados por default así que nos quitamos un peso de encima.

### SocketIO vs TCP Sockets? 🔌
SocketIO es facilísimo de implementar y ya viene bastante preparado para estas cosas... pero estos proyectos son para aprender cosas nuevas. Que somos? huevos o limones?

### Esto no pretende ser un tutorial así que... ✨✨
Flutter + Sockets + Muchos colores.

[TotalShare](https://github.com/ushieru/TotalShare)

Probado en:
- [x] Windows 10
- [x] Linux
- [x] Andorid
- [ ] iOS
- [ ] MacOS

### 🤝 Te invito
A que clones el repo, o le hagas un fork, el código no es el mejor así que pueden hacerle muchos cambios, aparte de agregar funcionalidades como: desconectar clientes, rechazar archivos, compartir por internet. Las posibilidades son infinitas (Y no creo darle demasiado soporte por ahora hehehe).
Azure Functions University - Deployment Lesson (.NET 6)
Tags: azure, serverless, programming, dotnet
Published: 2022-03-16 21:36:11

---
title: Azure Functions University - Deployment Lesson (.NET 6)
published: true
date: 2022-03-15 00:00:00 UTC
tags: azure, serverless, programming, dotnet
canonical_url: https://blog.marcduiker.nl/2022/03/15/azfuncuni-deployment-lesson-dotnet6.html
series: Azure Functions University
---

![Deployment Lesson .NET 6](https://blog.marcduiker.nl/assets/2022/03/15/AzureFunctionsUniversity_Deployment_Lesson_NET6.png)

Hi serverless friends, we have a new Azure Functions University lesson for you! In this lesson we will learn how to deploy Azure Functions written in .NET 6.

<!--more-->
## Lesson

You can find the lesson on GitHub: [Deployment to Azure (.NET 6)](https://github.com/marcduiker/azure-functions-university/blob/main/lessons/dotnet6/deployment/README.md).

And you can watch the video on YouTube:
{% youtube RgF8bA1-CMo %}

The lesson consists of the following exercises:

| Nr | Exercise |
| --- | --- |
| 0 | Prerequisites |
| 1 | Understanding the Azure Resources |
| 2 | Deployment using VSCode |
| 3 | Creating Azure Resources using Azure CLI |
| 4 | Deployment using Azure Functions CLI |
| 5 | Deployment using GitHub Actions |
| 6 | Homework |
Day 549 : The Rah Rah
Tags: hiphop, code, coding, lifelongdev
Published: 2022-03-14 23:56:09

_liner notes_:
- Saturday : Went to the station to do the radio show. Got there a little early and did some work on my side project. Then it was time to do the show. Had a really good time as usual. The recording of this week's show is at https://kNOwBETTERHIPHOP.com

![Radio show episode image of the Outsidaz "Night Life" album cover with cartoon outlines of figures with green eyes with the words March 12th 2022 Seeding](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/t0vzoj92xpi0py6i4t1q.jpg)

- Sunday : So I spent the night in the van by the station. I got up and headed to the spot and stopped by McDonald's on the way to pick up some breakfast. Got to the spot just in time to start the https://untilit.works cyphers. I started off a little slower than normal, I was looking for things to order for the trip and was looking at reviews on YouTube. Got caught up in the rabbit hole of the forever watching videos. Luckily, I had the break sessions that saved me from the Rah Rah. I ordered some items and found my stride and got a bunch of stuff done with the side project.

- Professional : Got some pretty good news today about my overseas trip. It looks like I'll have another meetup that I'll be able to speak at. Also heard some more info about other events that I'll be involved in while on my trip. Had a couple of meetings. Other than that, I started working on my upcoming workshops and talks. It was a good way to start off the week.

- Personal : Sunday night, I stayed up so late that I forgot that the new "Attack on Titan" came out. After work, I tried the side project on the iPad mini I bought because I'll be using that when I travel. Of course, the Chrome version on iOS doesn't support Speech Recognition. I loaded the site on Safari that does Speech Recognition, but it's pretty terrible. It takes a long time to get the results back and most of the time they are way off and for some reason, it would double some of the words. Horrible. I'm going to see if I can use the third party service I'm using for https://untilit.works to transcribe the recorded video sessions.


![Looking through the trunks of very tall and skinny trees in Harz, Germany with the setting sun's rays shining through.](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/za4on1act1e6f6hczzf0.jpg)

Tonight, I'm going to see if I can get the speech recognition working on my project. Can't believe iOS is preventing Chrome from doing Speech Recognition and their solution with Safari is pretty terrible. Good thing I'm at a point that I can start testing this stuff on the actual device. I definitely also want to watch "Attack on Titan" before going to bed. Also, super happy that it's not pitch black outside after 6pm. I'm out!

Have a great night!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube HkIeYU3cpe0 %}
My first post at Dev.to
Tags: beginners, webdev, computerscience, javascript
Published: 2022-03-14 22:48:53

Well, title is self explanatory. So just wanted to make my first post as a personal introduction. I’m here restarting my developer career, which I quit seven years ago when I burned out. I learned about The Odin Project from somewhere after going down a rabbit hole trying to find out wether a boot camp was worth the money or not. So I’m really surprised to have found this amazing project TheOdinProject is. And I’ve just started! I’m quite excited about what will come in the following lessons.
I would also like to meet other developers and participate in community projects.
Benefits Of Mobile Applications
Published: 2022-02-17 06:13:58


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3uhmxluv52h9gtmqjwg9.jpg)
Mobile Application commonly referred to as an “app” is a kind of application software that is particularly designed to run on mobile phones. To put it differently, it is a type of software program one can download and access from a mobile phone. Mobile applications are becoming increasingly popular among businesses. They are used in almost every industry ( like food delivery, healthcare, beauty brands, etc.). Mobile Applications have innumerable benefits for businesses ( be it a start-up business or an ongoing business ). Undeniably, Mobile Applications are a boon for businesses. In this blog post, we will have a look at the advantages of having a mobile application for businesses. Without further delay, let’s dive in. As Per [Draggital](https://www.draggital.com/) :-
1. Build Connection — The first benefit of having a mobile app for your business is that it helps in building a strong connection with your customers. You can directly communicate with your customers and provide them valuable information related to your business like demographic locations, information related to your products and services, etc. This further helps in improving your sales, because if customers like your products or services they are more likely to share them with their acquaintances.
2. Boost Sales — Another benefit of mobile application is that it helps in enhancing sales. It is through your company website that people learn about your brand, products, and services. However, it is your “App” that aids in increasing sales. Apps are quicker and easier to use. Websites are important for brand awareness, but apps are required for sales.
3. Brand Recognition — Moving on, the next benefit of mobile application is that it helps in improving brand recognition or brand loyalty. These days customers are more likely to engage with a brand that has an app as compared to the brand that doesn’t have one. Furthermore, it helps to build customer loyalty.
4. Online Presence — Mobile applications are a great way of improving the visibility of your business. Time has gone by when having a website for business was enough. Nowadays, people prefer buying products and services using mobile apps. People spend more time using their smartphones as compared to PCs. They use their smartphones almost all the way, during their leisure time, while traveling, during lectures, etc. Mobile applications are a phenomenal marketing tool.
To Read Full Blog Visit — [Draggital/Blog](https://www.draggital.com/benefits-of-having-mobile-application-for-your-business)
Why I'm Not A CS Major
Tags: computerscience, programming, mkprojects
Published: 2022-03-14 22:36:59

If you did not know, I am majoring in Financial Mathematics because I love Computer Science; Mathematics is still my core. Here is how choosing a major went: 

- I want to study Math, some finance, and computer science 

Sounds like quite a bunch, any program like that?

Well, Financial Mathematics covers 2/3 of this, Computer Science covers only one, so the choice seemed straightforward, right? Well, that's a simple way of looking at it; what made me choose Financial Math compared to Comp Sci is because I can learn Comp Sci at any point or minor in it.

Compared to Financial Math, Comp Sci will be easier for me to learn on my own, and as I said before, I can minor in it. 

My tip when choosing a major is to do your research, look at the jobs, look at your passion, and look at what each University's program offers, I managed to get my top choice early, and I love it (for the most part). 

The neat thing about learning is the euphoria you feel when learning new material you're interested in, Math made me feel that way, and that's what ultimately made my choice; I either shout at my integrals or my compiler.
Converting Hex to Text - the Bash Way
Tags: bash, tutorial
Published: 2022-03-14 22:27:06

Let's start by pretending someone gave us some pure plain-text bytes, like this:
`68656c6c6f20776f726c64`

What are we going to do to find the hidden message?


First, we know that hexadecimal bytes are always 2 characters - you can verify this by using `man ascii` in your terminal and checking out the tables it shows. Next, we know that you can convert a hex byte into ASCII (or text) by using `echo` like this:

```
echo -e "\x61"

# a
```

What I thought we could do is split the hex string into an array of two-character pieces, and then use a loop to print them like above.  So deciphering our hex string is actually pretty straightforwards!

You can use the command `fold` to first split up the string:

```
 ~
  ▲ echo $(echo 68656c6c6f20776f726c64 | fold -w2))
68 65 6c 6c 6f 20 77 6f 72 6c 64
```

And here's a cool fact: by default, anything with spaces is automatically split into a loopable array by bash!

In case you forgot, you use arrays in bash using a rather odd notation: `${arrayname[location]}`.  

So if we call our previous output `spaced`:

```
for i in ${spaced[@]}; 
 do echo -n -e "\x$i";
done
```

Easy!  Thanks for reading my short tutorial, and have a great day.  You never know when this might come in useful...