teleren/devto huggingface dataset:
Fizz Buzz Multithreaded
Tags: python, algorithms
Published: 2022-09-26 21:30:00

Day 6 of the #I4G10DaysOfCodeChallenge, and it is the multi-threaded variant of the well-known fizz buzz problem on Leetcode. 

We want the four different threads—fizz, buzz, fizzbuzz, and number—to create the output in the proper order. Each thread will call one of the four functions—fizz, buzz, fizzbuzz, and number—exactly once.

I used the locking method to solve this problem.

Despite the fact that there are four separate loops, only one will ever increase the shared counter variable because of the mutually exclusive if conditions. They never stop spinning until it's "their turn" to print an output and increase the value of the counter.
#10daysofcodechallenge by Ingressive for Good (#Day 6)
Published: 2022-09-26 21:22:18

I've just begun a 10-day coding challenge organized by Ingressive for Good and I'll be sharing my thoughts on Day 6 of the challenge.

Let me briefly describe how the challenge works before I share my experience with you. From September 21 through October 30, 2022, the challenge is to solve one common algorithm problem every day for ten days.

Today's algorithm problem was "Fizz Buzz Multithreaded." It is the 1195th algorithm challenge on "Leetcode.com".
Here is the question:
> You have the four functions:

> printFizz that prints the word "fizz" to the console,
> printBuzz that prints the word "buzz" to the console,
> printFizzBuzz that prints the word "fizzbuzz" to the console, and
> printNumber that prints a given integer to the console.
> You are given an instance of the class FizzBuzz that has four  functions: fizz, buzz, fizzbuzz and number. The same instance of > FizzBuzz will be passed to four different threads:
>
> Thread A: calls fizz() that should output the word "fizz".
> Thread B: calls buzz() that should output the word "buzz".
> Thread C: calls fizzbuzz() that should output the word "fizzbuzz".
> Thread D: calls number() that should only output the integers.
> Modify the given class to output the series [1, 2, "fizz", 4, >"buzz", ...] where the ith token (1-indexed) of the series is:

> "fizzbuzz" if i is divisible by 3 and 5,
> "fizz" if i is divisible by 3 and not 5,
> "buzz" if i is divisible by 5 and not 3, or

> i if i is not divisible by 3 or 5.


I'll now discuss my algorithm solving experience. Since the challenge began, this algorithm has proven to be the most challenging. I used the Python threading module for this task (The problem required multi threading). I added some conditionals to a function to determine when to utilize the acquire() and release() methods on a particular instance. Then, each thread of the "fizzbuzz" made a call to this function.

This task was completed in Python, took 34 milliseconds to execute, and consumed about 13.6 MB of memory.
Destructuring assignment in javascript
Tags: javascript, beginners
Published: 2022-09-26 20:48:01

what is **destructuring assignment** ?

> 😎 unpack values from arrays, or properties from objects

## 💎 Basic form
```javascript
const user = {
  name: 'kaziu',
  age: 87
}

let { name } = user
console.log(name) // "kaziu"
```

▼ What if I would change property of **name** ?
```javascript
const user = {
  name: 'kaziu',
  age: 87
}

let { name } = user

name = 'pikachu' // ⭐⭐ add it
console.log(user) // ❓❓❓❓❓❓❓❓❓❓
```

The answer is `user.name` shows `kaziu`. Changing `name` does not have effect to original object


## 💎 Explanation
### 1.
 When you assign object, variable name `user` allocates somewhere on memory, and has reference of this `object`

```javascript
const user = {}
```

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

### 2. 
then `name` property has its reference

```javascript
const user = {
  name: 'kaziu'
}
```

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

### 3. 
Now use **destructing assignment**
```javascript
const user = {
  name: 'kaziu',
  age: 87
}

let { name } = user // ⭐⭐ Now add it and then ...?
```

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

## 4.
change `kaziu` to `pikachu`, it doesn't have effect to original object

```javascript
const user = {
  name: 'kaziu',
  age: 87
}

let { name } = user
name = 'pikachu'

console.log(user.name) // 'kaziu'
```

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

## 💎 How about deep hierarchy object ?
```javascript
const user = {
  name: {
    first: 'kaziu',
    last: 'suzuki'
  }
}

let { name } = user
console.log(name) // { first: 'kaziu', last: 'suzuki' }

name.first = 'pikachu'
console.log(user)
// { name: { first: 'pikachu', last: 'suzuki' } }
// ⭐⭐ original object changes from `kaziu` to `pikachu` !!!
```

Because over second hierarchy, reference is the same as original object.
By the way, it calls `shallow copy`

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4fm8i3f0gtgoct0b8ugg.png)
Fire Sprinkler Systems
Tags: beginners, programming, tutorial, python
Published: 2022-09-26 21:16:12

A [fire sprinkler system ](https://plumbingadvice24.com/all-about-pex-pipe-pex-pipes-for-plumbing-what-is-pex-pipe-how-to-measure-pex-pipe-pex-pipe-installation-cost/)is an active fire protection method, consisting of a water supply system, providing adequate pressure and flowrate to a water distribution piping system, onto which fire sprinklers are connected.
https://plumbingadvice24.com/all-about-pex-pipe-pex-pipes-for-plumbing-what-is-pex-pipe-how-to-measure-pex-pipe-pex-pipe-installation-cost/
DAY 6 CODE CHALLENGE
Published: 2022-09-26 21:15:28

## **FIZZ BUZZ MULTITHREADED**
When I noticed JavaScript was not among the languages for today's challenge, I almost gave up but on a second thought, I decided to finish up the race as no knowledge was a waste. Today's challenge was all about Fizz Buzz Multithreaded and Python3 was used to solve this particular Challenge.

**PROCEDURE BY BARRIER**
Each every thread was apportioned its own loop 1 to n. The loops were advanced in sync using a Barrier whereby holding on for the four (4) threads to extend the barrier before unblocking all the threads. And at that juncture, the loop will carry on while the next number will now be processed by all the four (4) threads while the program will hold back for all the threads to reach the Barrier.

**OUTCOME** 


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d6sjnrpx9yt0lk58ww3l.PNG)
I've created a programming language...
Tags: go, programming, compiler, language
Published: 2022-09-26 20:17:20

Hello,
I'd like to share my recent project - a compiler for my own programming language called "Yup". It's implemented using LLVM 14 in Go. 

As of now, the language is quite primitive but more features are on the way. I've created some basic examples that show what you can do in yup: 
[examples](https://github.com/kamkow1/yup/tree/master/examples)

Here's a small example of yup code:
```
import "$std/io.bc";

fac(n: i32) i32 {
	if n == 0 {
		return 1;
	}

	return n * fac(n - 1);
}

main() i32 {

	var n: i32;
	scan_input("give me a number: %i", &n);
	fmt_print("%i! = %i", n, fac(n));

	return 0;
}
```

checkout the full repository ;) https://github.com/kamkow1/yup
Open Source Lab 3
Published: 2022-09-26 20:09:56

For the next update to my release 0.1 I first wanted to update my SSG based on the feedback I got from the release 0.1 assignment. I first decided to clean up my git repository and remove all the fluff inside of it that didn't need to be their i.e pychache files, output files, and test files. next I cleaned up my HTML by not making a paragraph tag every newline in the text file I would instead group them together until there was an empty line which i would make a new paragraph. After my fixes i needed to add two new features i decided to add HTML lang support and add code support in markdown where code ill write inside the blocks of ` will be formatted like code.

# Adding Language

[Adding language to HTML](https://github.com/P-DR0ZD/pdrozd-ssg/issues/10)

To do this i needed to add a new command line argument this required me to modify the start of my program where it reads commands. Then i needed to modify the file that writes the HTML by changing how the HTML tag is written by adding the lang tag then i added a default value for the parameter that is en-CA for English Canadian in case the user doesn't specify a language.

# Adding Code to Markdown

[Adding code to Markdown](https://github.com/P-DR0ZD/pdrozd-ssg/issues/11)

To do this i needed to figure out how to use python to get a substring of a string so i can separate the part of the string with the ` character. With this logic i was able to add the indentation feature from the previous lab as the logic between them is essentially the same which would allow me to now select a block a text and put a tag between them such as highlighting, underlining, bold etc.
Day 5/100: Epiphany Come To Life
Tags: webdev, react, 100daysofcode, devjournal
Published: 2022-09-26 19:44:34

Another Day, another restructure. An epiphany I got over the weekend inspired a restructure and add another React subsidiary onto the project. I enlisted the services of react-router-dom to help my epiphany come to life. 

The restructure sees the partition of my site. The site was really restrictive. After the past weekend, I realised that there were still many things I'll add and change in the future. The division allows for even more future growth and it'll be even better while troubleshooting.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/n758lcyyoxkki8fxasw8.png)
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uaerviiogzohig4ogyhp.png)
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fu58q5n68i1qgdbgswlb.png)
Our Dear Unicorn Friend is Going on Vacation
Tags: meta, design, ux
Published: 2022-09-26 19:25:35

We are making design adjustments to Forem ([the open-source codebase](https://github.com/forem/forem) that powers DEV and other communities).

We are removing the unicorn icon from the _current_ set of possible reactions, and making room for an indicator of how many comments there are in the discussion — alongside "like" and "bookmark".

There are a few drivers of this design decision:

- Members cannot easily view how many comments are in the discussion and easily scroll there.
- The unicorn, as it stands, is pretty confusing for a lot of folks.
- We want to build towards a more fun and expressive end state in terms of how these reactions work.

We are planning to re-institute the unicorn as a set of _customizable_ secondary reactions which can be unique to each Forem, and possibly change for fun from time to time.

Anticipate the final result being something like this, but open source and more funky!

![fb reactions](https://cdn.searchenginejournal.com/wp-content/uploads/2017/03/facebook-reactions.jpg)

***

As mentioned, the unicorn has caused a good amount of confusion, here are a few of the hundreds of posts on this subject.

{% embed https://dev.to/osde8info/devto-unicorn-confusion-1m2i %}

{% embed https://dev.to/randysims/what-are-the-post-reactions-3h5m %}

{% embed https://dev.to/saigkill/what-means-the-unicorn-response-cbj %}

Part of the fun of the unicorn is that it means nothing in particular, it's just there. **_However_**, we can have that fun without the clutter. And that is the plan.

**This change will go live later this week.**

Feel free to comment on some other reactions we may want to implement on DEV once we get to the "fully customized" state. 😇

***

### The unicorn will (eventually) be back and better than ever

![unicorn](https://media.giphy.com/media/l3978LHbIV5GAzRPG/giphy.gif)

Happy coding! 🦄
How can I measure Big O complexity in a Python method?
Tags: python, programming, algorithms, complexity
Published: 2022-09-26 18:58:27

Hi everyone! Thanks for reading.
I need to solve a problem where, first of all, I add certain number of integer values to a list called "values_added". After that, I need to implement a method called "build_stats" which prepare the data to be analyzed by another methods.
I have this portion of code which I need to be build in a Big O complexity equals to O(n):

```
def build_stats(self):
        """
        Function that generates the necessary statistics structure to be consumed
        through the "stats" object.
        :return: Stats object.
        """
        self.values_added.sort()
        for i, elem in enumerate(self.values_added):
            if elem not in self.values_stats:
                self.values_stats[elem] = {
                    'left': i,
                    'right': len(self.values_added) - i - 1,
                    'count': 1
                }
            else:
                self.values_stats[elem]['right'] = len(self.values_added) - i - 1
                self.values_stats[elem]['count'] += 1
        return Stats(self.values_added, self.values_stats)
```

I need to check if this method has a time complexity = O(n).
Thanks!
5 steps to change your career domain
Tags: career, domain, jobchange
Published: 2022-09-26 18:40:54

Many ask how can I change my current role to my desired role. It can be moving from Non-IT to IT or changing stream from one domain to other.

Being myself have done the transition twice
Operations -> Cloud
Cloud -> Devops

Sharing my 5 steps guide which worked for me.

1 : Figure one common skill that exist common in your current role and your desired role

If you are from Non-IT think on common grounds like leadership , management.

If on Tech you can take any overlapping skill

2: Once you have the key , search the same on linkedin to know what all options available for you in market

3: Now this can be overwhelming, a keyword "cloud" would lead you to several positions like

-> Go developer
-> Cloud Engineer
-> Devops
-> SRE
Now it's time to choose what you need

4: Jobdescription is the key.
- Read the description
- list down what is missing in you which market demands
- Focus on upskilling

5: Don't wait for you to be fully ready, Go ahead add the skills in your resume and start applying

Improvise yourself in the journey of interview. Check where you lag, what topic to focus and upskill

Best wishes to all who are in process to get into your desired job role!
The location of iOS simulator builds has moved
Published: 2022-09-26 18:29:00

## TL;DR
iOS Simulator builds are not somewhere underneath `~/Library/Developer/Xcode/DerivedData` anymore, but in `~/Library/Developer/CoreSimulator/Devices`.

## Simulator build for e.g. Meta/Facebook App review
If you build an iOS or Android app that integrates with the Facebook SDK, you need to have your app reviewed before being able to go live.

As part of this App Review process voor iOS, you have to submit a _simulator binary package_ of your app to Facebook.

Part of [the instruction](https://developers.facebook.com/docs/ios/create-a-simulator-build/) is to run the app in your simulator, and then look into `~/Library/Developer/Xcode/DerivedData folder`.

But, since XCode 14 this does not work anymore, and up until now the Facebook documentation is not up to date yet. 😱 So the whole day I've been looking for "Where does XCode (or Flutter command line in my case) drop my compiled app, that is run on my Simulator?".

As it occurs, that is `~/Library/Developer/CoreSimulator/Devices/<<hash of your device>>/data/Containers/Bundle/Application/<<hash of your app>>/<<name of target>>.app` 🎉

## Bonus; one-liner to get a Zipfile of the simulator build
How to get a zipfile of your simulator build, that you can send to Facebook right away?

* Run your app in the emulator
* Execute the following line in your shell:

```shell
ditto -ck --sequesterRsrc --keepParent `ls -1 -d -t ~/Library/Developer/CoreSimulator/Devices/*/data/Containers/Bundle/Application/*/*.app | head -n 1` ~/Desktop/your_app_$(date +"%Y%m%d_%H%M").zip
```

This will take the most recent app from underneath your `CoreSimulator` folder, puts it in the most small and optimized archive for Facebook and drops it at your desktop, while having a timestamp. Feel free to change this one-liner to your liking 😉

When having the zipfile on your desktop, it's smart to check if it's working before submitting to Facebook. 

To test the Zipfile:

- Extract the zip
- Install `ios-sim` if not done yet: `npm install -g ios-sim`
- Test your file with: `ios-sim launch --devicetypeid com.apple.CoreSimulator.SimDeviceType.iPhone-14 ~/Desktop/Runner.app`

Good luck! 👋
The App Extensions API Beta is Now Available!
Tags: bigcommerce, beta, bigcommercedeveloper, dev
Published: 2023-01-03 17:03:43

---
title: The App Extensions API Beta is Now Available!
published: true
date: 2022-09-26 18:15:44 UTC
tags: bigcommerce,beta,bigcommercedeveloper,dev
canonical_url: 
---

Before the App Extensions feature, the user experience for merchants didn’t feel as native as we wanted it to. We want apps on the BigCommerce marketplace to be able to achieve a user experience on par with our native features. This new feature is targeted at developers to build rich experiences that feel native to the merchant.

![](https://cdn-images-1.medium.com/max/1024/1*zgyVSELHc4BVVe65fsyong.jpeg)

Our app platform, to date, has restricted where apps can be used. There has been a sandbox where a merchant has to go into the apps menu, select the app they want to use, and then the app loads and you can make use of it. As a consequence of this, we see a lot of less-than-desirable user experiences when it comes to apps.

There’s a trend in our ecosystem where a lot of apps are essentially extensions to existing workflows within our existing ecommerce platform. We have a lot of rich integrations that are extending tasks like Order Management, Catalog Management, etc.

For example, if you use Order Management integrations today, you may have an experience where you do some of your order management in the BigCommerce Control Panel, some of it in an app, and that flow often feels clunky to the user.

**_We want to fix that!_**

Our first step to making this process easier is this feature, App Extensions, where we’re working to connect those dots. For example, if you’re already doing order management in the context of the orders, the apps that you use can essentially inject an integration point right next to the Order so they can add additional functionality right on top of that. The same functionality is available for Customers and for Products.

![](https://cdn-images-1.medium.com/max/1024/0*ONwQ8vXE2IKafmNZ)

### Who is this Beta for?

This beta is specifically geared towards:

- App Developers
- App Partners

### What’s included in the Beta?

By joining the App Extensions API beta, participating partners will be able to:

- Have the ability to integrate with the control panel, extending the native control panel features using third party apps and allowing the user experience to feel more native
- Manage Orders, Products & Customers directly within the flow of the native control panel
- Interact with 3rd-party apps directly within the product screens
- Integrate a CRM application within the native customer UI
- Move through workflows more seamlessly than ever before!

### I Want to Sign Up!

If this sounds like something you’re interested in being part of, please [complete this sign-up form](https://docs.google.com/forms/d/e/1FAIpQLScrKHsKV-yoBbl_TR9tK1KVND03E93XXoulgsaR1X1KLARjfA/viewform). The BigCommerce Product team will review your application, and if selected for the Beta, we will reach out with additional onboarding information.

* * *
#PowerPoint – Add Stock Videos to create amazing slides 🎥
Tags: englishpost, powerpoint, tip
Published: 2022-09-27 13:11:16

---
title: #PowerPoint – Add Stock Videos to create amazing slides 🎥
published: true
date: 2022-09-26 18:01:36 UTC
tags: EnglishPost,EnglishPost,PowerPoint,Tip
canonical_url: 
---

Hi !

I’ve been doing this for a while, and hey, a couple of days ago someone ask how to create a cool slide like this.

![](https://brunocapuano.files.wordpress.com/2022/09/microphone-for-podcast-demo.gif?w=853)

Super easy. In Powerpoint, open the menu [Insert / Video / from Stock].

![insert video from stock](https://brunocapuano.files.wordpress.com/2022/09/insert-video-from-stock.png?w=291)

Then select a video. Bonus here to filter and look for a video that can be used as slide title or similar.

![Insert stock video from a rotating microphone](https://brunocapuano.files.wordpress.com/2022/09/insert-stock-video-from-a-rotating-microphone.png?w=805)

And that’s it, now it’s time to use your amazing PowerPoint skills to create a great presentation!

![slide with embedded video in powerpoint](https://brunocapuano.files.wordpress.com/2022/09/slide-with-embedded-video-in-powerpoint.jpg?w=1024)

Happy coding!

Greetings

El Bruno

More posts in my blog [ElBruno.com](https://www.elbruno.com).

* * *
How to extend HTML elements with React
Tags: javascript, typescript, react
Published: 2022-09-26 17:58:26

Most of the work needed to create custom HTML elements that fit the design system of your company resides styling and adding your own props. So, let's say you have to create a custom `Button`, that should receive a `children` prop and should have DOM access via [ref](https://reactjs.org/docs/refs-and-the-dom.html). That's how you can do it:

```typescript
import { forwardRef } from 'react';

type ButtonProps = {
  loading?: boolean; // custom prop
} & React.PropsWithChildren<React.ComponentPropsWithRef<'button'>>;

const Button: React.FC<ButtonProps> = forwardRef(
  ({ loading, children, ...props }, ref) => {
    return (
      <button data-loading={loading} {...props} ref={ref}>
        {children}
      </button>
    );
  }
);

export default Button;
```

We use the [`PropsWithChildren`](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/d076add9f29db350a19bd94c37b197729cc02f87/types/react/index.d.ts#L822) generic interface that gives the `children` prop and receive `React.ComponentPropsWithRef<'button'>`, that passes all props that a [`button`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button) can receive.

Of course, you can change the interface [`ComponentPropsWithRef`](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/d076add9f29db350a19bd94c37b197729cc02f87/types/react/index.d.ts#L834) for [`ComponentPropsWithoutRef`](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/d076add9f29db350a19bd94c37b197729cc02f87/types/react/index.d.ts#L838) and drop the [`forwardRef`](https://reactjs.org/docs/forwarding-refs.html) function on the definition of your component (although, I do not recomend it - _refs_ may be useful later on your application):

```typescript
type ButtonProps = {
  loading?: boolean; // custom prop
} & React.PropsWithChildren<React.ComponentPropsWithoutRef<'button'>>;

const Button: React.FC<ButtonProps> = ({ loading, children, ...props }) => {
  return (
    <button data-loading={loading} {...props} ref={ref}>
      {children}
    </button>
  );
};

export default Button;
```

You may, even, drop the interface `PropsWithChildren`, but on doing that, you'd have to implement the `children` prop by yourself:

```typescript
type ButtonProps = {
  loading?: boolean; // custom prop
  children?: React.ReactNode;
} & React.ComponentPropsWithoutRef<'button'>;

const Button: React.FC<ButtonProps> = ({ loading, children, ...props }) => {
  return (
    <button data-loading={loading} {...props} ref={ref}>
      {children}
    </button>
  );
};

export default Button;
```

Want more? Check the live implementation on [StackBlitz](https://stackblitz.com/edit/vitejs-vite-warc15?file=src%2Fcomponents%2Fbutton.tsx&terminal=dev)