teleren/devto huggingface dataset:
Understanding .DS_Store File Part 1
Tags: ctf, macfiles, cybersecurity
Published: 2022-09-09 10:19:38

**Do you own a MacBook?** 
If yes, then you must be careful because you could be exposing critical information about your website or applications through '**.DS_Store**' files. DS refers to Desktop Services.

**What are DS_Store files?**


A file with the 'ds_store' extension is a Mac OS X database file. Mac database files are used by many applications to store data in the form of flat files, which are stored on a database server when the database application is not running. Databases typically store information such as names of people and companies, phone numbers, email addresses, or other personal data for an organization (including its employees and customers), or information about how one product should be handled in its supply chain.

The application Mac DS_Store File is specially designed for storage and access to files on the Mac OS X operating system. This wizard allows you to manage the content of your Mac hard drive, creating, moving, and removing folders and files, renaming them, copying between volumes of disks, or creating new hard drives from scratch.

Mac Ds_store files are associated with a specific product, e.g., toolkit, media player, etc. The Mac Ds_store files are exploitable and have the potential to obtain users’ information.

This file contains several potential security vulnerabilities that can be exploited by security researchers popularly known as hackers.

Stay tuned for part 2 on how DS_Store files are exploited.
ONLYOFFICE joins DEV Community
Tags: onlyoffice, welcome
Published: 2022-09-09 09:54:22

Hey there! We are an ONLYOFFICE team and we are really glad to join the DEV Community. Here, we are going to post our news and useful tips for developers.

**Just a brief intro to ONLYOFFICE** 

It is an open-source project with the focus on advanced and secure document processing, with Office Open XML as the core file format.

ONLYOFFICE is integrated in lots of widely-used platforms (WordPress, Strapi, Drupal, Nextcloud, Jira, Confluence, Alfresco, Redmine, Moodle, etc.), can be embedded into your own web service, and is available in various distribution formats and packages such as DEB, RPM, Docker, Snap, UCS, Cloudron, AMI, Kubernets, etc.

{% embed https://youtu.be/O5zQTeX9f-8 %}

You are welcome to explore more info on [our website](https://www.onlyoffice.com/) and [GitHub](https://github.com/ONLYOFFICE).

Come join us!
Destructuring in JavaScript | ES6
Published: 2022-09-09 09:38:23

Destructuring is used to extract the array elements or object properties and store them in variables.
See the example below,

**Object destructuring**
```
//Array destructuring
const number = [1, 2, 3];

const [num1, , num3] = number
console.log(num1, num3)

Output:
1 3
```

**Array destructuring**
```
//Object destructuring
const myFriends = {
    friend1:'Nivedh',
    friend2:'Vibin',
    friend3:'Joel'
}
const {friend2, friend1} = myFriends
console.log(friend1, friend2)

Output:
Nivedh Vibin
```
Editing is not a state
Tags: modelling, design, ddd
Published: 2022-09-09 09:23:23

---
title: Editing is not a state
published: true
description: Rant about domain state modelling
tags: modelling, design, DDD 
---

Say we have a domain entity that requires collaboration, for example a ConstructionProject (CP). It's created and owned by a Company, they specify parameters and then invite an Architect and one or many Contractors.  

It's clear that ConstructionProject will have states. DDD tells us that good thinking about states must tie them back to operations, initiated either by actors in the system or time (some deadline date arrives etc.).  

So, naively, we have `CreateConstructionProject` operation that produces a CP in `draft` state. Company fills the draft CP out over time and at some point they're ready to progress to some next stage, maybe to `seeking_building_permissions` via `ConstructionProjectSeeksBuildingPermisions` operation.

But say the company wants to make amendments to the CP once it's started seeking building permissions, changes that would not affect the parameters of land needed etc.?

A bad design would introduce a new state `editing` and write logic to disambiguate the data in this `editing` state VS a previous non-editing state, making `editing` a ghost state.

A better approach is to take inspiration from Git and treat any edits as a "feature branch" of the real CP, which remains in `seeking_building_permissions` state. Once edits are complete and ready to be applied, call `ApplyEditsToConstructionProject` operation which applies edits. CP has never exited `seeking_building_permissions` state and no special handling looking up previous non-editing state has been needed.

KISS
AWS Cloud Practitioner Certificate
Published: 2023-12-15 18:50:59

---
title: AWS Cloud Practitioner Certificate
published: true
date: 2022-09-09 09:23:17 UTC
tags: 
canonical_url: https://mennymo.hashnode.dev/aws-cloud-practitioner-certificate
---

### Introduction

One thing the AWS community loves is certificates, there are certificates for almost every part of the AWS ecosystem. Although its a good thing that helps your job prospects, sometimes, it can be overwhelming!

Well, today, we will be demystifying one of those certificates and helping you understand what an AWS Cloud Practitioner Certificate really is, and whether you really need it or not.

### Definitions and some basics

First of all, its a certificate (obviously, I know)! But to be more specific, it is a generalized certificate that anyone (either a programmer or non-technical manager) on the technology spectrum can get and apply in various ways. The certification exam tests your fundamental knowledge of AWS and shows that you are at least familiar with the AWS console and are able to navigate it.

### What it entails

Well like I said earlier, it contains the fundamentals of AWS;

- Cloud Concepts
- AWS Global Infrastructure
- AWS Account, Billing, and Pricing Models
- Services (Database, Provisioning, Computing, Storage, Logging)
- Security

### Do you really need it?

By its very nature, the certification is designed to be easy to get. It is less complicated than other associate certificates like the AWS Solutions Architect Associate Certificate.

#### So why not just focus on the other certificates?

Well, AWS exams can be very tricky, and you might need some real experience with them. So my advice is you should still take this exam even if you think you can take the other certificates. Regardless though, the Cloud Practitioner Certificate explores all aspects of AWS fundamentals.

#### Some resources to help you get started.

If you are ready to take the certification exam, then you can take a look at my next article which goes into more detail about the AWS fundamentals mentioned above [here](https://dev.to/mennymo/aws-fundamentals-and-benefits-of-cloud-computing-3kdb). You can also check out this video by [freeCodeCamp](https://youtu.be/NhDYbskXRgc?si=Sh1_lR3dKYKgyypw) AWS Certified Cloud Practitioner Training 2023

> Thank you for coming by. Do well to reach out on [LinkedIn](https://www.linkedin.com/in/omolade-akinwumi-554247144/) or [Twitter](https://twitter.com/Molly_ladson) for collaborations 😃

**References**

_https://www.linkedin.com/posts/reshma-savania-157a603\_aws-certified-cloud-practitioner-was-issued-activity-6969636502762831873-C0Ej_
I Built An Animation Tool With Angular!
Tags: javascript, webdev, beginners, showdev
Published: 2022-09-09 09:18:44

## Motivation to create


Recently, I blogged more than I used to. Most of the posts are tutorials. 

I tried to add images, diagrams when possible. However, I think videos work best when describing procedures.

Diagrams are cool but it would be even more awesome if objects on diagrams can move :D.

So I created a tool to do just that: Helps me create videos to explain processes quickly.

You may say: Hey, there are many great video tool out there that you can learn in a few hours and they can do more than what you need!

Yes, I know. Great tools (even free) are out there but being able to create something outweigh all reasons.

I ended up spending mostly a week creating the first "usable" version.

## The app

So here it is:

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



https://vanim.datmt.com/

I created a video showing how to use the app here:
https://www.youtube.com/watch?v=RE6RbT69VS0


You can go there and start playing with the tool. You can create some shapes, use images to create moving diagrams...

Here is one example I created to explain the concept of CountDownLatch in Java

<video width="800" height="450" controls>
  <source src="https://datmt.com/wp-content/uploads/2022/09/count-down-latch-video.webm" type="video/webm">
</video>

## Future of the app
I have some ideas in mind. The main purpose is to make creating videos even easier. I know the app is primitive now but I can now create some nice animation for my blog :).

Your suggestions are highly appreciated!


## Special thanks

This app is not possible without the following projects:
* Fabricjs http://fabricjs.com/: It is the engine that run the app. Thanks!
* Jenkins: Thanks to this awesome projects, I can literally push new changes online in just a single click.

Thanks for your attention. Have a great weekend and hope you have fun creating new things!
How can I pass and call functions into another component without props to create a "redo bar"?
Tags: react
Published: 2022-09-09 09:16:38

I want to create a component that allows the user to use a "retry" option to invoke a failed function, but this function should be redefined every time this "retry" button is prompt. For example, this is the Google retry message:

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


I thought of using Redux.js but found out that passing functions through it is a really bad practice. Prop drilling is not an option (this app has a lot of sub-components).

Has anyone encountered this situation? I'm sure this concept is pretty common. 

Some code examples:

```
const App = () => {
   return (
      <div>
         <Alert />
         <CompA />
         <CompB />
      </div>
   )
}

const Alert = () => {
   return (
         <button onClick={someFunction}>
            Retry
         </button>
   )
}

const compA = () => {
   const getData = async () {
      try {
         // fetch some data... 
      }
      catch {
         setUserAlert(() => getData())
      }
   }
   return (
      {data}
   )
}


const compB = () => {
   const postData = async () {
      try {
         // post some data... 
      }
      catch {
         setUserAlert(() => postData())
      }
   }
   return (
      {data}
   )
}
```

Thanks!
Prefixing variable names with 'is'
Tags: discuss, cleancode, programming
Published: 2022-09-09 09:06:18

---
title: Prefixing variable names with 'is'
published: true
description: 
tags: #discuss #cleancode #programming 
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3ha4ibrqsl6l6jbab70e.png
# Use a ratio of 100:42 for best results.
---
I wanted to share a recent thought about one specific naming topic and get your opinions on that: Using the 'is' prefix.

My point is that I feel the code is more readable without it most of the time.

```javascript
const isValidResponse = validateResponse(response);

if (!isValidResponse) {
  // ...
}

function getIsCheap(isFast, isGood) {
  return !isFast || !isGood;
}

const isCheap = getIsCheap(true, true);

if (!isCheap) {
  // ...
}
```

Versus:

```javascript
const validResponse = validateResponse(response);

if (!validResponse) {
  // ...
}

function getCheap(fast, good) {
  return !fast || !good;
}

const cheap = getCheap(true, true);

if (!cheap) {
  // ...
}
```

What do you think? 
Do you use the 'is' prefix?
What do you think about prefixing a function with 'is' like isCheap()?

**Update 1:**
Still in doubt about using `is` for variables. I am convinced that it is great for functions though.

Arguments for using `is` for variables:
* In case it is an existing naming convention for the project
* Knowing it is boolean
* Easier to search for isValue then for value
* For class properties like user.isLoggedIn

My example with updated function names (I like how it reads):

```javascript
const validResponse = isValidResponse(response);

if (!validResponse) {
  // ...
}

function isCheap(fast, good) {
  return !fast || !good;
}

const cheap = isCheap(true, true);

if (!cheap) {
  // ...
}
```

**Update 2:**

I ended up using the `is` prefix after all. The thing I like most about it is the fact that I can immediately see that the value is a boolean.
Rest and Spread operator in JavaScript | ES6
Tags: javascript, webdev, tutorial, react
Published: 2022-09-09 09:03:46

**Spread Operator**
Spread operator helps us to copy all the elements inside array or objects. After copying those elements, we can add those elements to another array or objects.

Let's look at an example,
In Array:
```
const number = [1, 2, 3];
const newNumbers = [...number, 4];
console.log(newNumbers)

Output:
[ 1, 2, 3, 4 ]
```
In Objects

```
const person = {
    name: 'Max'
}
const newPerson = {
    ...person,
    age: 26
}
console.log(newPerson)

Output:
{ name: 'Max', age: 26 }
```
Three dots before the array name or object name is used to copy the elements inside that array or object. `...person``...number`

**Rest Operator**
Rest operator is used with functions. 
It is used to merge a list of function arguments into an array. And we can perform array operations in it.

Let's look at an example,

```
const numberList = (...args) => {
    return args.filter(el => el === 1)
}

console.log(numberList(1, 2, 3))
```
`...args` is the rest operator which is used as the function parameter.This rest operator takes up all the different arguments and merge them into an array.
How rich can you be if you are really good at JAVA ?
Tags: java, programming, discuss, news
Published: 2022-09-09 08:42:07

Markus Persson, A.K.A. Notch, the creator of Minecraft. With an estimated net worth of $1.3 billion USD that is certainly very rich. He developed Minecraft using Java and now has a big mansion in Beverly Hills.


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



Java along with every other programming language is just a tool to be used by a programmer. If you are a good programmer and can build a great product with your programming language of choice you can attain riches, regardless of the language of choice. Don’t get too fixated on one language.
Membuat debounce function
Tags: javascript, react
Published: 2022-09-09 08:08:24

Kasus dibawah ini melakukan efisiensi pada live search data, dengan menggunakan debounce function ini kita bisa mendebounce karakter yang diinput user yang berubah dengan cepat dan mengeksekusinya saat waktu yang kita tentukan. dengan melakukan ini kode tidak melakukan pencarian setiap karakter berubah, ini membuat lebih efisien dan tidak mengganggu performance saat melakukan request ke suatu API.

## function useDebounce
```
import { useState, useEffect } from "react";

const useDebounce = (val: any, delay: number) => {
  const [debounceVal, setDebounceVal] = useState(val);

  useEffect(() => {
    const handler = setTimeout(() => {
      setDebounceVal(val);
    }, delay);

    return () => {
      clearTimeout(handler);
    };
  }, [val]);

  return debounceVal;
};

export default useDebounce;
```

## Contoh sederhana
```
import { useEffect, useState } from "react";
import useDebounce from "./use-debounce";

const listData = ["sabun", "minyak", "gula", "garam", "kopi"];

function App() {
  const [results, setResults] = useState<string[]>([]);
  const [text, setText] = useState("");

  const debounce = useDebounce(text, 500);

  useEffect(() => {
    const filterData = listData.filter((obj) =>
      obj.toLowerCase().includes(debounce)
    );
    setResults(filterData);
  }, [debounce]);

  return (
    <div className="App">
      <input
        type="text"
        value={text}
        onChange={(e) => setText(e.target.value)}
      />
      {results.length > 0 ? (
        results.map((el: string, i: number) => <div key={i}>{el}</div>)
      ) : (
        <div>no results</div>
      )}
    </div>
  );
}

export default App;

```

## Contoh menggunakan fetching data
```
import { useState } from "react";
import useDebounce from "./use-debounce";
import useFetch from "./use-fetch";


function App() {
  const [text, setText] = useState("");

  const debounce = useDebounce(text, 500);
  const url = `http://www.omdbapi.com/?t=${debounce}`;
  const {data, isLoading, error} = useFetch(url);

  if(isLoading){
    return <div>loading...</div>
  }

  if(error) {
    return <div>{error}</div>
  }


  return (
    <div className="App">
      <input
        type="text"
        value={text}
        onChange={(e) => setText(e.target.value)}
      />
      {data.length > 0 ? (
        data.map((el: string, i: number) => <div key={i}>{el}</div>)
      ) : (
        <div>no results</div>
      )}
    </div>
  );
}

export default App;

```
Absolute path in React
Tags: react, javascript, webdev, typescript
Published: 2022-09-09 07:41:07

### Why we need Absolute path in the App?

**Problems**
Working on applications without spending much time on organising a folder structure is a common story of the most of the developer as it requires granular details and sometimes we don't create folder structure perfectly because of the early stage of the app.
And most of time its nightmare when we change the folder structure after finishing or middle in the app.
It's painful to change the path for all the affected files relatively.

**Solution**
So here is the solution of Absolute path.

Absolute path help us to not care about the folder structure changes even in the middle of development or frequent folder structure changes as it can access files from the root folder (as per the configuration)


**Relative path vs Absolute path**

Relative path : `../../SubFolder/File`
Absolute path: `components/Folder/SubFolder/File`


### How to setup in React?

Go to the root folder and create a file `jsconfig.json` for JS based react app.
and put the configuration into the file

```javascript
{
  "compilerOptions": {
    "baseUrl": "src"
  },
  "include": ["src"]
}
```

Try to restart the server and now you can access your files by the full path

```
components/Folder/SubFolder/File
```

`tsconfig.json` (already created in the TypeScript template) at the root of your project
Automatic issue fixing and filtering in Visual Studio Code
Tags: vscode, debugging, web
Published: 2022-09-09 07:28:56

---
title: Automatic issue fixing and filtering in Visual Studio Code
published: true
description: You can now filter out issue reporting and ask VS Code too automatically fix issues with the DevTools extension
tags: vscode, debugging, web
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xc1ozxd70dkt4jharpq0.png
---

Using the [Microsoft Edge DevTools for VS Code](https://aka.ms/devtools-for-code) extension you get live analysis of your code and information about problems with accessibility, compatibiliity, security and performance. One highly requested feature was to automatically fix issues or allow users to never report a certain issue again. This is now part of the extension since version 2.1.1.

![Recording showing how to fix an issue in your code automatically](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/s33ywswc2n9i65lp5v45.gif)

Here's a 25 second intro to the feature:

{% youtube JLMbpiywVxQ %}

Want more or contribute? [File an issue on GitHub](https://github.com/microsoft/vscode-edge-devtools/issues).
Game Tester
Tags: gamedev, gaming, freelancer, gametester
Published: 2022-09-09 07:00:09

Hello everyone!!! Fews weeks a back I joined as a freelance game tester at a company named Playtestcloud which basically tests different games and gives the appropriate feedback.

Well I would definitely say that Gaming industry is the highest booming industry in entire market and its growth rate per year is around 40-50% and thats a very huge thing.

In few years AI and gaming industry will just make trillion $ market in most of the developed countries.
Hello World
Tags: opensource
Published: 2022-09-09 06:58:52

Hello there, I am Eakam, a student in the Computer Programming and Analysis program at Seneca College. I am writing this post to mark the beginning of my journey into open source development as a part of my course in open source development.
 
A few years before I started learning about software development, I switched to Linux on an old computer I had since it was too old to support Windows. Out of curiosity, I decided to research about the history of Linux and found out about open source development. 

Truthfully, I do not know much about open source development as I write this. However, I have wanted to learn more about it and also contribute to the open source community. That is why I decided to take this course. By the end of my term, I hope to learn more about open source development, and contribute to open source projects. 

I find projects that help visualize data pretty interesting. A recent one I found was [jsoncrack.com] (https://github.com/AykutSarac/jsoncrack.com ) which helps visualize JSON data as graphs. I have had to deal with large JSON responses with 1000s of records and multiple layers of nesting while debugging programs. I usually use a browser such as Firefox to navigate the data. However, with a tool like this, I would have been able to save several hours of debugging just to discover that a config problem had caused data duplication and nesting issues.
New generation syntax for JavaScript classes | ES6 / Babel
Published: 2022-09-09 06:54:45

A class mainly have properties and methods.
Properties are like 'Variables attached to classes'.
Methods are like 'functions attached to classes'.

Let's take a look at a class which has the new gen syntax,
```
class Human {
    gender = 'male';
    printGender = () => {
        console.log(this.gender);
    }
}

class Person extends Human {
    name = "Max";
    printMyName = () => {
        console.log(this.name);
    }
}
```
Here we exclude the constructor function and directly assign the value to a variable inside the class.
And then we use arrow functions syntax to create method inside the class.
Financial Advice!
Published: 2022-09-09 06:46:15

## What I have learned on how to create wealth by making savings (not a finance person, just speaking from experience and advise)



- Save 30-40% of your net income per month.
- Save at the start of month, not at the end. Keep that money separately.
- This saving should not be kept in a bank because currency will devalue. Would suggest to invest in mutual funds (easy to put, easy to withdraw) . Many funds don’t charge or charge less front load fee.
- Repeat this every month and you’ll end up creating a large pool of asset.
- You can utilize the same saving to buy assets that give you a return ( property on down payment, shares, crypto).

.
.
.
.


**A very pertinent question is:** How do we save 40% of our monthly income with this inflation and expenses? In fact many end up in debt monthly on credit cards due to lack of disposable income.

1) Write down your monthly expenses and cut out on unnecessary ones. Only critical ones
2) Defer expenses that can be incurred later and are not needed urgently (eg. a large Tv, expensive car etc )
3) Focus on creating a side hustle which gives you income ( small store, kiosk, online product, return on saved money )
4) Work hard to get that promotion so your income increases. Or switch to a better pay .

--------------------------------

> Change lifestyle. Eat healthy, spend maturely. Ensure you have 2,3 assets that give you monthly or yearly return. This amount can be utilised later to multiply your assets and expenses

---------------------------------

Unless you follow this, you’ll always be stuck in a debt spiral. Will earn and spend. Focus on building assets, not just expenses

Credits: [UMER F.](https://www.linkedin.com/in/umer-f-73807375/)