teleren/devto huggingface dataset:
How to make sure that your code match the design?
Tags: frontend, css, webdev, design
Published: 2022-03-06 02:10:34

Sometimes programmer loss track of the CSS properties, especially the margin and padding. Yet the UI designers are always too smart to spot the difference. 

<br/>
In my last week of work, I got my ticket (Jira ticket) sending back twice because my code didn’t match the design. For me, it looked the same. But somehow the designer caught the minor difference. 

<br/>
So I asked them, how or what software do you use to compare the difference? In turns out, they are using simply Figma and Photoshop to overlay the screenshot of the final product I made on top of the design. 

<br/>
But, as the developer, we don’t always has access to edit Figma, so I need to find other solution. Here is the [Perfect Pixel](https://chrome.google.com/webstore/detail/perfectpixel-by-welldonec/dkaagdgjmgdmbnecmcefdhjekcoceebi) Chrome plugin! It allows to overlay the a photo on top of the current website. The difference can be found instantly by the developer without sending the ticket back and forth and slowing down the development process. 

<br/>
To use the plugin, first you need to have a screenshot of your design. Figma has the export function to export the design directly. 

<br/>
First select the layer, scroll down to the bottom of the design bar and you will find the export button. 



![Showing how to export in figma](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7mmvzxf6qchbz6vxlbk0.png)

<br/>
Then you add image to the plugin. Then it is done, you can now move around the image and experiment with it through the control panel.

<br/>
By the laying on image on top of the website, the difference is easily spot. Just like this:


![An example of using Perfect Pixel](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xxa88ffc905j635oow3b.png)
 
<br/>
 But make sure that the window size of your website is the same as your design. For example if the design is 1920 x 1080, then do make sure that your screen size is also 1920 x 1080. You can also use the inspector change the ration accordingly. 

<br/>
Thanks to Perfect Pixel, we as frontend developer could make less trouble for the UI and QA team!

<br/>
Subscribe to the [newsletter](https://shekasdev.com/newsletter/) to receive the knowledge I have learnt in work each week!
Segundo projeto 2/52
Tags: beginners, webdev, html, css
Published: 2022-03-06 01:40:50

Hoje minha irmã me mostrou seu livro de Inglês da escola, e umas das atividades era um site de receita, como não tinha decidido qual projeto ia fazer essa semana, decidir usar isso como inspiração. Acessei sites de chefs que gosto e fiz um modelo no figma. Não tenho tanta experiência no site mas consegui chegar em um resultado que gostei, agora só falta colocar em prática.
***
Vou deixar o link do figma para quem quiser tentar fazer também! 
 
[figma](https://www.figma.com/community/file/1083187918688289123/Site-de-Receita)
***
link atualizado
Blog Day 1! - Learning Colt Steele's Web Developer Bootcamp
Published: 2022-03-06 01:34:58

Its already been many weeks since I've started the Web Developer Bootcamp 2022 by Colt Steele but this is the first official day of me Blogging my journey to becoming a Web Developer. While I already know about HTML, CSS and a good portion of Javascript, my main focus with this course is focused on the backend side of Web Development, particularly with the technologies of Node, Express and MongoDB.

Though I've said here that I know most of the Javascript, I've learn some couple of new stuff that will come in handy, so it was worth it going through back everything else.

The key focuses that I've learn during the last week was setting up a server with Express, learning about Express basic Routes, RESTful Routes and finally the last few days MongoDB and Mongoose.

For the server, import express, run the express as an app, setup the app to listen to a certain port and from there I can set up the routing.

With RESTful, I've learn how to properly define routes, what method should be used; GET, POST, PATCH, DELETE. Why we would want to use redirect after certain actions rather than using a normal GET. Method Override which would need to be have an addition package installed, imported and setup within the HTML form methods by tricking the POST request in order to use the HTTP DELETE/PATCH methods.

Finally for MongoDB, what can I say, it was a little bit... not really difficult but more like a run around to install MongoDB on my Window's PC. Changing Environment variables in-order to run the "mongod" and "mongo" commands from any where in the terminal, which was quite useful. Comparing it to SQL as I already know, it seems a little more difficult to learn but it could be that I'm still new to it and the syntax still is young to me. Again it doesn't seem that difficult to learn, just remember the syntax seems to be what might be the longest learning point for me, but that's why we have the Docs.

Mongoose, its what lets us use Mongo with our Javascript, useful tool, again doesn't seem that difficult just need to really learn how to connect it to the MongoDB. Setting up the Schema isn't difficult to learn either, but I do believe I need to focus on this a bit more.

Well that seems to be enough writing here for me tonight, going to try and finish out the rest of Section 37. Got like 6 more videos, maybe an hour more for me to have a basic understanding.
How many way to find max number in array on Javascript.
Tags: javascript, devops, array, max
Published: 2022-03-06 01:34:52

## 1. With for-loop

```javascript
const array = [-29, 5, 0, 3, 111, 99, 2, 99];

function maxNumberInArray(arr) {
    let maxNumber = arr[0];
//same way can apply on other loop like(For In, For Of, While)
    for(let i = 0; i < arr.length; i++){
        if(arr[i] > maxNumber){
            maxNumber = arr[i];
        }
    }
    return maxNumber;
}
console.log(maxNumberInArray(array));
```

## 2. With forEach

```javascript
let array = [-1, 10, 30, 45, 5, 6, 89, 17];

function maxNumberInArray(arr) {
  let maxNumber = -Infinity;
  arr.forEach(number => { 
         maxNumber =  number > maxNumber ? number :  maxNumber;
               });
  console.log(maxNumber);
}

console.log(maxNumberInArray(array));
```

## 3. Using Math.max function.

```javascript
let array = [-1, 10, 30, 45, 5, 6, 89, 17];
console.log(Math.max(...array))
```
## 4. Using reducer

```javascript
let array = [-1, 10, 30, 45, 5, 6, 89, 17];
console.log(array.reduce((element,max) => element > max ? element : max, 0));
```
Citrix CVAD Cloud Api Scripting

Tags: powershell, citrix, api
Published: 2022-03-06 01:25:35

I created a PowerShell wrapper module for Citrix Cloud CVAD API, the original goal was just to understand the new API and to see what would be possible. But it ended up allowing me to automate tasks, that I previously gave up on because of Windows and Windows PowerShell versioning ext.

Using this module, I was able to rewrite all my PowerShell scripts for on-prem environments, without needing the Citrix PSSnapins. This enabled me to move my setup to PowerShell 7 with ease. My next goal is to run everything from a non-Windows system and then some actions/tasks from GitHub Actions or Azure DevOps Pipelines.

Managing multiple clients is also much simpler now, I reuse the same scripts between all my clients to create their Daily and Monthly reporting. All I need to change is the API Token, and the module takes care of the rest.

I hope this will help other Citrix Admins out there and make their lives a bit easier. Please contact me on LinkedIn or GitHub for any bugs or enhancements.

Follow these steps to get started:

## Getting Started
You will need access to the Citrix Cloud API. Follow Get API Access to gain access.

`Install-Module -Name CTXCloudApi -Verbose`
`Import-Module CTXCloudApi -Verbose -Force`
`Get-Command -Module CTXCloudApi`
or
`Get-Help About_CTXCloudApi`

Run `Connect-CTXAPI` with the details obtained from Citrix Cloud. This will connect and create the needed headers for other commands.

## Example 1:
`$splat = @{
    Customer_Id = "xxx"
    Client_Id = "xxx-xxx-xxx-xxx"
    Client_Secret = "yyyyyy=="
    Customer_Name = 'HomeLab'
}
$APIHeader = Connect-CTXAPI @splat
Get-CTXAPI_HealthCheck -APIHeader $APIHeader -region eu -ReportPath C:\Temp\`
What is the Bug Life Cycle
Published: 2022-03-05 23:41:02

I am sure you have encountered this question many times before!


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

Interviewer: Can you tell me your bug life cycle process?
Me: Immm, emmmm, oooovvvv….

> No, don’t worry so much, actually the process is very simple, you just have to systematize it to tell it in your head :)
How to export and import data in DBeaver
Tags: database, sql
Published: 2022-03-06 00:34:29


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



In this article, I'll to teach how to export and import data using the DBweaver, its very simple.

In yours DBweaver select database and table that you want to export data.

Right mouse button and select option **Export data**




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



Select the option **SQL Export to SQL INSERT statement** click next and select the folder where you want to save the script.After that click **Proceed**.








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

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/atknny9vm0jnt06odacv.png)
 
  
Now, run the script in another database.


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

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b2qj8witu9qbil1qgf7x.png)
What happed to "react-dom/unstable-native-dependencies"
Published: 2022-03-06 00:23:59

I have some legacy code (written on a Mac). Using this code base, I have built an Expo app on Windows, and am getting the error that **"react-dom/unstable-native-dependencies" could not be found**. 

Anyone know what happened to the "**unstable-native-dependencies**"?  It isn't in "react-dom" in my node modules, but I have to assume that this package exists ( or existed ) somewhere. 

Although this code base is not complete, the Mac version is running in production for testing. 

I am using the same package.json that was used in the Mac version, and so I'm very confused as to how it can be built on the Mac, but throws this error (plus a few others that I have corrected) on my Windows machine. 

Any advice will be greatly appreciated

b
Scrum is great in theory, but "it will never work in the real world"
Tags: agile, scrum, xp, devops
Published: 2022-09-05 20:19:28

---
title: Scrum is great in theory, but "it will never work in the real world"
published: true
date: 2022-03-06 00:00:00 UTC
tags: agile,scrum,xp,devops
canonical_url: https://jhall.io/archive/2022/03/06/scrum-is-great-in-theory-but-it-will-never-work-in-the-real-world/
---

I’m sure you’ve heard such a statement. You may have even said it yourself:

> Scrum (or XP or Agile or DevOps or Lean) is great in theory, but it will never work in the real world…

I have two responses to a statement like this.

The first is an almost knee-jerk reaction:

> But it _does_ work in the real world. At least in some situations, because people are doing it successfully!

This is the extent of most such conversations on social media. It often devolves into a sort of he-said/she-said yelling match that ends in “your experience is less valid than mine” types of rhetoric.

Not very productive.

And this leads me to my second response to this type of statement, which is to try to understand where it’s coming from.

These “it will never work in the real world” types of statements usually come out of experience. Often direct, first-hand experience of the thing in question _having failed in the real world_.

But here’s the thing: There are (at least) _two_ different _real worlds_. Or more like: There are two _layers_ of reality, and the people who make these statements are operating at one layer, and the people who argue against them are operating on another layer.

“This will never work in the real world” often makes _perfect sense_ when you live in the world of hard deadlines, large up-front planning, complex external dependencies, etc.

“This is proven to work in the real world” _also makes perfect sense_ when you live in a world that’s built around an assumption of business and software agility.

The main difference I see between these two “realities” is that of [mindset](https://jhall.io/archive/2022/02/21/take-the-blue-pill-the-story-ends/). Both are versions of the “real world”. But in my view, the “This is proven to work” mindset is more aligned with the _fundamental reality_ that [software development is inherently unpredictable](https://jhall.io/archive/2022/02/18/software-development-is-inherently-unpredictable/).

But for Scrum/XP/Agile/DevOps/Lean to work, it must be in a context [_that recognizes this reality_](https://jhall.io/archive/2022/02/23/how-do-you-respond-to-uncertainty/). In my experience, this is a minority of contexts, although perhaps that number is growing.

* * *
_If you enjoyed this message, [subscribe](https://jhall.io/daily) to <u>The Daily Commit</u> to get future messages to your inbox._
SQL Commands with C#
Tags: csharp, dotnet, sql
Published: 2022-03-05 23:53:26

As a first post, I thought it would be fitting to discuss how to interact with vanilla SQL commands in C#. Firstly, I want to praise .NET (well technically ADO.NET) for the absolute ease of running SQL commands through its library. 

Taking a quick look at .NET's reference source, we can see they that really value SQL integrations:
![SQL results](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/eft7zpdpa0lb5k6f2obl.png)

Without further adieu, let's get into the code. For our implementation, we will mainly be using `System.Data.SqlClient.SqlCommand`. This class is not included in the default .NET namespaces, so you will have to add its namespace yourself.

Add using the Dotnet CLI:
```
dotnet add package System.Data.SqlClient
```

Don't forget to include your `using` statements:

```cs
using System.Data;
using System.Data.SqlClient;
```

Let's also add `using System;` just to be safe.

Next, we have to connect to a database (obviously). Depending on the circumstances, the information needed for this step varies. But generally speaking, you will need the following fields:

- User ID
- Password/Pwd (they mean the same thing)
- Data Source/Server/Address/Addr/Network Address (they all mean the same thing too)

Using this information, we can specify a connection:

```cs
SqlConnection connection = new SqlConnection(@"user id=yourUsername;password=yourPassword;server=yourServer;database=yourDirectory;Trusted_Connection=True;");
//when specifying a directory, consider using a verbatim string literal to ignore escapes
```

A simple method will allow us to finish creating the connection:

```cs
connection.Open();
```

We have now reached the fun part. We can finally write SQL commands to the connection. I hope you are as excited as I am!

Initialization and field assignment of the command:

```cs
SqlCommand command = new SqlCommand();
command.CommandTimeout = 60;
//a command timeout of 60 is recommended
command.Connection = connection;
command.CommandType = CommandType.Text;
command.CommandText = "yourCommand";
```

Time to send the command on its way. (they grow up so fast!)

```cs
command.ExecuteScalar();
```

Reading the command response (if any) is as simple as:

```cs
command.ExecuteReader();
```

This returns a `System.Data.SqlClient.SqlDataReader` object, which we can then use to easily read values.

Now me being me, I wrote a class encapsulating this code for convenience:

```cs
using System;
using System.Data;
using System.Data.SqlClient;

public static class Command
{
    private static SqlCommand command = new SqlCommand();

    public static SqlDataReader Send(string commandtext, SqlConnection connection, int timeout = 60)
    {
        command.CommandTimeout = timeout;
        command.Connection = connection;
        command.CommandType = CommandType.Text;
        command.CommandText = commandtext;
        command.ExecuteScalar();
        return command.ExecuteReader();
    }
}
```

Now we can interact with SQL commands in a simple way. Feel free to copy this code for your own use.
Կարյերա ՏՏ ոլորտում - Ծանոթություն
Tags: it, career
Published: 2022-03-05 23:39:44

Հայաստանում ՏՏ ոլորտը աճում է ու ավելի շատ մարդիկ են ցանկանում մտնել այս ոլորտ։ Սակայն այս մարդկանց մեծ մասը ունենում է խնդիրներ ոլորտ մտնելու հարցում։ Խնդիրները հիմնականում երկու տեսակի են` ինչպես սովորել ծրագրավորում և ինչպես գտնել աշխատանք։ Որոշեցի անդրադառնալ այս հարցին։ Որպեսզի ձանձրալի չլինի յուրաքանչյուր հարցի և յուրաքանչյուր ոլորտի համար առանձին հոդված կգրեմ։

Նախ պետք է հասկանալ որ ՏՏ֊ն միայն ծրագրավորում չէ։ Մեր ոլորտը ունի երեք հիմնական ուղղություններ` սարքերի ինժիներինգ, ադմինիստրացիա և ծրագրավորում։ Ուղղություններից յուրաքանչյուրը ունի իր դրական և բացասական կողմերը։ Այս հոդվածների շարքում կծանոթանանք այս ուղություններից յուրաքանչյուրին և գործնական քայլերին ինչպես սովորել ապա գտնել աշխատանք։
Flutter Constants Best Practices 💫 🌌 ✨
Tags: flutter, dart, constants, bestpractices
Published: 2022-03-05 23:32:35

**Flutter da tüm constant'ları bir dosyada tutmanın en iyi yolu nedir?**

Java ve C#'da her tanım bir sınıfın içinde olmalıdır, bu nedenle yalnızca statik üyelerin var olduğu sınıflar yaygın olarak kullanılır.

Dart'ın üst düzey işlevleri, değişkenleri ve sabitleri vardır, bu nedenle yalnızca bir şeyi tanımlamak için bir sınıfa ihtiyacınız yoktur. İstediğiniz bir namespace ise kitaplık(library) daha uygundur. Kitaplıklar içe aktarma öneklerini ve birleştiricileri show/hide  destekler. Bunlar, kodunuzun tüketicisinin ad çakışmalarını kendileri için en iyi şekilde işlemesini sağlayan güçlü araçlardır.

Bir fonksiyon veya değişken mantıksal olarak bir sınıfa bağlı değilse, onu en üst düzeye koyun. Ad çakışmalarından endişe ediyorsanız, ona daha kesin bir ad verin veya önekle import edilebilen ayrı bir library'e taşıyın.

Doğru kullanım:

```
DateTime mostRecent(List<DateTime> dates) {
  return dates.reduce((a, b) => a.isAfter(b) ? a : b);
}

const _favoriteMammal = 'weasel';
```

Yanlış kullanım:

```
class DateUtils {
  static DateTime mostRecent(List<DateTime> dates) {
    return dates.reduce((a, b) => a.isAfter(b) ? a : b);
  }
}

class _Favorites {
  static const mammal = 'weasel';
}
```

Örnek Uygulama:

constants.dart adında yeni bir dosya oluşturun.

Aşağıda görüldüğü gibi constantlarınızı bildirin.

```
 const succesMessage=" İşlem başarılı.";

 // Api related 
 const apiBaseURL = "https://baseurl.com";
    
 const userLoginApi = "login";
 const userSignupApi = "signup";
    
 // Shared Preference keys 
 const kDeviceName = "device_name";
 const kDeviceUDID = "device_id";

 // Asset Constants
 const navBarLogoImage = "assets/images/home_images/sample.png"
```

[Stil kurallarında](https://dev.to/gulsenkeskin/flutter-best-practices-339p) belirtildiği gibi constantlarınızı isimlendirirken `lowerCamelCase` biçimlendirmesini kullandığınızdan emin olun. bkz: navBarLogoImage 

Ardından, sabitlere erişmesi gereken herhangi bir dart dosyasının en üstüne aşağıdaki import ifadesini ekleyin:

`import 'constants.dart' as constants;`


`constants.dart` dosyanız farklı bir dizindeyse , import ifadenizde `constants.dart` yolunu belirtmeniz gerektiğini unutmayın.

Absolute path örneği:

`import 'package:<your_app_name>/common/constants.dart' as constants;`


Artık bu sözdizimi ile sabitlerinize kolayca erişebilirsiniz:

String a = constants.succesMessage;



References:
https://dart.dev/guides/language/effective-dart/design
https://dart.dev/guides/language/effective-dart/style
https://stackoverflow.com/questions/54069239/whats-the-best-practice-to-keep-all-the-constants-in-flutter
https://flutteragency.com/keep-all-the-constants-in-flutter/#:~:text=The%20preferred%20solution%20is%20to,new%20dart%20file%20named%20Constants.
Differences Between Web 2 and Web 3
Published: 2022-03-05 22:29:52

Web 2.0 is the current version of the internet we are all familiar with. Social media platforms like Facebook, Twitter, Google e.t.c are built with web 2.0. Users can sort information freely and are also permitted to retrieve and classify the information collectively. Information flows between the site owner and users utilizing evaluation and communication.

Web 3.0 is the evolution of web utilization and interaction which includes altering the web into a database. In web 3.0 data is not owned but instead shared. Decentralized apps that run on the blockchain are built with web 3.0.

In web, 2.0 computers use HTTP in the form of unique web addresses to find information that is stored at a fixed location on a single server. With web 3.0, because the information would be found based on its content, it would be stored in multiple locations simultaneously and hence be decentralized. This would break down the massive database currently held by internet giants like Facebook Google e.t.c and would hand greater control to users. 

Web 3.0  allows participants to interact directly without going through checks and permission from authorised bodies which is unlike web 2.0.


References: 
[Blockgamez](https://blockgames.gg/)
[Nestcoin](https://nestcoin.com/)
[Zuri](https://zuri.team/)
Does this look like normal UI code?
Tags: beginners, ux, c, opensource
Published: 2022-03-05 23:21:29

Currently working on a CLI app for UNO and just wondering if my little snippet here is normal for UI design. I'm pretty bad and I'm using ncurses so it won't look good, but it definitely didn't feel good to write the UI code either. Respect to all UI designers out there.