teleren/devto huggingface dataset:
Should I Die In Ukraine?
Tags: watercooler, discuss
Published: 2022-02-28 01:00:20

Listen, I happen to have a military background (particularly the asymmetric sort we're seeing in Ukraine), and I've trained soldiers for combat and in emergency medicine. I fought in Iraq. I was medically retired for PTSD. If I were asked to go back to Iraq, I would not. But Ukraine is fundamentally different to me, and I feel an intense need to help.

However, I now have a family. My daughter is almost six. So what do you think? What do I do?
Fundamentals 
Tags: programming, webdev, react, javascript
Published: 2022-02-28 00:57:05

After graduating from Flatiron School of Seattle I have been flooded with dreams and motivation for my future career and what steps I need to get there.
Since graduating, I have spent the better part of my free time watching lectures on Python, C++, and Java, filling my notes with the differences in those languages and data structures. Programming is ever changing so keeping up and constantly practicing is incredibly important. 
I recently had a mock technical interview and it did not go the way I had hoped. I had spent hours and hours on Leet Code practicing algorithms and expanding my critical thinking, however I made a big mistake not keeping up with the fundamentals. What should've been a simple method actually stumped me, and of course I led myself to that position.
My take away from that experience was to not focus on the tough parts, but to expand my education and continuously work to be the best developer that I can be. I have started from square one, reading over the couple thousand pages of notes that I have accumulated with my time at Flatiron as well as each assignment. 
After a lot of hard work, a tough lesson learned, and countless hours of studying, I'm on the right track to be the developer I've dreamed of.
CSSBattle | #6 Missing Slice
Tags: css, cssbattle, challenge, missingslice
Published: 2022-02-28 00:41:19

Welcome to CSSBattle Challenges!

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

---

> #### Challenge:

![Missing Slice Challenge](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kaf286w4ayeklr6r1dfl.png)

---

> #### Solution:

```html
<div class="container">
  <div class="parent">
    <div class="child top-left"></div>
    <div class="child top-right"></div>
    <div class="child bottom-left"></div>
    <div class="child bottom-right"></div>
  </div>
</div>

<style>
  * {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
  }
  .container {
    width: 100%;
    height: 100%;
    background: #E3516E;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .parent {
    width: 200px;
    display: flex;
    flex-wrap: wrap;
  }
  .child {
    width: 100px;
    height: 100px;
  }
  .top-left {
    background: #51B5A9;
    border-top-left-radius: 100px;
  }
  .top-right {
    background: #FADE8B;
    border-top-right-radius: 100px;
  }
  .bottom-left {
    background: #F7F3D7;
    border-bottom-left-radius: 100px;
  }
  .bottom-right {
    background: #E3516E;
  }
</style>
```

---

As always, I welcome any feedback or questions regarding the implementation detail of the challenge. Otherwise, I hope this was useful!
CSSBattle | #5 Acid Rain
Tags: css, cssbattle, challenge, acidrain
Published: 2022-02-28 00:26:03

Welcome to CSSBattle Challenges!

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

---

> #### Challenge:

![Acid Rain Challenge](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kbd8laha9h90jwbt2owg.png)

---

> #### Solution:

```html
<div class="container">
  <div class="parent">
    <div class="circle top"></div>
    <div class="leaf middle"></div>
    <div class="leaf bottom"></div>
  </div>
</div>

<style>
  * {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
  }
  .container {
    width: 100%;
    height: 100%;
    background: #0B2429;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .parent {
    display: flex;
    flex-direction: column;
    transform: rotate(45deg);
  }
  .circle {
    border-radius: 60px;
  }
  .leaf {
    border-top-right-radius: 60px;
    border-bottom-left-radius: 60px;
    border-bottom-right-radius: 60px;
  }
  .circle, .leaf {
    width: 120px;
    height: 120px;
  }
  .top {
    background: #F3AC3C;
    transform: translateY(35px)
  }
  .middle {
    background: #998235;
    transform: rotate(45deg)
  }
  .bottom {
    background: #F3AC3C;
    transform: translateY(-35px) rotate(45deg) 
  }
</style>
```

---

> #### Key Takeaway(s):
- using flexbox to center children elements vertically and horizontally within a parent container

As always, I welcome any feedback or questions regarding the implementation detail of the challenge. Otherwise, I hope this was useful!
Learn 11ty
Tags: beginners, webdev, programming, tutorial
Published: 2022-02-28 00:10:34

Hello! Today were going to be learning 11ty! The intro tutorial can be found here [here](https://www.11ty.dev/docs/getting-started/). In order to do this, I created three different 11ty sites.

## Hello World
For this hello world site, I used the original tutorial. I added some blogposts to the site and linked them on new pages. Once I made my basic site and checked it on local host, I pushed my changes to [GitHub](https://github.com/hvk5388/eleventy-sample). If you do that you can then deploy them to GitHub pages by simply creating a `gh-pages` branch. [Here](https://docs.github.com/en/pages/quickstart) are some simple directions to create your website. You can find my website [here](https://hvk5388.github.io/eleventy-sample/).

## Base template
In order to use a template, you should open the GitHub repository. I used [this](https://github.com/11ty/eleventy-base-blog) basic one. Select `Use This Template` and clone the repo to your machine. All you have to do then to add your information is input your posts as markdown. Here is my [GitHub repo](https://github.com/hvk5388/11ty-base-blog) and my [sample site](https://hvk5388.github.io/11ty-base-blog/).

## Second template
One last example uses a template based off the original one, found [here](https://github.com/google/eleventy-high-performance-blog). Again, I used the template, cloned, and added my posts. Here is my [GitHub repo](https://github.com/hvk5388/eleventy-high-performance-blog) and my [sample site](https://hvk5388.github.io/eleventy-high-performance-blog/).

Thanks for checking out these materials! Keep coding!
Is Learning Sass Worthwhile?
Tags: webdev, html, css, sass
Published: 2022-02-28 00:04:11

Greetings people of the Dev Community! It has been a while since I last posted on this blog, and to be honest not much has changed. 

I was working on a small project with my friend, that required a lot of styling to be done in CSS, and not all of it could be classless. Then I was met with a developers worst nightmare, a freakishly long CSS file that encased all sorts of `.classes` and `#ids`. Even though I had made all the class names, they were scattered throughout the file and there was no sense of organisation. Additionally, the CSS variables I had created were not organised either. 

So, after living through that nightmare, I came across Sass. I had known about Sass for a while, but had been putting off learning it. I thought it would be something that is too similar to CSS, but with a couple of short YouTube tutorials and some help from w3 Schools, I was an expert. Okay, maybe not expert, but I can make my way around Sass. 

Sass uses most of the same syntax as CSS and is therefore easy to learn if you have some experience with CSS. Sass is an extension for CSS, and it reduces the repetition caused by CSS, which is why many choose to use it. Stylesheets can sometimes get very long, and CSS does not have much to offer in terms of shortening them or making them easier to read through. Sass adds features like variables, nested rules, mixins, imports, inheritance and built-in functions, which are all things that CSS does not have.

Now, I'm not going to give you a whole tutorial here, but you can very easily learn the basics of Sass in just a couple of minutes. I'll leave some links for some quick learning down below. 

Thanks for reading.

- [Learn Sass In 20 Minutes | Sass Crash Course](https://www.youtube.com/watch?v=Zz6eOVaaelI)
- [Sass Tutorial](https://www.w3schools.com/sass/default.php)
FIRST POST(A Start)
Tags: beginners, brandnewcoder
Published: 2022-02-27 23:54:51

I have come to what I can only hope is the end of my audio and video production career path but an end is just a new beginning. Earlier this week i began my first of twenty weeks in FlatIron's twenty week software engineering class. As I travel across this new terrain, I welcome you to follow my journey. In the coming weeks and months I hope to not only develop a large skill set for software engineering but demonstrate it here. Maybe I can help and maybe even inspire others. I have already completed the pre-work for FlatIron and learned a great deal. Especially considering I knew nothing of coding coming into this. Here is my first attempt at a website after one month of pre-work. https://zander618.github.io/Solve-the-camelCase/
CSSBattle | #4 Ups n Downs
Tags: css, cssbattle, challenge, upsndowns
Published: 2022-02-27 23:50:22

Welcome to CSSBattle Challenges!

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

---

> #### Challenge:

![Ups n Downs Challenge](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rc16o6d03qvrxc11in6j.png)

---

> #### Solution:

```html
<div class="container">
  <div class="parent">
    <div class="child left"></div>
    <div class="child center"></div>
    <div class="child right"></div>
  </div>
</div>

<style>
  * {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
  }
  .container {
    width: 100%;
    height: 100%;
    background: #62306D;
    display: flex;
    justify-content: center;
  }
  .parent {
    display: flex;
    align-items: center;
  }
  .child {
    width: 100px;
    height: 100px;
    background: #F7EC7D;
    border-top-left-radius: 50px;
    border-top-right-radius: 50px;
  }
  .left {
    transform: rotate(-180deg) translateY(-50px);
  }
  .center {
  	transform: translateY(-50%);
  }
  .right {
  	transform: rotate(-180deg) translateY(-50px);
  }
</style>
```

---

> #### Key Takeaway(s):
- using flexbox to center children elements vertically and horizontally within a parent container
- using transform rotate to flip an element vertically 

As always, I welcome any feedback or questions regarding the implementation detail of the challenge. Otherwise, I hope this was useful!
Getting Started with 11ty
Tags: 11ty, tutorial, webcomponents, webdev
Published: 2022-02-27 23:42:55

#Getting Started with 11ty
Eleventy (11ty) is a powerhouse of a tool that is used to mix templates and languages. Very flexible. It was noted that eleventy was created for "flexibility, betting on JavaScript, not a JavaScript framework" [(Zach, 2018)](https://www.zachleat.com/web/introducing-eleventy/) Content can be written in markdown and go to a developed template. The best way I have found to begin working on 11ty is to look at developed projects and some starter code for further exploration. Here are some [examples.](https://www.11ty.dev/docs/starter/)

#Different & User Experience 11ty Sites-- Basic 11ty and hax11ty
This is a video demonstration on development: [Video Demonstration](https://youtu.be/BKdQEXqfFA0).

This is a screenshot of a baseline for performance.
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ucfkfet3ey3v7sjasrts.png)

From the hello world template of 11ty to the working template provided functionality. Blog posts were also added to the column of the working site.

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

More...

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

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

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

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

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

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

Usability is key. 11ty is good for compiling everything in one place to create a smooth, cohesive experience. It scaffolds and works off projects and uses directories.

#Links to Relevant Sites
[hax11ty]( https://github.com/elmsln/hax11ty)
[hello world]( https://www.11ty.dev/)
[repo](https://github.com/Taylor-Bracone/11tyy)
[repo 2](https://github.com/Taylor-Bracone/11tyy2)
[repo 3](https://github.com/Taylor-Bracone/11tyy3)
CSSBattle | #3 Push Button
Tags: css, cssbattle, challenge, pushbutton
Published: 2022-02-27 23:09:07

Welcome to CSSBattle Challenges!

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

---

> #### Challenge:

![Push Button Challenge](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qvty3l3gy8vtomayjiux.png)

---

> #### Solution:

```html
<div class="container">
  <div class="outer-rect"></div>
  <div class="outer-transparent-circle"></div>
  <div class="inner-blue-bg-circle"></div>
  <div class="inner-gold-bg-circle"></div>
</div>

<style>
  * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
  }
  .container {
    width: 100%;
    height: 100%;
    background: #6592cf;
    position: relative;
  }
  .outer-rect {
    position: absolute;
    width: 300px;
    height: 150px;
    background: #243d83;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .outer-transparent-circle {
    position: absolute;
    width: 250px;
    height: 250px;
    border-radius: 50%;
    background: #6592cf;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .inner-blue-bg-circle {
    position: absolute;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    background: #243d83;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .inner-gold-bg-circle {
    position: absolute;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #eeb850;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
</style>
```

---

> #### Key Takeaway(s):
- using relative and absolute positioning to create relationships between parent and children elements

As always, I welcome any feedback or questions regarding the implementation detail of the challenge. Otherwise, I hope this was useful!
The Weekly Dev - 202209
Published: 2022-02-27 22:45:59

---
title: The Weekly Dev - 202209
published: true
description: 
tags: 
//cover_image: https://direct_url_to_image.jpg
canonical_url: 'https://kevwe.com/weekly/202209'
---
Leave the sky to the birds, hold your feet still in the ground

It's nice to look high up in the sky and dream of buildings that reach impossible heigths. 

Still, we need to fight closer, more terrestrial fights, in order to get where we want:

https://kevwe.com/weekly/202209
Improve Logical Thinking Skills in Programming
Tags: tutorial, devops, computerscience, discuss
Published: 2022-02-27 21:22:04

> “In some ways, programming is like a painting. You start with a blank canvas and certain basic raw materials. You use a combination of science, art, and craft to determine what to do with them.”
 —**`Andrew Hunt`**

This article will be categorized into three (3) sections: 

1. The concepts of logical thinking

2. Improve Logical Thinking Skills in Programming

3. Conclusion and Actionable Tasks.

First of all it is imortant that to note that it is until a level of logical thinking skills is developed and harnessed before a state of logic building can be implemented.

> `Logical thinking 👉 Logic building`


## Concepts of logical thinking


Logical thinking is an important trait in a programmer. It is also referred to as analytical reasoning, abstract thinking, or critical thinking. 

Logical thinking is a way of of resolving a quandary through the application of principles of logic. You can look at it as the math equation of the Transitive Property of Equality. If A=B and B=C, than A=C.

> People that can think logically are able to analyze problems and devise solutions.

Looking at the counterpart of Logical thinking, critical thinking, one would thinking they on same side of a coin, however they are different.

> Logical reasoning and critical thought are two sides of the same coin, although not necessarily the same thing.

Critical thought involves a little more questioning. Do things make sense? Who stands to gain the most? These are the types of questions that would lead you to dismiss the arguments on one side of an issue and embrace the other side as being more credible.

> In logical thinking, it doesn’t matter how you feel about A, B or C, it’s just the way it is.

Critical thought is a process which allows you to examine and eliminate possibilities. Whatever is left, no matter how improbable is most likely, the answer.

> Logical thinking is about connecting one thing with another.
> Critical thinking is about making sure the connections between those things are legitimate, and if not, disconnecting them.


## Resources

https://www.technokids.com/blog/teaching-strategies/its-easy-to-improve-logical-thinking-with-programming/
Appendix: Compute and Serverless Services - AWS Certified Cloud Practitioner Study Guide
Published: 2022-02-27 21:16:20

[AWS Batch](https://aws.amazon.com/batch/)
- Run hundreds of thousands of batch computing jobs
- Dynamically provisions compute resources based on batch volume and resource requirements
- Plans, schedules, and executes your batch computing workloads across services
- No additional fee, only pay for resources used

[Amazon EC2](https://aws.amazon.com/ec2/)
- Over 500 instances and choice of the latest processor, storage, networking, operating system
- Supports Intel, AMD, and Arm processors
- On-demand EC2 Mac instances
- 400 Gbps Ethernet networking

[AWS Elastic Beanstalk](https://aws.amazon.com/elasticbeanstalk/)
- Deploying and scaling web applications and services developed with Java, .NET, PHP, Node.js, Python, Ruby, Go, and Docker on familiar servers such as Apache, Nginx, Passenger, and IIS
- Automatically handles the deployment, from capacity provisioning, load balancing, auto-scaling to application health monitoring
- No additional fee, only pay for resources used

[AWS Lambda](https://aws.amazon.com/lambda/)
- Serverless, event-driven compute
- Trigger Lambda from over 200 AWS services and software as a service (SaaS) applications
- Only pay for what you use

[Amazon Lightsail](https://aws.amazon.com/lightsail/)
- Low-cost, pre-configured resources
- Build and launch applications, create websites, and spin up test environments

[Amazon WorkSpaces](https://aws.amazon.com/workspaces/)
- Fully-managed desktop virtualization service
Appendix: Application Integration Services - AWS Certified Cloud Practitioner Study Guide
Published: 2022-02-27 20:48:48

[Amazon Simple Notification Service (Amazon SNS)](https://aws.amazon.com/sns/?whats-new-cards.sort-by=item.additionalFields.postDateTime&whats-new-cards.sort-order=desc)
- Fully-managed service for app-to-app (A2A) and app-to-person (A2P) communication
- A2A - messaging between distributed systems, microservices, and event-driven serverless apps
- A2P - message users at scale through SMS, email, or push notifications

[Amazon Simple Queue Service (Amazon SQS)](https://aws.amazon.com/sqs/)
- Fully managed message queuing service
- Send, store, and receive messages between software components at any volume
- Standard queues: maximum throughput, best-effort ordering, at-least-once delivery
- SQS FIFO queues: guarantee that messages are processed exactly once, in the exact order that they are sent
Appendix: Analytics Services - AWS Certified Cloud Practitioner Study Guide
Published: 2022-02-27 20:40:03

[Amazon Athena](https://aws.amazon.com/athena/?whats-new-cards.sort-by=item.additionalFields.postDateTime&whats-new-cards.sort-order=desc)
- Serverless interactive query service for analyzing data in S3
- Point to your data in Amazon S3, define the schema, and start querying using standard SQL
- No need for complex ETL jobs
-  Out-of-the-box integrated with AWS Glue Data Catalog
- Pay per query - $5 per terabyte scanned

[Amazon Kinesis](https://aws.amazon.com/kinesis/)
- Fully managed streaming data processing
- Collect, process, and analyze real-time, streaming data
- Process data from hundreds of thousands of sources with very low latencies

[Amazon QuickSight](https://aws.amazon.com/quicksight/)
- Cloud-native, serverless business intelligence service
- Explore data using natural language questions with Q
- Perform advanced analytics with machine learning insights
Docker 101
Published: 2022-02-27 20:36:10

## Why is Docker so powerful?##

From what I've gathered and from reading about and tooling around with Docker the reason it is so powerful is because of its ability to deploy to the cloud and its containerisation. 

In terms of containerisation, Docker has made it generally easier to create and deploy application via a container. The fact that everything is packaged up in this virtual shipping container means that the developer does not need to worry about he project running on a different Linux machine.

Additionally, Docker is open source! Any random person with, we can assume, a good amount of coding experience can tinker with it and adjust it to fit their own needs.




## News API and Nasa Search Project##

In order to run the Nasa Search Project (NSP) in Docker the first set I would suggest would be to create a file that will house your setting for the API and URL for your NSP. 


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

In terms of the infinite X's that follow the API_KEY, I suggest you generate your key before copying your file to Docker. This can be generated by going to [](https://api.nasa.gov/) logging in and receiving your personalised password. The end point will also be assigned to to the second value which stands as NEWS_ENDPOINT for the example. 

Once the file has been uploaded and you ensure that the data is saved in the Docker Editor you will click open port and when prompted about which port you would like to open you type in 4000. 


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

This will take us to an unresponsive site, but will give us the public URL to our Docker file!!!!! Copy and paste this link into the NEWS_ENDPOINT value in the dev.to file. 

Finally, it's time to deploy!! You're going to run `docker-compose up` and wait to it run-- it's going to be a while.

Once the code has run, we are going to see port 80, our frontend and 4000 our backend. Port 80 is what were looking for. 


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


Hopefully, once you click 80 it will pull up your Nasa Search Image page, if it doesn't I'm sorry to tell you but you might have trusted the wrong IST402 student.