teleren/devto huggingface dataset:
How to copy table data easily with this Chrome Extension
Tags: opensource, extensions, chrome, browserextensions
Published: 2023-12-26 23:29:57

Have you ever found yourself frustrated with the time-consuming task of highlighting and copying large sets of data from HTML tables? 

It's a common scenario where you painstakingly select rows and columns, only for a slight slip of the mouse to ruin your progress, forcing you to start over. This not only eats into your valuable time but can also lead to fatigue-driven errors. 

Enter the Table Data Selector, a Chrome extension that, with just a simple right-click, this tool enables you to copy the table contents, eliminating the risk of mistakes and saving you from the tediousness of manual selection.


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

For more detailed insights, visit the [GitHub repository](https://github.com/gbti-labs/chrome-extension-copy-table-data) of Table Data Selector.

## Follow GBTI for more

Thanks for reading! If you like our content, please consider following us!

[Twitter/X](https://twitter.com/gbtilabs) | [GitHub](https://github.com/gbti-labs) | [YouTube](https://www.youtube.com/channel/UCh4FjB6r4oWQW-QFiwqv-UA) | [Dev.to](https://dev.to/gbti) | [Daily.dev](https://dly.to/zfCriM6JfRF) | [Hashnode](https://gbti.hashnode.dev/) | [Discord](https://gbti.io)
Terraform : Count,count.index,conditional expressions
Tags: terraform, iac, aws, azure
Published: 2023-12-26 23:16:11

**1.Overview of Count:**
The count parameter on resources can simplify configurations and let you scale resources by simply incrementing a number.

Let’s assume, you need to create two EC2 instances. One of the common approaches is to define two separate resource blocks for aws_instance.

```
resource "aws_instance" "myfirstec2" {
    # Changed AMI id based on the region
    ami = "ami-0721c9af7b9b75114" 
    instance_type = "t2.micro"
}


resource "aws_instance" "mysecondec2" {
    # Changed AMI id based on the region 
    ami = "ami-0721c9af7b9b75114" 
    instance_type = "t2.micro"
}


```
With the count parameter, we can simply specify the count value and the resource can be scaled accordingly.

```

resource "aws_instance" "myfirstec2" {
    # Changed AMI id based on the region
    ami           = "ami-0721c9af7b9b75114" 
    instance_type = "t2.micro"
    count         = 2
}
```

**2.Count Index** : In resource blocks where the count is set, an additional count object is available in expressions, so you can modify the configuration of each instance. 

This object has one attribute:

count.index — The distinct index number (starting with 0) corresponding to this instance.
**Some of the challenges with Count Parameter:**

With the below code, terraform will create 2 IAM users. But the problem is that all will have the same name.
```
resource "aws_iam_user" "iam_user"{
    name = "financeuser"
    count = 2
}
```
count.index allows us to fetch the index of each iteration in the loop.

```
resource "aws_iam_user" "iam_user" {
    name = "financeuser.${count.index}"
    count = 2
}
```

**3.Conditional Expressions:**
A conditional expression uses the value of a bool expression to select one of two values.

Syntax of Conditional expression:

condition ? true_val : false_val

If the condition is true then the result is true_val. If the condition is false then the result is false_val.

Let’s assume that there are two resource blocks as part of terraform configuration.

Depending on the variable value, one of the resource blocks will run.
If the variable is_test is true  then dev environment 
                is_test is false then prod environment

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


```
#Conditional.tf

provider "aws" {
  region     = "us-west-2"
  access_key = "YOUR-ACCESS-KEY"
  secret_key = "YOUR-SECRET-KEY"
}

variable "istest" {}

resource "aws_instance" "dev" {
   ami = "ami-082b5a644766e0e6f"
   instance_type = "t2.micro"
   count = var.istest == true ? 3 : 0
}

resource "aws_instance" "prod" {
   ami = "ami-082b5a644766e0e6f"
   instance_type = "t2.large"
   count = var.istest == false ? 1 : 0
}
	Terraform.tfvars

istest =true
```

```
#terraform.tfvars
istest =true

```
Conclusion:
Discussed about data types and variables, variable files in terraform.

If you like my blogs, please like and any suggestion give comments and follow me in dev.to and linked in https://www.linkedin.com/in/srinivasuluparanduru/ for more updates on terraform certification
Handling asynchronous operations in JavaScript
Tags: javascript, webdev, node, async
Published: 2023-12-26 22:46:20

Handling asynchronous operations in JavaScript is a fundamental skill, and there are several ways to manage it, including using callbacks, promises, and the async/await syntax. 

**1. Callbacks**
Callbacks are functions that are passed as arguments to other functions and are executed after the completion of an operation.

Example of Callbacks:

```javascript
function fetchData(url, callback) {
    // Simulating an asynchronous API call
    setTimeout(() => {
        callback('Data from ' + url);
    }, 1000);
}

fetchData('https://api.example.com', function(data) {
    console.log(data); // Output after 1 second: Data from https://api.example.com
});
```
In this example, fetchData simulates fetching data from a URL. Once the data fetching is simulated (after 1 second), the callback function is called with the data.

**2. Promises**
Promises are objects that represent the eventual completion or failure of an asynchronous operation. They can be in one of these states: pending, fulfilled, or rejected.

Example of Promises:

```javascript
function fetchData(url) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve('Data from ' + url);
        }, 1000);
    });
}

fetchData('https://api.example.com')
    .then(data => {
        console.log(data); // Output after 1 second: Data from https://api.example.com
    })
    .catch(error => {
        console.error(error);
    });
```

In this example, fetchData returns a promise that resolves with the data after 1 second. .then() is used to handle the resolved data, and .catch() is for handling any errors.

**3. Async/Await**
Async/Await is a syntactic feature of JavaScript that allows you to write asynchronous code in a more synchronous-looking manner. It's built on top of promises.

Example of Async/Await:

```javascript
async function fetchData(url) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve('Data from ' + url);
        }, 1000);
    });
}

async function main() {
    try {
        const data = await fetchData('https://api.example.com');
        console.log(data); // Output after 1 second: Data from https://api.example.com
    } catch (error) {
        console.error(error);
    }
}

main();
```
In this example, fetchData is an asynchronous function that returns a promise. In the main function, await is used to wait for the promise to resolve, and try...catch handles any errors.

**Summary**

**- Callbacks** are the traditional way to handle asynchronous operations but can lead to complex code structures known as "callback hell".
**- Promises** provide a cleaner and more manageable way to handle asynchronous operations and are widely used in modern JavaScript.
**- Async/Await** makes your asynchronous code look and behave a bit more like synchronous code, which can make it easier to understand and maintain.

Each method has its use cases and understanding all three is crucial for a proficient JavaScript developer.
Autenticação 🔐
Tags: tutorial, programming, laravel, beginners
Published: 2023-12-26 22:32:39

## Autenticação
Vamos acessar a aba de autenticação da documentação:[https://laravel.com/docs/10.x/authentication](https://laravel.com/docs/10.x/authentication) que vai nos instruir a usar um starter kit, o primeiro citado é o Laravel Breeze, então vamos usá-lo:

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

O principal starter kit a ser citado é o Laravel Breeze que conta com diversos recursos incluindo Tailwind CSS para nosso frontend, então vamos usá-lo [https://laravel.com/docs/10.x/starter-kits#laravel-breeze-installation](https://laravel.com/docs/10.x/starter-kits#laravel-breeze-installation):

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ypr287vx0289pgygpeos.png)
`composer require laravel/breeze --dev`
`php artisan breeze:install`

Vamos usar o Livewire:
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hw3zss8p42r0kccguc9x.png)

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

Vamos escolher o PHPUnit para futuros testes unitários:
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rfafpo9h2kgr2a5r126n.png)

`php artisan migrate`
`npm install`
`npm run dev`
Agora temos 2 novos links, vamos nos registrar e logar:
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8x75i1yvwveb3i7f3xq0.png)

Já temos as funcionalidades de registro, login e reset de senha:
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6j87kz0ykqhuz25sfote.png)
Exploring Partyrock, an Amazon Bedrock playground to build generative AI applications quickly
Tags: partyrock, generativeai, amazonbedrock, promptengineering
Published: 2023-12-26 22:20:38

PartyRock, an Amazon Bedrock Playground is for educating users on how to build with generative AI and gain intuition on prompt engineering. It is easy to experiment hands-on with prompt engineering in an intuitive and fun way.
It is making building with generative AI accessible to everyone.
you can initially go to this link - https://partyrock.aws/ and get logged in or signed up if its your first time.


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

Access to partyrock is not through AWS management console but through a web based UI for which you do not require an AWS account. You can take a quick tour of the website of what all it can do for you. if you click **build your own app**, you will be able to start creating your first app using partyrock.


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

You can describe what you would like to build here and click the generate app to build an app.


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

I built a 5 day gym routine recommender that recommends me warm up, main exercises & cool down for each day. I am able to customize my application based on my needs within few seconds. How cool is that!


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/622zcxq3did8gb9nzhvq.png)
I can now also tweak my app using edit or remix using other apps. Bedrock will help us edit the app and re build it for us.

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


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

Once I entered the goal and experience level, Partyrock recommended me a routine with a 5 day split routine which is super useful. I can tweak the app now based on my needs. Once the app is ready to be published, you can share it with the link provided. 
Partyrock is very easy to use Amazon Bedrock playground. The best part is one does not require coding experience. Partyrock uses Amazon Bedrock's generative AI Foundation Models (FM). PartyRock the name has been derived from Amazon Bedrock's offering for business users which is an alternative to Microsoft's Copilot Studio.
Partyrock is available for free to use for a limited time without the need of a credit card. Everyone can build AI apps with partyrock.
Here is a link to the generated app - https://partyrock.aws/u/neerajiyer/s8mIMnGNq/5-Day-Gym-Routine-Recommender
Milestone Achievement: Debuting My Initial Two Projects on GitHub!
Published: 2023-12-26 21:24:37

Hello DEV Community!

I'm thrilled to share a significant accomplishment on my coding journey. Today marks the publication of my first two projects on my GitHub account, a moment that symbolizes hard work and dedication paying off. 🚀

Embarking on this coding adventure has been an enriching experience, filled with learning and experimentation. These projects are a tangible representation of the progress I've made and the skills I've acquired.

I invite you to explore the codes on my GitHub profile, where I've documented the process and details behind each project. Your constructive feedback is not only welcomed but highly valued, as it contributes to my growth as a developer.

Here's the link to my GitHub profile for you to delve into the projects: https://github.com/GiuseppeDeveloper

I'm enthusiastic about the prospect of connecting with fellow developers, sharing insights, and collectively advancing our coding skills. Let's continue this journey of learning and exploration together!

#GitHub #CodingProjects #DeveloperJourney #LearningToCode #OpenSource #MilestoneAchievement
Fillable, Guarded in Laravel ! What’s the difference
Tags: laravel, php, webdev, backend
Published: 2023-12-26 21:11:54

In Laravel, both `$fillable` and `$guarded` are attributes used in Eloquent models to control the **mass assignment** of **attributes**. 
**Mass assignment** in Laravel refers to the ability to set multiple attributes of a model at once using an array of data.

## **Fillable :**

`$fillable` is an array that specifies which attributes can be mass assigned. These are the attributes that are allowed to be set using the **create** or **update** methods. 
Any attributes not included in the fillable array will be ignored during mass assignment.

```
class YourModele extends Model
{
        protected $fillable = [
        'name',
        'email',
        'password',
    ];
}
```
in this example attributs `$name`, `$email`, `$password ` will be mass assigned. 

If you wish to allow all attributes of your model to be mass-assigned, you can use the wildcard character * in the $fillable declaration. However, it's essential to understand the security implications of this approach.

```
class YourModele extends Model
{
    protected $fillable = ['*'];
}
```

## **Guarded :**

`$guarded` is also an array but it works in the opposite way. It specifies which attributes are not allowed to be mass assigned. Any attributes not included in the guarded array will be considered safe for mass assignment.

```
class YourModele extends Model
{
        protected $guarded = [
        'name',
        'email',
        'password',
    ];
}
```
in this example attributs 
```
$name, $email, $password 
```
will not be mass assigned. 

If you don't want all your model's attributes to be mass assigned, you can use the wildcard * in the $guarded declaration.

```
class YourModele extends Model
{
    protected $guarded = ['*'];
}
```

## **The main difference**

**The main difference** between `$fillable` and `$guarded` is the approach they take to define the attributes that can be mass assigned. `$fillable` explicitly states the allowed attributes, while `$guarded` explicitly states the disallowed attributes.


## **why it's important to use `$fillable` or `$guarded`**

It is important to use either `$fillable` or `$guarded` to protect against mass assignment vulnerabilities, which can lead to security risks. By specifying the attributes that can or cannot be mass assigned, you have more control over the data that is being assigned to your models.
I made a reverse job board for developers
Tags: ruby, rails, tailwindcss, hotwire
Published: 2023-12-26 21:02:58

Hey everyone,

I am Zain, an indiehacker from Pakistan.

  
I was laid off from my job last year and was frustrated to find another job. I applied on several jobs on dozens of job boards only to be ghosted or rejected.
  
This experience made me realise how much time and energy it takes, how many times we need to write the cover letters and manually add our details every time even when we upload our resume, so I decided to change this.

---


That's why I built devtree, where you are in control. For this project I used what I know the best, `Ruby on Rails` and took a chance to learn `Hotwire` and `tailwindCSS` and let me tell you its been worth it. On top of `tailwind` I used `daisyUI` to get component based classes.


I bootstrapped my startup so cost savings is fundamental, I relied on heroku's free tier but that was not an option since they moved to paid only plans. So, I searched for an alternative and found [fly.io](https://fly.io).

I run three instances their which includes my web app, background worker and database all for free.

---

The app allows the developers to choose a username, add projects/links, build a testimonial page, add skills, work preferences and personal details. Using this data they can create a portfolio or proof of work site which is easily shareable using their usernames as it contains all their work in one place.


![zain devtree profile](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vo0g00jb2c9d2e8htb2n.png)

If you are a developer and tired of applying to every other job and still getting no results, head on to devtree.

---

I will write more about technical stuff in separate posts about different design decisions and integrations. So, stay tuned.


👉🏻 check the app here: [devtree](https://devtree.app?utm_source=devto)
👉🏻 you can find me here: [devtree/zain](https://devtree.app/zain?utm_source=devto)
How to make resources more reusable in Laravel
Tags: laravel, webdev, php, programming
Published: 2023-12-26 21:02:42

When working with **Laravel API**, we utilize resources to manage the process of returning collections in each response.

But, How can we do this with a **single resource file** to avoid messy file structures?

And how can we make our resources **more reusable for each operation**, especially in something like ( index & show ),

We can differentiate between inside responses using this route name, 

So If we don't want to show all attributes in the index, we can hide them from the index resource. 

**Here's our example:**

- We defined our route in the `api.php` code:

```php
Route::apiResource('/posts', ApiPostController::class, ['only' => ['index', 'show']]);
```

- Now in our resource, We put a condition when the request coming from a route named `posts.show`:

```php
        $routeShowPost = $request->routeIs('posts.show');
```

And here's our PostResource, with the power of `mergeWhen()`, we can show or hide the attributes from the resource:

```php
<?php

namespace App\Http\Resources;

use Illuminate\Http\Resources\Json\JsonResource;
use Illuminate\Support\Facades\Route;

class PostResource extends JsonResource
{
    public function toArray($request)
    {
        $routeShowPost = $request->routeIs('posts.show');

        return [
            'id' => $this->id,
            'title' => $this->title,
            'image' => $this->image,
            'created_at' => $this->created_at,
            $this->mergeWhen($routeShowPost, [
                'content' => $this->content,
                'comments' => CommentResource::collection($this->whenLoaded('comments'))
            ]),
            'user' => UserResource::make($this->whenLoaded('user')),
            'category' => GeneralResource::make($this->whenLoaded('category')),
            'tags' => GeneralResource::collection($this->whenLoaded('tags')),
        ];
    }
}
```

In our example, we show the post's content and comments only when the route is `posts.show`.

Thanks for reading,
How to get the Top Software Engineering Practices Voice Badge on LinkedIn
Tags: softwareengineering, discuss, tutorial, coding
Published: 2023-12-26 20:59:46


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/59wgiflro496o14wdiq8.png)
So I recently got the Top Software Engineering Practices Voice Badge on LinkedIn and I will share here some tips on how to get the badge:

- Have at least a four digit number of followers. Now this is not something that is mentioned in LinkedIn but I think you need to have a certain number of followers in order to reach a pretty decent number of audience.
- So to get followers, send connection requests to people you know from school, college, work, etc.
- Post content on LinkedIn at least semi-regularly. I was and still am too shy to post on LinkedIn sometimes because a lot of people that I know follow me on there and so I fear judgement. But I think it is easier to post about any major achievements, work events, etc. 
- Contribute to the collaborative articles, you need to contribute to at least 3 articles to be eligible. The more articles you contribute to, the better. But the quality of the articles should be great too. There should be no grammatical errors, there should be no typos. The language used should be simple and the answer should not be too short. 

What are your tips on how to get a Top Software Engineering Practices Voice badge or any other Top Voice badge on LinkedIn? Let us discuss in the comments!
API and REST in simple terms explained
Tags: api, restapi, python, django
Published: 2023-12-26 20:58:43

I see online a lot of confusion about some basic terminology as API and REST. Here I will try to give very simple explanation for anybody new to the field who is perplexed by this very common terms.

API (Application Programing Interface) simply means: 

Interface exposed by lets say our backend to be Programmatically (via code) used by some Application (let say our React front-end) 

If you want some resource programmatically to integrate in your application you can do that over APIs. Or if you want your resource to be programmatically available and integrated in other people applications you can make some public APIs. 

Here Resource can be understood as data in your database. And Interface is simply some endpoint to which application can send request according to rules defined by that API. That's all.

And now what does it mean REST (Representational State Transfer)? 

In simply terms it means Transferring State of resource (entry from your database) in some representational format (let's say JSON). And that's it => Representation State Transfer aka REST.
My first post and how I am starting to develop in public :)
Tags: typescript, node, cli, programming
Published: 2023-12-26 20:57:09

## [Taskmaster - CLi](https://github.com/sarim2000/taskmaster)


I am working on this project to create cli based task management and am planning to integrate AI and other essential tools. Do you guys can give more suggestion on how I can improve it?

I am looking to build something useful in my free time, also wanna contribute something to this community through my limited knowledge and skillset, appreciate every help incoming