teleren/devto huggingface dataset:
60% Looking Forward to Getting Finished With It
Published: 2022-12-13 19:26:11

I am still waiting for an answer from the company that I sent my case to. I am hoping tomorrow they'll let me know about their final decision about me. I most certainly hope that it will be positive of course but in the case that it is a no, I am really looking forward to complete this JavaScript course, so that I can go onto doing various projects with John Smilga's course and put them on my Github.

Of course I will also upload my projects from this course as well, but I believe, learning React will be the deciding point in getting a job.

I've just realized, if I get this German-related job, after 2 months of extensive German course, I will also wait for an extra month to get my first wage, which will be 3 months in total. 3 more months without making any money! This is insane! I am quite honestly sick of not spending any money and always trying to minimize my expenditures. I got stressed upon realizing this fact just now. I've devoted myself to a quite overwhelming way and I wholeheartedly wish that these efforts will pay off in the near future...
Flatten a nested object in JS
Tags: interview, javascript
Published: 2022-12-13 19:05:19

When an interviewer wants to test your logical as well as programming capabilities a good-to-go question for them is to ask you to write a function to flatten a given nested object. Such that, an object as given below

```
{
    "companyName": "Movetoabroad",
    "fieldOfWork": "Immigartaion",
    "website": "http://movetoabroad.com",
    "highlights": {
        "visaSuccessRate": "High",
        "fees": "Free"
    }
};
```

must become

```
{
  "companyName": "Movetoabroad",
  "fieldOfWork": "Immigartaion",
  "website": "http://movetoabroad.com",
  "highlights.visaSuccessRate": "High",
  "highlights.fees": "Free"
}
```

Seems simple. Right? We can just add a check to see if the value of the property is object if yes just iterate over the child object and prepend the parent property name to the child property name before adding it to a new object which contains all the flattened properties.

But in most cases, the interviewer will add a condition here that the object can have an "n" level of nesting. Such that, we can have an object in the form of 

```
{
  "companyName": "Movetoabroad",
  "fieldOfWork": "Immigartaion",
  "website": "http://movetoabroad.com",
  "highlights": {
    "visaSuccessRate": "High",
    "fees": "Free",
    "timings": {
      "weekdays": "9am - 6pm",
      "weekends": "10am - 7pm",
    },
  },
}
```

which must become

```
{
  "companyName": "Movetoabroad",
  "fieldOfWork": "Immigartaion",
  "website": "http://movetoabroad.com",
  "highlights.visaSuccessRate": "High",
  "highlights.fees": "Free",
  "highlights.timings.weekdays": "9am - 6pm",
  "highlights.timings.weekends": "10am - 7pm",
}
```

Now the logic which you thought earlier still applies but since the level of nesting is unknown we have to keep on applying the same logic again and again until the nesting stops. You can think of doing it using a loop but here's where the programming abilities kick in and you must think about using [Recursion](https://en.wikipedia.org/wiki/Recursion)

One common way to solve this is - 

```
const flattenObj = (obj) => {
  const result = {};
  for (let key in obj) {
    if (typeof obj[key] === "object") {
      const temp = flattenObj(obj[key]);
      for (let prop in temp) {
        result[key + "." + prop] = temp[prop];
      }
    } else {
      result[key] = obj[key];
    }
  }
  return result;
};

```

Or even better 

```
function flattenObj(obj, res = {}, parentKey = '') {
	for(let key in obj) {
  	let modifiedKeyName = parentKey ? `${parentKey}.${key}` : key;
    if(typeof obj[key] == 'object') {
    	flattenObj(obj[key], res, modifiedKeyName);
    }else{
    	res[modifiedKeyName] = obj[key];
    }
  }
  return res;
}
```

Disclaimer - This code must be considered only for interview purposes for real-world usage you might need to optimize it more based on the objects you are passing to this function. For instance, if the value of a property is an array then you might need to add another check `Array.isArray(obj[key])` along with `typeof obj[key] == 'object'` because in JS typeof arrays also returns "object".
Create a Laravel Project by setting "laravel" as global
Published: 2022-12-13 19:04:43

# Install Laravel Via Composer
- Installing:
```shell
composer global require laravel/installer
```
- Check that `laravel` is installed in this path `~/composer/vendor/bin`
```shell
cd ~/.composer/vendor/bin
```
> To get the full path and to copy and set it on `/etc/paths` then we can use `pwd` on `~/composer/vendor/bin`

- Insert the path on `/etc/paths`:
```
sudo vim /etc/paths
```
```shell
# ...
/Users/username/composer/vendor/bin # path inserted
```

# Using `laravel new`
```shell
laravel new test-project
```
Integrating HTML and JavaScript
Tags: codepen, javascript, html, css
Published: 2022-12-13 19:04:19

{% codepen https://codepen.io/kellililly05/pen/BaVgZeb %}

I have embedded by codepen *ABOVE* to demonstrate how JavaScript add interactivity in the browser. 

When you click on the HTML tab, you can see I used a *p* tag to just write my name.
When you click on the CSS tab, you can see all the styling to make my name look like a button that is clickable.

Now, if you didn't have any JavaScript written, hovering the mouse over my name would look like a button that is interactive. You could click on it, but nothing would happen.

Go ahead and click on the JS tab. I will explain line-by-line what the JavaScript is doing in the browser.
1. I am asking JavaScript to go into the HTML document and grab my *p* tag that I decided to name "para." 
2. I am adding an event listener to "para" I created. I want the JavaScript to *listen* for the event of a "click" then perform the function to change the name that is listed.
3. In this line, I created the function to actually allow anyone to change the name if you click the button. The function is creating a prompt that when you *click* on the button, JavaScript recognizes the event listener in the previous step and knows it needs to do something. So I tell it to create a prompt that states you can change your name. 

Thus, we have created interaction in the browser by using JavaScript.

Go ahead and try it for yourself!
Add Azure AD SAML SSO to Grafana using Datawiza
Tags: devops, grafana, azuread
Published: 2022-12-13 18:59:34

In this step-by-step tutorial, you will learn how to enable Azure AD SAML SSO for open source Grafana via Datawiza. Note that open source Grafana does not support SAML natively, so in the past, you had to buy the enterprise license if you wanted to use SAML. Datawiza eliminates this license requirement by enabling SAML with open source Grafana. Datawiza is a generic identity-aware OIDC/OAuth/SAML proxy with a centralized management console that you can easily use to achieve the same integration with other identity providers like Okta, Auth0, PingIdentity, Google, etc.

learn more: https://www.datawiza.com/blog/add-azure-ad-saml-sso-to-grafana-using-datawiza
Calling values of nested Context Data in React
Tags: react, help, beginners, programming
Published: 2022-12-13 18:48:39

I'm currently working on a project where I am trying register a user and then call the user_id data to register an employee. The user is taken in as an object in my contextData component located in my authContext.js file shown below:
 
const contextData = {
user,
token,
loginUser,
logoutUser,
registerUser,
isServerError,
}; 

The contextData is exported at the bottom of the authContext file as shown:

**EmployeeContext.Provider value={contextData}>{children}</EmployeeContext.Provider**


My problem is how to call the user values in my RegisterEmployee.js after importing the data from the authContext like so:
**const { contextData, token } = useContext(AuthContext);**

I'm pretty new to react so hopefully this makes sense. Can anyone give me some guidance on using the code I have currently?

TIA
On to JavaScript
Tags: javascript, beginners, python, programming
Published: 2022-12-13 18:16:38

Hello! It has been a while since I have updated on this blogging site. This is my first time blogging so it kinda hard to keep up with it. Over the past month I finally have begun learning Javascript. I spent a good 3 months learning programming fundamentals with python, and now I am ready to begin learning Javascript.
This time around, since I learned programming concepts through python, now it is easier to grasp the fundamentals for Javascript. therefore, it makes learning feel more like a review. Strings, values,  if/else, etc. My goal is to learn the fundamentals...learn CSS and HTML and then begin building my own mini projects..till next time.
Implementing the Mastermind game
Tags: python, tutorial, programming, beginners
Published: 2022-12-13 18:09:00

---
title: Implementing the Mastermind game
published: true
description: A series of article showing how to implement the Mastermind game
tags: python, tutorial, programming, beginners
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nmhgt89hhvnv0al7we2u.jpeg
# Use a ratio of 100:42 for best results.
published_at: 2022-12-13 18:09 +0000
series: mastermind
---

In this series I am going to implement a version of the well-known [Mastermind board game](https://en.wikipedia.org/wiki/Mastermind_(board_game)). Well, it is well know at least to me. As I have encountered many people who are not familiar with it so let's start by explaining the game:

## The Game

* The computer selects N different items from a pool of M items and puts them in some order. This is the secret that the user has to find in the right order.

* The user selects N different items from the pool of M items in a certain order.
* The computer gives a `*` sign for every item that is in the same location as in the secret and a `+` sign for every item that is in the secret but not in the place the user put it.The order of the response does NOT correspond to the order of the values.

* The last two steps are repeated until the user finds the secret and the the user wins. If the user cannot find the secret in K guesses then the user loses.

* N, M and K can be be anything. Items can be anything (eg. colors, digits, letters, etc.)
* In the original game M = 6 colors, N = 4 and K = 12 and * was a back stick and + was a white stick.

* There difficulty can be increased by allowing items to be repeated in the secret and/or by allowing empty spaces in the secret.

Let's see an example when the pool of items are the 6 digits 1-6 and that the size of the secret is 4.

The computer selects 4 values randomly:

* hidden:  3654
1. guess 1: 1234   `*+`   (4 is in the right place, 3 is in the wrong place)
1. guess 2: 1256   `*+`   (5 is in the right place, 6 is in the wrong place)
1. guess 3: 6354   `**++` (4 and 5 in the right place, 3 and 6 in the wrong place)
1. guess 4: 3654   `****`  win


## An original box

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/75shx44qzkchc45kn37t.jpeg)

## Technology

* First I'll implement a command-line version of the game written in **Python**
* Then I will probably implement a web version with plain HTML  using the **Flask** framework written in **Python**
* Then I don't know yet. I might implement a different front-end for the game or I will re-implement the whole thing in **JavaScript**. I don't know yet.

In any case I am going to publish and explain my progress so follow me if you are interested.
Day 11: CI for wp2txt Ruby project
Tags: ruby, programming, opensource, devops
Published: 2022-12-11 06:23:00

---
title: Day 11: CI for wp2txt Ruby project
published: true
description: There is more than one way to test a Ruby Gem
tags: ruby, programming, opensource, devops
# cover_image: https://direct_url_to_image.jpg
# Use a ratio of 100:42 for best results.
published_at: 2022-12-11 06:23 +0000
canonical_url: https://code-maven.com/ci-for-wp2txt-ruby-project
series: ci-2022-12
---


After the success yesterday [adding CI to a Ruby Gem](https://code-maven.com/ci-for-rdf-kv-ruby) I thought I can give another try to more Ruby Gems so I looked at the [Ruby Digger](https://ruby-digger.code-maven.com/). As I can see there is even less action there than on [CPAN Digger for Perl](https://cpan-digger.perlmaven.com/).


## Error reports

First I looked at a project called [nezekan](https://github.com/zarkiel/nezekan). I tried to run the tests locally, but failed.
I am not sure if I was even trying to run them as the authors intended, but [this error](https://github.com/zarkiel/nezekan/issues/1) seem to be genuine. It is a case-sensitivity issue. After I fixed that locally I bumped into [and reported another issue](https://github.com/zarkiel/nezekan/issues/2).

Only now, that I am writing this I realized that the project had a Travis-CI configuration file. Although Travis-CI does not provide the free service any more I could have looked at the configuration file and base my commands on that. I can get back to that later.


## wp2txt

After a while I found the [wp2txt](https://github.com/yohasebe/wp2txt) project. Adding GitHub Actions to this was quite simple though it was different from the previous one. Here is the [pull-request](https://github.com/yohasebe/wp2txt/pull/11)
and below you'll find a copy of the configuration file as I sent it.

## GitHub Actions

```yaml
name: CI

on:
  push:
  pull_request:
  workflow_dispatch:
  schedule:
    - cron: '42 5 * * *'

jobs:
  test:
    strategy:
      fail-fast: false
      matrix:
        ruby: [ '3.1' ]

    runs-on: ubuntu-latest
    name: Ruby ${{matrix.ruby}}
    container: ruby:${{matrix.ruby}}

    steps:
    - uses: actions/checkout@v3

    - name: Show Ruby Version
      run: ruby -v

    - name: Install dependencies
      run: bundle install

    - name: Install rspec
      run: gem install rspec

    - name: Run tests
      run: rspec
```

## Conclusion

Slowly, but I learn how to run the tests in the various Ruby projects as well. Unfortunately there are not very many new uploads to [RubyGems](https://rubygems.org/)
and this [Ruby Digger](https://ruby-digger.code-maven.com/) is growing slowly.
Expose-WSL
Tags: wsl, wsl2, devtools, workflow
Published: 2022-12-13 17:44:18

---
title: Expose-WSL
published: true
description: Probably the simplest way to expose apps running on WSL to local network devices
tags: wsl, wsl2, devtools, workflow
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/lzeizno11ljf1muawyn0.png
# Use a ratio of 100:42 for best results.
# published_at: 2022-12-13 17:40 +0000
---

> Probably the simplest way to expose apps running on WSL to local network devices

No installation required. 
Simply run this before starting your apps:
```bash
npx expose-wsl@latest
```

## Why I built it?

WSL provides a great environment for web developers working on Windows.  
However, it's not always easy to access the applications running in WSL from the local network.  
Whether you're working on a web app, a React-Native application, REST API, or have a database residing in a Docker container, you'll need to access it from a real mobile phone or simply from a different device.  
While there are ways to achieve this, they are not always easy to implement.  
Some of them require tackling with an [NIC Bridge mode](https://github.com/microsoft/WSL/issues/4150#issuecomment-1018524753) or manually downloading and applying a [WSLHostPatcher](https://github.com/CzBiX/WSLHostPatcher).  
Which are things you probably don't want to deal with when you're just trying to get your work done.  
Here's where [Expose-WSL](https://github.com/icflorescu/expose-wsl) comes into play.

## How does it work?

[Expose-WSL](https://github.com/icflorescu/expose-wsl) uses the excellent [WSLHostPatcher](https://github.com/CzBiX/WSLHostPatcher) built by [CzBiX](https://github.com/CzBiX).  
It automates the process of downloading the **WSLHostPatcher** release, decompressing the binary, running it to patch your WSL, and running a PowerShell script to display the IP address of your machine.

## Supporting the project

If you find this tool useful, please 🙏[star the repo](https://github.com/icflorescu/expose-wsl) spread the word, and consider ❤️ [sponsoring my work](https://github.com/sponsors/icflorescu).  
I'm the author and maintainer of [several open-source projects](https://github.com/icflorescu) such as [Mantine DataTable](https://icflorescu.github.io/mantine-datatable/) and [tRPC-SvelteKit](https://github.com/icflorescu/trpc-sveltekit), and your support will help me keep them up-to-date and bug-free.
I might also be available for hire. If you need help with your project, feel free to contact me at the email address listed on my GitHub profile.
toastr notification- error in compiling
Published: 2022-12-13 17:35:10

I am trying to develop new angular application with toaster feature by refering below link: https://www.freakyjolly.com/angular-toaster-notification-message-using-ngx-toastr/
Followed all the steps but getting error while compiling as 
Error:node_modules/ngx-toastr/toastr/toast.directive.d.ts:8:18 - error TS2707: generic type 'DirectiveDeclaration' requires between 6 to 8 type arguments.'

Need your help on this. Thank you in advance.
The Storm
Published: 2022-12-13 17:28:17

---
title: The Storm
published: true
description: 
tags: 
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nyxv9kp7vtzuilal7kuv.png
canonical_url: 'https://kevwe.com/weekly/202250'
# Use a ratio of 100:42 for best results.
# published_at: 2022-12-13 17:27 +0000
---
Everything is connected, in life like in technology, connections can be a good thing, an opening for new possibilities.


But not all connections are good.


It could be a gateway for issues you would not expect.


As the world is much bigger and nuanced than you would have expected as a younger version of yourself, the single computer in the basement is now open to the wider ocean and its storms.


This is not a metaphor, and the storm is coming for real. 


As people grows in age and experience, so our industry must grow past its adolescence and mistakes, before being ready to traverse The Ocean.


For the weekly links: https://kevwe.com/weekly/202250
An experiment comparing the performance of computations on CPUs and a GPU
Tags: aws, cloud, beginners, jupyter
Published: 2022-12-13 17:27:42

# Introduction
- The CPU versus GPU performance experiment is set up. In this Lab Step, you will run the experiment.
- You will monitor the CPU and GPU devices while the experiment is being performed
- Before to read this post, you have to see my previous post from [here](https://dev.to/aws-builders/set-up-the-cpu-versus-gpu-experiment-2e31)

# Perform the experiement
### Step 1

In your Jupyter notebook, click the Run button to start running the experiment:

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

- The code will start running. It will take around 30 seconds before you see any output.
- The first time you run the cell it takes significantly longer than following times because the code is being compiled and libraries are being loaded, and the code is loaded onto the GPU. 
- The first output you see will be warning messages:

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

**The warnings don't impact the results of the experiment and can be ignored.**

### Step 2
Once you see Calculating 100x100 matrix product, pay attention to changes in the CPU and GPU statistics.
<br>The CPU statistics indicate that all four cores are being utilized to their full ability: 

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

- A %CPU value of 400 indicates all four cores are being utilized 100% each.
- Having all CPUs fully utilized indicates that the performance of the computation is limited by the number of CPUs.
- That is, more CPUs are needed to perform better. This state is referred to as being compute-bound.
- On the other hand, the GPU never seems to reach 100% utilization (GPU-Util):

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

- This indicates that the GPU has more capacity before the GPU becomes compute-bound.
- Other changes you will notice is the addition of a python process in the lower Processes table.
- The temperature of the GPU increases quite sharply when the computations first start before plateauing.
- The power fluctuates from a standy level to an elevated level when the GPU is performing a computation.

 

### Step 3
-When the experiment completes, observe the two charts displayed in the notebook.
- You will analyze the results in the next Lab Step.

 
### Step 4
- Re-select the cell with the Python code in it, and run it again.
- Watch for any differences in GPU and CPU metrics that you might have missed the first time.

<br><br>**You can see the analysis of this experiment from [here](https://dev.to/aws-builders/analyze-the-results-of-the-cpu-vs-gpu-experiment-4o25)**

<br><br>
[GitHub](https://github.com/a00ayad00)
[LinkedIn](https://www.linkedin.com/in/a00ayad00)
[Facebook](https://m.facebook.com/a00ayad00)
[Medium](https://a00ayad00.medium.com/)
all the CRUD
Tags: beginners, ruby
Published: 2022-12-13 17:09:59

CRUD is a common acronym in the world of programming. It stands for Create, Read, Update, and Delete, and it refers to the four basic operations that can be performed on a database.

In this post, we'll take a look at how to implement CRUD using Ruby on Rails and JSON. Here's an example of a controller that performs CRUD operations on a Product model:

```
# Create a new record in the database
def create
  product = Product.new(product_params)

  if product.save
    render json: product, status: :created
  else
    render json: product.errors, status: :unprocessable_entity
  end
end

# Read a record from the database
def show
  product = Product.find(params[:id])

  render json: product
end

# Update an existing record in the database
def update
  product = Product.find(params[:id])

  if product.update(product_params)
    render json: product
  else
    render json: product.errors, status: :unprocessable_entity
  end
end

# Delete a record from the database
def destroy
  product = Product.find(params[:id])
  product.destroy

  head :no_content
end

private

# Strong parameters
def product_params
  params.require(:product).permit(:name, :price, :description)
end

```
In this example, the controller methods return JSON data instead of rendering views. JSON (JavaScript Object Notation) is a lightweight data interchange format that is often used to exchange data between web applications and servers. In this case, the controller methods return a JSON representation of the Product object that is being created, retrieved, updated, or deleted. This allows a client application to access the data and use it however it needs to.

That's it! You can use this simple example as a starting point for implementing CRUD in your own Rails applications.
On the verge of becoming a software engineer.
Published: 2022-12-13 17:00:29

The end is near. 3 months after taking a leap into a software engineering bootcamp I'm almost there, but what's actually on the horizon? The panic of restructuring my life to have it possibly not work out is truly bringing some anxiety into my life, but I'm learning to truly trust the process. 

I am now well versed on JavaScript, React, Ruby (on rails), and of course some CSS. Bringing all of these languages together for my phase 5 project I'm hoping is something that will take care of this impostor syndrome I'm dealing with. This is not only a test to show myself I can bring everything together, but hopefully also a leap into having something solid to show a possible future employer. 

Really just wondering what's next in life... where will this profession take me, geographically speaking? Financially also, I'm hoping I can find the stability I once had in my life. Just tons of things to come, and anxious to see it all unfold.

More to come....