teleren/devto huggingface dataset:
zsh: command not found: brew
Tags: git, setup, beginners, vscode
Published: 2024-03-10 22:13:24

My first time setting up git on my Macbook was a few years ago. My second time was this week, and I faced the same error I faced the first time, except I didn't take note of how I fixed it. So I am writing this short article, hoping that the next time I face this issue again, I know where to find a possible solution. 

So basically, I'm writing this for me. However, if anyone else faces this error and this helps them too, then that is a bonus.

---


## **Setting up git on a new laptop**

**1.** Go to the git download page [here](https://git-scm.com/downloads).

 Download the appropriate version according to your device.

 Since I am using a Macbook, I download the version for Mac.

 To download, first install homebrew by running in your 
 terminal:

```
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
```

**2.** According to the documentation, after installing homebrew, in your terminal, run:

```
brew install git
```
Except, once I run this, it throws an error:
`zsh: command not found: brew`

However, running `git --version` confirmed I had git installed:

```
git --version
```
 
`git version 2.39.3 (Apple Git-146)`

It became clear that homebrew was not added to the PATH variable during installation, therefore shell could not locate the homebrew executable.

To rectify this, add homebrew to the PATH variable by doing the following:

- In your terminal, run:

```
export PATH="/opt/homebrew/bin:$PATH"
```

Hit the **Enter** key.

- Run: 

```
echo $PATH
```
 in your terminal to confirm if homebrew was successfully added to the PATH variable.

This returns a list of all the executables found on your laptop. Confirm that homebrew is present in the list. If it is, your terminal will now be able to locate homebrew.



**3.** Now, in your terminal, run `brew install git` again and hit **Enter**

```
brew install git
```
 

Wait patiently for the download to complete.

You have successfully installed git on your laptop. You can now continue on to set up git in VS Code. Check out [this documentation](https://code.visualstudio.com/docs/sourcecontrol/intro-to-git#:~:text=Install%20the%20GitHub%20Codespaces%20extension,from%20the%20GitHub's%20Codespaces%20site.) on how to do that.
Developing a Node CLI App in an NX monorepo
Tags: typescript, node, cli, nx
Published: 2024-03-10 21:55:53

Bare bones setup. Using NX version 17.

## Create the app

```bash
npx nx g @nx/node:app --name cli --directory packages/cli --framework none --e2eTestRunner none --unitTestRunner none
```

## Install Commander

```bash
npm i -S commander @commander-js/extra-typings
```

## Configure targets

Modify the default build target's development configuration to include `"watch": true`.

```json
{
  "name": "cli",
  "$schema": "../../node_modules/nx/schemas/project-schema.json",
  "sourceRoot": "packages/cli/src",
  "projectType": "application",
  "targets": {
    "build": {
      "executor": "@nx/esbuild:esbuild",
      "outputs": ["{options.outputPath}"],
      "defaultConfiguration": "production",
      "options": {
        "platform": "node",
        "outputPath": "dist/packages/cli",
        "format": ["cjs"],
        "bundle": false,
        "main": "packages/cli/src/main.ts",
        "tsConfig": "packages/cli/tsconfig.app.json",
        "assets": ["packages/cli/src/assets"],
        "generatePackageJson": true,
        "esbuildOptions": {
          "sourcemap": true,
          "outExtension": {
            ".js": ".js"
          }
        }
      },
      "configurations": {
        "development": {
          "watch": true
        },
        "production": {
          "esbuildOptions": {
            "sourcemap": false,
            "outExtension": {
              ".js": ".js"
            }
          }
        }
      }
    },
    "lint": {
      "executor": "@nx/eslint:lint",
      "outputs": ["{options.outputFile}"]
    }
  },
  "tags": []
}
```

## Write a program

```ts
// packages/cli/src/main.ts
import { program } from "@commander-js/extra-typings";

program.command("list").action(async () => {
  const things = ["one", "two", "three"];
  things.forEach((thing) => console.log(thing));
});

program.parse();
```
## Start the development server

```bash
npx nx run cli:build:development
```

This will watch for changes and recompile.

## Run the program

```bash
node dist/packages/cli/main.js list
```

Output:

```txt
one
two
three
```

## Grow your CLI App from here

Visit the [Commander.js reference](https://www.npmjs.com/package/commander).
My webhosting business journey
Tags: webhosting, cpanel, whmcs
Published: 2024-03-10 21:27:49

---
title:My webhosting business journey
published: true
description: Like i guess it happens with many devs,i found myself owning a ton of webhosting resources surplus.Let's try to make use of them in away that benefits as many as possible of fellow devs.
tags: webhosting,cPanel,whmcs
# cover_image: ![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/e7j7dze338wbr6rowr6n.png)
# Use a ratio of 100:42 for best results.
# published_at: 2024-03-10 10:45 +0000
---
As a seasoned developer with over 25 years of experience, I've encountered numerous clients whose web projects demand specialized hosting features, maintenance, or integrated development solutions. It's a common scenario for many developers, leading us to venture into providing hosting services alongside our development work.
What started as a supplementary endeavor alongside my primary development work soon evolved into a substantial operation in its own right. Over the decades, this venture grew organically, mirroring the trajectory of my main job and eventually asserting itself as a standalone business entity.
With an abundance of resources and experience at my disposal, I've decided to open them up through [FriendlyServers.com](https://friendlyservers.com), primarily for fellow developers. This platform serves as a hub where I aim to provide top-notch services at incredibly affordable rates, such as cPanel hosting starting at $1.5 per month, along with various other package deals.

I'm also open to personalized solutions tailored to specific needs and welcome collaboration opportunities for expanding our range of services. While I recognize that the web hosting industry is competitive, I firmly believe in leveraging existing resources to benefit both users and providers alike.

It's worth noting that our servers are currently located in Europe. Feel free to explore FriendlyServers.com, and I value any feedback or suggestions you may have.

Thank you
Not just another guide to coding.
Tags: beginners, programming, coding, tutorial
Published: 2024-03-10 18:55:06

So you want to start coding but don't know where to start?
Well, I am here to tell you how you can become a programmer and lose your social interaction skills. Remember, you either get both or none, the choice is yours! 

So am I going to tell you that you should do this course and that course?

<img width="100%" style="width:100%" src="https://media.giphy.com/media/v1.Y2lkPTc5MGI3NjExbHRudDJueGZ4MXR2NjhkMnFrcnZ5Z2Mwbm95YTFsbWJjaHdhbzdtNSZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9Zw/nR4L10XlJcSeQ/giphy.gif">


Nope, not at all.
I am actually here to propose a different way of learning!
Behold, "LEARN WHILE YOU DO IT" or, in simpler terms, interactive learning or hands-on learning.

## How do you do it?

Here are the steps:
1) Get a glass of water.
2) Find out what you want to learn.
3) Find a simple use case for that.
4) Start doing it.

And if you ever need any help, the internet is at your service!

### You want to learn Python?
-> Start by making a simple calculator in Python!

### You want to learn Node.js?
-> Make a Discord bot _(this's how I learned it)_

### Want to learn web development?
-> Make a goddamn portfolio website _(again, that's how I learned it)_

and I could go on and on and on..

The thing is, if you try to "learn"  or in many people's case, memorize coding, all you will be is a monkey who knows to do some sort of hand and leg movement (dance) to get treats. Does the monkey know how to dance? No. Is he dancing? Yes!

I hope you get my point. 

Also, writing code down to learn it isn't going to do you any good either.
You can't learn something using pen and paper, which is only used digitally. You gotta get in there and mash that keyboard.

## Talk to other coders!
Yes, I mentioned you would lose your social interaction skills, but that was obviously a joke.
Or was it?
Anyway, you should talk with other people tell them what you have understood, and they will clear up your misunderstandings, which there will be plenty of, trust me. And also guide you along your journey.

##Teach others or just yourself!
This is a real thing and I have experienced this myself. If you teach someone something, your understanding of that subject or concept gets better! This is because to teach someone something they don't know, you need to break it down into simpler pieces for them to understand.
And the best thing is you don't need someone to be sitting in front of you listening to your gibberish about how it is easier to write "hello world" in Python rather than in any other language.
You have yourself!
Teach yourself or just act like you are teaching someone, sure your roommate might think you are possessed or something...

<img width="100%" style="width:100%" src="https://media.giphy.com/media/v1.Y2lkPTc5MGI3NjExc3I5Z2sxd3FhOGk1YTJmOHB2emdldjFtb3Q5a2cxaG5sMXBxeTd3dSZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9Zw/xT9KVjBI3W2283URdm/giphy.gif">

but it's worth it!

Come on now, shoooo!
Come back to thank me later :)
Im now hiring
Tags: gamedev, python
Published: 2024-03-10 20:02:06

I'm hiring for a collaborator to help me code a website for my individual company. This is for free and temporary sorry but I prefer to work alone. I also need some one to teach me pixel art if you look at the cover image its not my best but I did what I could. I also need someone to teach how to set up a business I never have worked with it before thank you. Contact me for the website stuff for that and you know the rest.
Beyond Basic Validation: Elevating Your Form Data Handling Strategy.
Tags: webdev, javascript, react, frontend
Published: 2024-03-10 19:02:25

## Intro

Welcome back, everyone. In this blog, we will be talking about what is validation, how it is done at the front end, what tools are used and why should we validate at the front end.

## What is validation?

Data validation is the process of checking the structure of the data before it is used anywhere in the project. In validation, we already have the structure of the data ready with us and we just check whether the data we have received from the user is matching our structure or not.

## Why should we do data validation?

Whether it be front end or back end the data validation is one of the most important point part. With the help of data validation one can make sure that the data we are sending from frontend to the backend is in our desired format or not and if it is not in our desired format it won't be able to make it to the backend and it will throw some kind of error. At the same time in the back end when we receive any kind of data first we check the structure means we validate the data which we have received from the front end and if it matches our desired structure only then we proceed further.

## How validation is done on the front-end side?

To do data validation on the front-end side there are various libraries available like yup, zod, etc.
In this blog, we are gonna use Yup for code examples but you can use the library of your own choice.

---


We can install yup in our react or any other front-end project by running the following command in the terminal

```npm install yup```

after installing the Yup library we can get started by importing a few things from it as shown in the example below.


![Image of code sample demostrating the YUP validation](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jcwvpd4zhunmyjyjku1i.png)

in this example in line no. 4, we are creating a structure of how our data should look like. This structure will be used in the future to validate the input data.

Yup has a very easy-to-understand syntax that anyone can easily understand by the ` .object ` property we are telling yup that our data will be an object, and with ` .required() ` we are telling that it is a required string. In this schema example we are defining that we this will be the type of object that will have the name as required string, email with string type email and required, and so on. 

After defining our data with help of this Yup schema we can also validate the data with help of ` .validate() ` method, then if there will be any error with validation we can simply get that with help of a catch block.

This was a simple explanation how we can validate data on the front-end side.
Instagram and Youtube Downloader, Converter
Published: 2024-03-10 19:08:25

### Ally Downloader
A mobile application for extracting and downloading videos, images, audios from various social media platforms.
 
Hello, I'm Emre a self taught developer from Türkiye. I'm 19 and I've been coding since I'm 12. I always thought creating my own website/application would be hard and wouldn't worth my effort. So I started freelancing at the age of 16 and helped lots of startups build and publish their Websites, Rest API's, Mobile Applications etc. A week ago, I decided to create my own mobile application for downloading videos/audios from Youtube and Instagram (more platforms in future). Normally I use React Native for client side code, Node.js or Python for server side code. But this time, I considered learning something new and wrote the client side in Kotlin (Jetpack Compose) and server side in Golang (Gin framework). I will soon be publishing the app to Google Play Store. I know, there are lots of similar apps in this concept so I wanted to hear your thoughts on the app and the concept in general. 

P.S: I used yt-dlp for Youtube and chromedp for Instagram.

Thank you in advance :)


![Home Page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/a5sqnbro4yv23qpmb4k1.png)
![Home Page Info Section](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6qoe8rzpj9qwk2y71ql9.png)
![Downloads Page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bcvg750aqz5szmi1oiiu.png)
![Download Details Page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ol3spsvo23xsz2e1o65p.png)
HELP ME CONNECT WITH BRUNOE QUICK HACK SERVICE
Tags: webdev, tutorial, python, productivity
Published: 2024-03-10 18:22:35

Ever lost your Bitcoin to a sneaky cyber thief? Fear not, as Brunoe Quick Hack Crypto recovery service swoops in with their magical recovery spells to bring back your precious digital gold. Their success stories of reclaiming stolen Bitcoin funds will make you believe in crypto miracles. Your best bet for magically recovering misplaced Bitcoin holdings is the Brunoe Quick Hack Crypto Recovery Service. They guarantee investors' piece of mind by providing proactive and creative methods for recovering your digital assets. Safe asset management is essential in the realm of cryptocurrencies to protect your Bitcoin assets. Brunoe Quick Hack Crypto Recovery Service offers professional advice for a worry-free cryptocurrency experience because it recognizes the importance of taking preventative actions to safeguard your funds. The irreversible nature of Bitcoin transactions means that once lost, your funds may be gone forever. The impact of irretrievable Bitcoin loss can be devastating, underscoring the importance of proactive asset protection strategies. To recover lost Bitcoin assets, Gmail/ brunoequickhack."AT  GMAIL DOT com /"Crypto recovery service uses advanced equipment teamed up with understood knowledge. Their commitment to client satisfaction and proactive approach establish them as a reliable partner in the digital asset recovery space. With Brunoe Quick Hack Crypto recovery service by your side, bid farewell to sleepless nights worrying about the safety of your Bitcoin assets. What APP + (1) [705. /784. 26//35]
 Their proactive solutions not only secure your funds but also provide you with the peace of mind that even Dumbledore would envy. Call Brunoe Quick Hack crypto recovery service on brunoequickhack." com

Thanks,
Shearl.
Ahh don't know what to entitle it
Published: 2024-03-10 18:01:45

It has been some rough days for me , wish i just turn one afternoon so big that i can get the profit of a month but lack of customers won't get away from me. I am just a bit bucks away from purchasing the stall but will have to keep it in mind that storing something for a nice rent apartment will be great , it ain't good sleeping on the rough rock.
Typescript Arrays
Tags: typescript, array, javascript, webdev
Published: 2024-03-10 12:27:56


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


In TypeScript, arrays are considered to be collections of single, “generic” types of values. All elements must be of the same type of data as prescribed in the array definition.

## 1. Defining an array
Array types can be inferred during the initialization of a new array.

In this example, the vowels array is inferred to consist of elements of type string:

```
const vowels = ['a', 'e', 'i', 'o', 'u'];

vowels.push('y'); // Ok

vowels.push(7);
// Error: Argument of type 'number' is not assignable to parameter of type 'string'.
```
Arrays can also be defined with the “generic” type of its elements already preset in two ways:
```
const vowels: string[] = ['a', 'e', 'i', 'o', 'u'];

// alternate way using Array class
const altVowels: Array<string> = ['a', 'e', 'i', 'o', 'u'];
```

## 2. Array Types
An array type consists of the type of values inside the array followed by square brackets [].

Arrays without any initial contents may be declared as that type to tell TypeScript what will later go into them.

In this example, dates doesn’t initially include a value, so declaring it as Date[] tells TypeScript what’s allowed in it:

```
const dates: Date[] = [];

dates.push(new Date('2021-12-1994')); // Ok

dates.push(10241995);
// Error: Argument of type 'number' is not assignable to parameter of type 'Date'.

```



## 3. Array Methods (Built-in):

TypeScript inherits JavaScript's built-in array methods.
Common methods include:
- push() - Add element(s) to the end.
- pop() - Remove and return the last element.
- shift() - Remove and return the first element.
- unshift() - Add element(s) to the beginning.
- concat() - Merge two or more arrays.
- slice() - Extract a section of an array.
- map() - Create a new array with transformed elements.
- filter() - Create a new array with elements passing a test.
- reduce() - Reduce an array to a single value.
- Many more! (Refer to JavaScript documentation for details)


## 4. Generic Arrays
Generics allow creating reusable array types that work with various data types.
Use angle brackets <> to specify the generic type placeholder.
```
function identity<T>(arr: T[]): T[] {
  return arr;  // Function works with any array type (T)
}

let numbers: number[] = identity([1, 2, 3]);
let colors: string[] = identity(["red", "green"]);

```


## 5. Advanced Array Features
Readonly Arrays: Use readonly keyword to create arrays whose elements cannot be changed after initialization.
Tuple Types: Define arrays with specific element types and fixed length at compile time.
```
let fruits: readonly string[] = ["apple", "banana"];  // Readonly array

let person: [string, number] = ["John", 30];  // Tuple (string, number)
```


## 6. Utility Types:

Explore utility types like Partial<T>, Pick<T, K>, for advanced array manipulation scenarios.
Navigating the Web Layout Wonderland: A Tale of CSS Positioning
Tags: webdev, css, tutorial, learning
Published: 2024-03-10 17:43:30

**Introduction:**
Picture this: you're embarking on a journey through the vast landscape of web development, and your compass for this adventure is CSS positioning. As we traverse the terrain of HTML and CSS, we encounter the dynamic duo - `position: absolute` and `position: relative`. Brace yourself for a story that demystifies these positioning wizards, making them not just tools but trusted companions in crafting captivating web layouts.

**Chapter 1: The Origins of Relative – Your Trusty Guide:**
Our journey begins with `position: relative`, the seasoned guide of the CSS positioning realm. Like a compass pointing north, `relative` allows elements to maintain their natural flow while offering a reference point for absolutely positioned children.

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

In our tale, the parent div, with its `position: relative`, becomes the anchor for its absolutely positioned child. The child, guided by its parent, dances into place at the top left, bringing harmony to the layout.

**Chapter 2: Absolute – The Bold Explorer:**
Meet `position: absolute`, the bold and adventurous explorer of our story. This positioning maestro breaks free from the regular flow, positioning itself relative to its closest positioned ancestor. It's a rebel, but with a purpose.

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

In this chapter, our absolute explorer positions itself at the center of its relative parent. The `transform` property ensures perfect alignment, making it the focal point of our layout expedition.

**Chapter 3: The Dance of Fixed and Sticky – Allies in Positioning:**
As our journey unfolds, we encounter two more companions: `position: fixed` and `position: sticky`. These allies serve different purposes – fixed stays fixed in the viewport, while sticky knows when to switch from relative to fixed based on scroll behavior.

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

In this chapter, our fixed companion stays put at the top right, while the sticky one elegantly adapts its position, maintaining a 10-pixel distance from the top. Together, they add versatility to our layout toolkit.

**Conclusion: The Positioning Chronicles – Crafting Masterpieces:**

As our tale concludes, we've unraveled the secrets of CSS positioning, turning them from abstract concepts into trusted companions. `position: absolute` and `position: relative` guide us through the layout wilderness, while `fixed` and `sticky` allies offer their unique strengths.

In the ever-evolving world of web development, understanding these positioning techniques equips you to craft layouts that are not just functional but also visually enchanting. So, fellow developers, may your journey through the realm of CSS positioning be filled with creativity and the joy of building web wonders!