teleren/devto huggingface dataset:
How to preview a Next.JS app on a mobile device
Tags: webdev, nextjs
Published: 2023-03-17 12:36:15

So you're building a mobile web app and you want to view it on an actual phone not a virtual one in your dev tools? No, you don't have to deploy! If you've ever used Create React App, running developer mode gives you simple instructions for doing this, however Next.JS `$ yarn dev` does not! Fear not, it is very simple...

#### 1. Get your machine's IP address
```bash
# Linux/Mac
$ ifconfig

# Or Windows...
$ ipconfig
```

#### 2. Run your project
```bash
$ yarn dev
```

#### 3.Open browser on your phone

- If your machine's IP is `192.168.0.69`...
- ...navigate to `192.168.0.69:3000` on your phone

It's as easy as that!
WIT 2023 with We coded
Tags: wecoded
Published: 2023-03-17 12:19:38

We need more women in IT. Companies struggle to locate skilled employees as the business expands swiftly. There is simply not enough talent in technology. Because there are more women working in information technology, firms can create diverse teams and grow successful companies.

More women equals greater innovation and original problem-solving, which is crucial. According to studies, women tend to be more empathic than men, which translates into persuading the quiet team members to participate more or looking at a problem from the perspective of the client, which a male engineer might not consider. Having more women also increases revenue.

For women who are prepared to pursue a career in information technology, there are many alternatives. Women can enter a job that pays very well and offers prospects for growth and promotion in a variety of fields, including data analysts, cybersecurity professionals, and user experience design. A bachelor's degree or equivalent education is required for the majority of occupations, and some also call for specialized certificates.

The tech industry is susceptible to bias, just like other sectors. Few opportunities exist for women to work in technology. Only a few women reached the highest levels of management in the traditionally male-dominated area of technology. Women may be discouraged from choosing a career in technology as a result.

Also, some women could have childcare duties, which makes it more difficult for them to get and hold IT professions. But, times are changing, and more women are succeeding in the tech industry. The proportion of women working in technology is slowly rising. And if this expansion continues, more women will soon work in the IT industry. But why is this essential?
Women In Tech World
Tags: wecoded
Published: 2023-03-17 12:04:33

Women have always had a significant impact on technology. Women in information technology paved the way for a lot of the computing power we take for granted today, starting with Ada Lovelace, the first computer programmer, and ending with Katherine Johnson's famed space calculations made famous by the film Hidden Figures.


Not only are there many opportunities in the IT industry for everyone, but there are also many opportunities for women, and not just because there aren't many women with talent.

Also, a career in IT is absolutely transferrable. A woman can establish her own business or write her ticket to work anywhere she wants with the correct abilities, whether it be creating life-changing software. Certain IT jobs also allow for remote work, which offers flexibility.

Let's face it, there are difficulties for women in the tech sector. Working in a field where men predominate frequently entails interpersonal difficulties, prejudice, and sometimes even a lack of support from friends and family.

In order to get support from family and friends while navigating the information technology business, women must be able to communicate effectively. The importance of the industry can be explained to family members in great detail by doing things like active listening, arranging family and one-on-one time, and being courteous and appreciative to everyone.
How do I improve my Data Science skills?
Published: 2023-03-17 11:12:02

There are several ways to improve your data science skills, some of which include:

**Practice:** 
One of the best ways to improve your data science skills is through practice. Work on real-world data science projects, participate in data science competitions and challenge yourself to tackle complex problems.

**Stay up-to-date:** 
Keep up with the latest trends and developments in data science by following industry blogs, attending conferences and webinars, and reading research papers.

**Join a data science community and Online Courses:** 
Join a data science community such as Data Science Central, Kaggle, or Reddit's r/datascience to connect with other data scientists, ask questions, and learn from others. [Data Science Online Course](https://www.edureka.co/executive-programs/advanced-program-data-science-course-iitg) are a great way to learn new skills and techniques. 

**Learn new tools and technologies:** 
Familiarize yourself with the latest tools and technologies in data science such as TensorFlow, PyTorch, or Apache Spark.

**Build a portfolio:** 
Build a portfolio of data science projects to showcase your skills and experience. This can help you stand out when applying for jobs and demonstrate your ability to apply data science techniques to real-world problems.

**Collaborate with others:** 
Collaborate with other data scientists or professionals in related fields such as software engineering, business analytics, or domain expertise. This can help you learn new techniques and approaches, and gain insights from different perspectives.

**Conclusion:**
Remember that improving your data science skills takes time and effort, so be patient and persistent in your efforts to improve. Focus on building a strong foundation in the fundamentals of data science, and then work on building more advanced skills and techniques over time.
Convert everything to a drag and drop input
Tags: javascript, react, webdev
Published: 2023-03-17 11:56:53

## React File Trap

Simple wrapper component that convert child component to a drag and drop file input.

## Demo

[![Edit remark-codesandbox demo](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/react-file-trap-bv386b)

## Installation

Install react-file-trap with [npm](https://www.npmjs.com/package/react-file-trap)

```bash
npm install react-file-trap  
```

## Usage

```javascript
<FileTrap
    ref={wrapperRef}
    allowedExtensions={['jpg', 'png']}
    handleChange={handleChange}
    handleDrag={handleDrag}
    handleDrop={handleDrop}
    onValidationError={onValidationError}
    fileCount={3}
    maxFileSize={2} // MB
    minFileSize={0.1} // MB
    browseOnClick={false}
    >
    <div style={{ margin: 10, border: "2px solid red" }}>
        <h2 style={{ margin: 5 }}>Current Event: {currentEvent}</h2>
        <h2 style={{ margin: 5 }}>Valid File Count: {validFiles.length}</h2>
        <h2 style={{ margin: 5 }}>Invalid File Count: {invalidFiles.length}</h2>
        <h2 style={{ margin: 5 }}>Last Error: {lastError}</h2>
    </div>
</FileTrap>
```

## Props

| Parameter | Type     | Description                |
| :-------- | :------- | :------------------------- |
| `ref` | `ref` | Suggest to use to reset and/or trigger browse outside of child component |
| `allowedExtensions` | `array` | Allowed file extensions |
| `handleChange` | `function` | Runs when selected and/or dropped a valid file |
| `handleDrag` | `function` | Runs for every drag event. Possible values: `dragover` `dragleave` |
| `handleDrop` | `function` | Runs when dropped a file |
| `onValidationError` | `function` | Runs everytime if dropped or selected file invalid |
| `fileCount` | `number` | Allowed file count |
| `maxFileSize` | `number` | Allowed upper limit for file size in MB |
| `minFileSize` | `number` | Allowed lower limit for file size in MB |
| `browseOnClick` | `boolean` | Trigger browse window on click to child component |

For more details about usage, please check example project in the root directory.

## [Github](https://github.com/rasimandiran/react-file-trap)
Using Frontmatter CMS with Astrojs Static Site
Tags: astrojs, frontmattercms
Published: 2023-06-14 14:27:07

---
title: Using Frontmatter CMS with Astrojs Static Site
published: true
date: 2023-03-17 11:48:17 UTC
tags: astrojs, frontmattercms
canonical_url: https://thehigglers.com/blogs/using-frontmatter-cms-with-astrojs-static-site/
---

Recently I was looking for better was to manage the markdown files of for my static blog website and I didnt want to leave behind editor interface just to write a new blog article as I am too lazy to switch between multiple interfaces. Hence while I was searching on the google if any such simple products exsist which looks a CMS.

The IDE i use for my development purpose is VS code hence I thought to search if there is any vscode based solution and as always we think it and VSCode extension is available for the same and I got to know about Frontmatter CMS, which is a CMS right in your code editor as per there website and this looked to be interesting to me hence I thought of exploring the same with my Astrojs based static blog.

Below are my observation about using Frontmatter CMS with Astro js static in VScode is as below:

Here I will first ldown what I was actually looking for and see if frontmatter cms satisfies my needs…

1. What I was looking for is an dashboard kind of interfacew listing blog post?

Yes, Frontmatter CMS once configured provides a nice grid interface listing all the blogs post, it also provides and option to “Create” “Deleted” & “Update” the articles below image shpows how the interface looks like.

1. A nice markdown editor for creating, editing and updating articles ?

This is where I found Frontmatter CMS needs to improve as in the current interface it provides if we try to edit any article it just open a file in vs code which as a claimed CMS should have a proper wisysig editor like Quilljs or editorjs etc.

1. I wanted some frontmatter to be auto populated like published date, last modified date etc..?

Yes, FrontMatter CMS provide this as a feature, I havent yet tried but wanted this feauture for other frontmatters like UUID etc, but I am sure there might be an api to create either a custom field for such custom requirements.

1. Nice interface to select list of tags/categories alsready used in other posts so that duplicated with spelling changes can be avoided like blog & blogs?

Yes, Frontmatter CMS provides a nice interface with select list type of fields and also prepopulates the tags used in all the posts this is done using a content type defination in frontmatter.json file

I am still exploring new features and how it can be used as a CMS in IDE and will keep updateing thos post so that others can also leverage this awesome in IDE CMS for static sites.

You can find more about [Frontmatter CMS](https://frontmatter.codes/) on there official [Website](https://frontmatter.codes/)
CAPSTONE PROJECT
Published: 2023-03-17 11:39:45

You are hired as a DevOps engineer for XYZ.pvt.co, The company is a product based company they are using Docker containers for their containerization inside the company, but in the meantime, the product got a lot of traffic, now they need to have a platform for automating deployment, scaling, and operations of application containers across clusters of hosts, As a DevOps engineer, you need to work on this and implement a DevOps life cycle, such that the Docker containers in the testing environment will not change. 

As the company is a monolithic architecture with 2 developers and the product is present on https://github.com/hshar/website.git 

Following are the specifications of life-cycle:

 o Git workflow should be implemented, as the company is a monolithic architecture you need to take care of versions. The release should happen only on 25 of every month.
 o Code build should be triggered once the commits are made in the master or hotfix branch.
 o The code should be containerized with the help of the Docker file, The Docker file should be built every time if there is a push to git-hub. Use the container with Ubuntu and Apache installed in it. After the build, this container should be pushed to the Docker hub.
 o The above tasks should be done in a Jenkins pipeline with the following jobs.
 o Build website 
o Test website 
o Push to Docker hub 
o Push to production 
o As per the requirement In the production server, you need to use the Kubernetes cluster and the containerized code from Docker hub should be deployed with 2 replicas. Use Kubernetes dashboard for health checks of those containers using dashboard.
 o Once the application is built on the production server you need to design a test case, which will basically check whether the configurations are displaying on the website or not. The test should pass if the configurations are displayed for the product on both the production and testing server. 
o For configuration management of the product, you need to deploy the configuration file in ‘/home/ubuntu’ for the execution of the configuration in both testing and production server.
 o The above task should be accomplished with the help of Ansible roles. 
o Create a monitoring service for the website on the production server. 
o Before that, as a Devops engineer test this monitoring service by stopping the Apache service and check whether the email is sent to you or not.
 Architectural advice:
 Server1 Jenkins master, Nagios master 
Server2 Jenkins slave, Testing server, nrpe plugin, PHP
 Server3 Jenkins slave, production server, nrpe plugin, Kubernetes master, PHP 
Server4 Kubernetes node, nrpe plugin, host machine.
Resolvendo problemas no HackerRank: Uma rotação de array circular
Tags: javascript, beginners, programming
Published: 2023-03-17 11:38:45

Olá, seja bem vindo a mais um Resolvendo problemas no HackerRank: no problema precisamos construir um array giratório que pega o último elemento e o retorna ao início do array, e fará isso por um determinado número de vezes. Vejamos agora.

**Circular Array Rotation**

Neste desafio mental fictício criado, John Watson conhece uma operação chamada rotação circular reta em uma matriz de números inteiros. Uma operação de rotação move o último elemento da matriz para a primeira posição e desloca todos os elementos restantes para a direita. Para testar as habilidades de Sherlock, Watson fornece a Sherlock uma matriz de números inteiros. Sherlock deve executar a operação de rotação várias vezes e determinar o valor do elemento em uma determinada posição.

Para cada array, execute um número de rotações circulares à direita e retorne os valores dos elementos nos índices fornecidos.

- a =[3,4,5] //array
- k=2 // número de rotações em `a`
- queries=[1,2]// lista de indices a relatar.

Vejamos a execução deste código:

```
function circularArrayRotation(a, k, queries) {
    // Write your code here
  for(let i=0; i<k; i++) {
    let lastElement = a.pop()
    a.unshift(lastElement)
  }
  return queries.map(q => a[q]);
}
```
 
A função tem os parâmetros antes descritos( a,k e queries). Criamos um laço de repetição que irá iterar com base no número de rotações destinadas a `k`.

Declaramos uma variável `lastElement`que pegará o último valor de `a`e trocar pela primeira posição. Depois disso retornamos o `queries`com um map. retornando uma nova listagem.

O resultado será:

```
3 2 3
1 2 3
0
1
2

//input abaixo
2
3
1
```

Com isso, concluímos mais um desafio do _Resolvendo problemas no HackerRank:_ . Até a próxima!!!
The Benefits of Agile Methodology in Software Development
Tags: agile, methodology, devlive, software
Published: 2023-03-17 11:25:49

Agile methodology is a popular approach to software development that emphasizes flexibility, collaboration, and continuous improvement. Some of the benefits of using Agile methodology include:

- **Increased speed and efficiency:** Agile methodologies encourage smaller, more frequent releases, which can help reduce time to market and improve development speed.
- **Improved customer satisfaction:** Agile methodologies prioritize customer feedback and involvement, which can lead to a better understanding of customer needs and increased customer satisfaction.
- **Flexibility and adaptability:** Agile methodologies are designed to be flexible and adaptable, allowing for changes to be made quickly and easily in response to changing requirements or circumstances.
- **Increased collaboration and communication:** Agile methodologies emphasize collaboration and communication between team members, which can improve teamwork and productivity.

Overall, Agile methodology can help organizations improve their software development processes by increasing speed, efficiency, and customer satisfaction, while also promoting flexibility, collaboration, and continuous improvement.
GitHub says: Fuzz Your Code! - FuzzingWeekly CW11
Tags: security, testing, fuzzing, cybersecurity
Published: 2023-03-17 11:11:16

GitHub says: Fuzz Your Code!:
https://twitter.com/github/status/1636022681542828033?s=20

If Developers Get Enabled to Test Their Own Code, Everybody Wins:
https://devm.io/javascript/fuzz-testing-jest-jazzer

6 CVEs Fixed in OpenSIPS:
https://nvd.nist.gov/vuln/search/results?form_type=Basic&results_type=overview&query=fuzzing&search_type=all&isCpeNameSearch=false

https://www.fuzztesting.io/fuzzing-weekly

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8fizbb9vv6wpe2uz818g.png)
Product Launch!!
Tags: product
Published: 2023-03-17 11:06:58

Exciting news! 🎉 We launched our No-Code Data Pipelines on Product Hunt!

If you're tired of the frustration and expense of onboarding external data, we have the solution for you.

✅ With our data pipelines, you can easily connect to your customers' systems and seamlessly ingest, map, validate, and clean data without relying on your engineering team. No more impracticable updates or unknown structures - we've got you covered!

We're grateful to be able to bring this solution to you, and we would appreciate your support as we continue to grow. Sign up for our open beta and test it out for free! Your feedback is valuable to us as we work to improve our product.


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


🙏 Thank you for your support! ➡ https://www.producthunt.com/posts/nuvo-no-code-data-pipelines
WordPress Config.php: How to configure the WP_DEBUG variables
Tags: webdev, wordpress, php, beginners
Published: 2023-03-17 11:01:33

hello dear folks 


i m trying to enable basic debug output with WordPress for a plugin I'm developing. I managed to get some so far, but failed to redirect it to wp-content/debug.log. 
I've been roughly following some manualpages 


see Here's what I did:


well i have  added  a tiny  snippet of code to the end of wp-config.php:

`@ini_set ('display_errors', 0);
define ('WP_DEBUG', true);
define ('WP_DEBUG_DISPLAY', false);
define ('WP_DEBUG_LOG', true);
`


**now the question: **what if i want ot disable the outuput. 

well i show you what to do in either case: 

a. **if we want to turn off PHP Errors in WordPress**
For this part, we will need to edit the wp-config.php file.
Inside our wp-config.php file, we now have to look for the following line:

`define('WP_DEBUG', true);
`
It is also possible, that this line is already set to false. In that case, you’ll see the following code:


`define('WP_DEBUG', false);
`
In either case, we need to replace this line with the following code:

`
ini_set('display_errors','Off');
ini_set('error_reporting', E_ALL );
define('WP_DEBUG', false);
define('WP_DEBUG_DISPLAY', false);
`

Well its** important**: we do not have to forget to save the changes and upload the wp-config.php file back to our server.


**Now we can test: **

we have to visit the according website to confirm that the PHP errors, notices, and warnings have disappeared from our website.


if we want to turn on PHP Errors in WordPress

well in the opposite case: if we are working on a website on local server or staging area, then we might want to turn on error reporting. 

In that case we need to edit our wp-config.php file and replace the code we added earlier with the following code:


`define('WP_DEBUG', true);
define('WP_DEBUG_DISPLAY', true);`


**effect**: This code will allow WordPress to start displaying PHP errors, warnings, and notices again.
Playing Around with Prisma
Tags: prisma, ct3a, environmentsetup, typescript
Published: 2023-03-17 10:55:47

**tl;dr**
I'm using [Create T3 App](https://create.t3.gg) to build my personal professional website, which includes a blog, to get familiar with all of the tech stack. I was able to easily find out that I couldn't use multiple databases for different environments, and the [Prisma](https://www.prisma.io/) documentation was really helpful in find out that information.

So I'm building a [Create T3 App](https://create.t3.gg) to renovate my personal professional website, and I'm trying to set up a local database to build out my schema and test out the APIs for my personal professional website/blog and I come across an issue.

I wanted to use sqlite3 locally and PostgreSQL in production, but the Prisma schema no longer allows for multiple datasources.

First I tried adding an environment variable for the provider like so:

```
datasource db {
  provider = env("DATABASE_PROVIDER")
  url      = env("DATABASE_URL")
}
```
but was met with the following error: `A datasource must not use the env() function in the provider argument.`

That knocked one potential path out of the game. So then I tried adding multiple providers using an array.

Previously, if you wanted to use a different database locally than in production, you could do something like:

```
datasource db {
  provider = ["postgresql", sqlite"]
  url      = env("DATABASE_URL")
}
```
but when I entered that, I was met with this error: `Error validating datasource 'postgresql': You defined more than one datasource. This is not allowed yet because support for multiple databases has not been implemented yet.`

Luckily the team over at Prisma made sure we knew what the deal was, so they gave us a heads up [in the docs](https://www.prisma.io/docs/concepts/components/prisma-schema/data-sources):

![Prisma documentation detailing only one datasource allowed](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/v40c8gild615ag2op3gl.png)

as well as linked us to the [GitHub deprecation issue](https://github.com/prisma/prisma/issues/3834), which outlined the implications of this deprecation:

![GitHub issue detailing implications of removal of multiplr datasources](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zywkxjwyzebjqk58z1jb.png)

I ended up setting up PostgreSQL locally as well, which they provided [instructions on how to do](https://www.prisma.io/dataguide/postgresql/setting-up-a-local-postgresql-database#setting-up-postgresql-on-macos).

All in all, I'm having a great time building this project because of the great documentation by the Prisma team.