teleren/devto huggingface dataset:
how to validate ship address in the USA using JavaScript
Tags: chatgpt, javascript, validation, programming
Published: 2023-05-04 21:05:14

---
title: how to validate ship address in the USA using JavaScript
published: true
description: 
tags: chatgpt, javascript, validation, programming
# cover_image: https://direct_url_to_image.jpg
# Use a ratio of 100:42 for best results.
# published_at: 2023-05-04 21:02 +0000
---

To validate a shipping address in the USA using JavaScript, you can use the Google Maps Geocoding API or other similar APIs. Here's an example using the Google Maps Geocoding API:

1. First, you'll need to sign up for a Google Maps API key: https://developers.google.com/maps/gmp-get-started#create-project

2. Include the Google Maps API script in your HTML file:

```
<!DOCTYPE html>
<html>
  <head>
    <script async defer src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"></script>
  </head>
  <body>
    <!-- Add your HTML content here -->
  </body>
</html>

```

Replace YOUR_API_KEY with the key you got from Google Cloud Platform.


3. Write a function to validate the shipping address:

```
function validateShippingAddress(address, callback) {
  const geocoder = new google.maps.Geocoder();

  geocoder.geocode({ address: address, componentRestrictions: { country: 'US' } }, function (results, status) {
    if (status === google.maps.GeocoderStatus.OK) {
      const formattedAddress = results[0].formatted_address;
      const location = results[0].geometry.location;
      callback(true, formattedAddress, location);
    } else {
      callback(false);
    }
  });
}

```

4. Use the validateShippingAddress function to validate user input:


```
const userAddress = '1600 Amphitheatre Parkway, Mountain View, CA';

validateShippingAddress(userAddress, function (isValid, formattedAddress, location) {
  if (isValid) {
    console.log('Valid address:', formattedAddress);
    console.log('Latitude:', location.lat());
    console.log('Longitude:', location.lng());
  } else {
    console.log('Invalid address');
  }
});

```

Keep in mind that using the Google Maps API might incur costs depending on your usage. There are also other APIs available that you can use to validate shipping addresses, such as the USPS Web Tools API, SmartyStreets, or EasyPost. Make sure to review their respective documentation and pricing to find the best fit for your needs.


Article created by ChatGPT4 (OpenAI).
Agile Maturity Assessment
Tags: agile
Published: 2023-05-04 17:23:05

>  You cannot improve anything that you cannot measure.

For teams on a Agile transformation journey, they may want to know at how mature they are. While I'm not a fan of ranking teams based on their maturity index (or similar), I think, within the team such assessments can be good starting points to identify what they have to focus on. In such cases, I've found James Shore's [agile maturity assessment](https://www.jamesshore.com/v2/books/aoad1/assess_your_agility) to be a useful tool.

This is a self-assessment for a team on 5 different sections.

1. Thinking - Awareness of what you're doing, why you're doing
2. Collaborating - Software development is a team activity.
3. Releasing - Pushing the software to production.
4. Planning - Don't strive to plan everything upfront. Adapt it as you go.
5. Developing - Is not just coding. It is the art of crafting a well rounded software.

Each section has a few questions that carry different weights. Every team member needs to take this assessment individually and plot their score on a [spider chart](https://www.jamesshore.com/downloads/art-of-agile/assessment-chart.pdf). A collective view of this, can provide immense insights for a team on where they stand. You can classify it into two buckets

1. Areas of improvement - a relatively low score in a particular section, from every member of the team is a clear indicator of an improvement area for the team.
2. Gaps in understanding - difference in scores for a particular section is a clear indicator of the gaps on how the team feels it is doing.

The team can then brainstorm and come up with action items for themselves.

As mentioned above, the individual scores in themselves are not valuable, whereas the collective view of the team is. Therefore, comparing teams based on these scores does not make sense as well. I strongly believe, the business outcomes should give us the right feedback on the transformation.

Further reading:

- [James Shore on Agile Fluency](https://www.youtube.com/live/qt6SN6jhacc)
- [The Agile Fluency Model](https://martinfowler.com/articles/agileFluency.html)
- [The Art of Agile Development](https://www.jamesshore.com/v2/books/aoad2)
VPNs: Legal or Illegal?
Published: 2023-05-04 20:14:15

VPN’s main task is to add an extra layer of privacy and security to online activities. VPNs can be used in a variety of ways: 

Governments and corporations use VPNs to secure their workplace

VPNs can help secure personal data while using public WiFi

VPN s can conceal illegal activity, such as stealing copyrighted material 

Because some, unfortunately, do use VPNs for illegal matters, some countries have made the use of VPNs illegal. Other countries allow the use VPNs if no illegal activity is being done while using one.
[PT-BR] Melhorando seu vocabulário de inglês com o terminal.
Tags: terminal, braziliandevs
Published: 2023-05-04 20:09:10

Então você quer ganhar mais vocabulário?

Pois anote essa dica para receber citações com palavras novas e até inusitadas toda vez que abrir seu terminal.

Vos apresento o fortune!

![Terminal emulator showing a Shakespeare's book excerpt](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/r84mc042dgzxsicl2gb9.png)

Ainda dá para deixar mais legal as citações, que tal usar o cowsay junto?


![Cowsay hello world!](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b2twlss3i5p7j76p6jpa.png)


![Fortune | cowsay](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ahqxhljk5yxzculm60p4.png)

![Fortune | cowsay -f duck](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bjehoog2lwaevjxzhcyu.png)



Para instalá-los em base ubuntu (btw I use pop-OS):

```
sudo apt install fortune cowsay
```
Você deve deve conseguir instalar em qualquer distro 
ou em qualquer versão do MacOS.

Agora que você já os instalou basta adicionar ao seu .bashrc ou equivalente a seguinte linha logo no início:

```
fortune | cowsay
```
Ambos pacotes tem vários argumentos, eu mesmo uso o de frases curtas e o cowsay com desenho de pato:

```
fortune -s| cowsay -f duck
```

Por favor, dicas e comentários são bem vindos! 
Eu sei que tem outros scripts bem legais e pacotes interessantes que são utilizados como mensagem de boas vindas no terminal mas é sempre legal saber mais.
:)
Higher-Order Functions in Javascript
Tags: javascript, beginners
Published: 2023-05-04 20:09:02

## What are `HoF`'s and Why Should We Use Them?

Javascript functions that take in another function as an argument or return another function are called higher-order functions. Using these functions allows us to save time, write cleaner code, and reduce the possibility of typing errors. Let’s take a look at each type.

## Type 1: What are Functions That Take Another Function as an Argument?
Suppose we need to write several functions so we can add different types of punctuation to an array of names. Instead of writing similar code multiple times, we can write a single `HoF` that takes in a function as an argument. Here’s an example:

```
function arrayPunctuation(array, func) {
   var newArray = [];
   for (let i = 0; i < array.length; i++) {
      newArray.push(func(array[i]));
   }
   return newArray;
}
```
This function can then be used to add different types of punctuation to each element in an array, depending on the function we pass in as an argument. For example, we might pass in a function which `capitalizes` each element:

```
function capitalize(string) {
   return string.toUpperCase();
}

var capital = arrayPunctuation(['John', 'Mary'], capitalize);
console.log(capital);  // output: ['JOHN', 'MARY']
```
Similarly, we can call the function and pass in a function that adds a `comma` after each element:

```
function addComma(string) {
   return `${string},`;
}

var comma = arrayPunctuation(['John', 'Mary'], addComma);
console.log(comma);  // output: ['John,', 'Mary,']
```
Or call the function and pass in a function that adds the title of `Dr.` before each element:

```
function addTitle(string) {
   return `Dr. ${string}`;
}

var title = arrayPunctuation(['John', 'Mary'], addTitle);
console.log(title);  // output: ['Dr. John', 'Dr. Mary']
```

## Type 2: What are Functions That Return Another Function?
Now suppose we need to write several functions so we can add different types of punctuation to the end of a string. Instead of writing similar code multiple times, we can write a single `HoF` that returns a function. Here’s an example:

```
function stringPunctuation(string) {
   return function(punctuation) {
      return string + punctuation;
   }
}
```
This function can then be used to add different types of punctuation to the end of a string, depending on the arguments we pass in. For example, we can call the function and pass in the strings `Where` and `?`.

```
var question = stringPunctuation(`Where`)(`?`);
console.log(question);  // output: `Where?`
```
Or we can call the function and pass in the strings `Wow` and `!`.

```
var exclamation = stringPunctuation(`Wow`)(`!`);
console.log(exclamation);  // output: `Wow!`
```

## Summary
In this article, we've learned about the importance of using higher order functions. By using these functions we can break our code into smaller chunks, which makes it easier to understand and debug. We can also speed up the development process.  `HoF`'s are a powerful addition to our coding toolbox.
Flutter KFC Login Ui
Tags: flutter, mobile, development, developer
Published: 2023-05-04 20:06:55

[GitHub](https://github.com/iamdastani/KFC-Flutter-App-Login-Ui)

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

```
`import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

class Login extends StatelessWidget {
  const Login({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: Column(
        children: [
          SizedBox(
            height: 100,
          ),
          SizedBox(
            height: 300,
            width: 300,
            child: Center(
              child: Image(
                  image: NetworkImage(
                      'https://1000logos.net/wp-content/uploads/2017/03/Kfc_logo-768x432.png')),
            ),
          ),
          SizedBox(
            height: 50,
          ),
          Center(
            child: SizedBox(
              width: 350,
              height: 100,
              child: TextFormField(
                keyboardType: TextInputType.emailAddress,
                decoration: InputDecoration(
                    label: Text('Enter Email'), prefixIcon: Icon(Icons.mail)),
              ),
            ),
          ),
          SizedBox(
            height: 10,
          ),
          SizedBox(
            height: 100,
            width: 350,
            child: TextFormField(
              keyboardType: TextInputType.visiblePassword,
              obscureText: true,
              decoration: InputDecoration(
                  label: Text("Enter Password"),
                  prefixIcon: Icon(Icons.lock),
                  suffixIcon: Icon(Icons.remove_red_eye)),
            ),
          ),
          Text("Forget Password?"),
          SizedBox(
            height: 50,
          ),
          ElevatedButton(
            style: ElevatedButton.styleFrom(
              primary: Colors.red, // background color
              onPrimary: Colors.white, // text color
              minimumSize: Size(200, 50),
              shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.circular(20.0),
              ), // set minimum size
            ),
            onPressed: () {
              // do something when the button is pressed
            },
            child: Text('Login'),
          ),
        ],
      ),
    );
  }
}`
```
Commit Teller - The implementation
Tags: githubhack23, java, quarkus, programming
Published: 2023-05-04 20:06:25

## How will it be implemented?

As a Java developer I wanted to stick to Java, and I love the [Quarkus](https://quarkus.io/) project, so I thought I will create a CLI application that can do the job, a CLI app that can be the backend of the GitHub action.

## Integration points

In the CLI application I need two integration points:
- One to the GitHub API - It can return me the issues, pull requests and it can create me comments on any of them.
- The other to the OpenAI, this is basically the brain of the stories, this will be able to parse, and interpret your commit messages and create the story about that.

## Setup

The project will contain 2 modules:
- One will be the core
- And the other one will be the CLI module.

I'm just used to these setup, because if the core module contains the core "business" logic I can easily use it for other modules as well, like for a [JBang](https://www.jbang.dev/) script or for a [Maven](https://maven.apache.org/) plugin easily.

With this setup I can "practice" the setup of multi-module projects with Quarkus. While it is probably super straightforward for other frameworks or pure Java projects, in case of Quarkus, if the developer would like to use the super power of the framework, the [developer mode](https://quarkus.io/guides/dev-mode-differences) or the [continuous testing](https://quarkus.io/blog/quarkus-2-0-0-alpha2-released/) then the core module must include the [Jandex](https://quarkus.io/guides/maven-tooling#multi-module-maven) Maven plugin to make sure the mentioned stuff is working well.

## Uber-JAR
I'm planning to bundle the CLI application as an [Uber-JAR](https://imagej.net/develop/uber-jars) that will contain all the necessary dependencies for the application and anybody with Java on their system will be able to run it.

## How about compiling it to native?

A few weeks ago I started [another project](https://github.com/rodnansol/jbang-catalog-document-generator) with Quarkus and I was surprised that the native compilation is getting faster and faster, I do not say it is like lightning fast, but I was shocked that a CLI app with two modules and with a few dependencies was compiled in less than 2 minutes to native mode.

In 2019 when Quarkus was released with its GraalVM integration it was not that easy to setup the whole environment, but today the Quarkus plugins (Maven or Gradle) are super smart and even if there is no GraalVM (or Mandrel) installed on the machine, if it detects Docker it can compile it to native, and on the other hand Quarkus devs also recommend to use the Docker way, because if it is being built on your local machine, you might misses some crucial dependencies, and it may run on your system but not on others.

We will see if we can compile it to native and host it as a Docker image.

## What is ready from the implementation?

Almost nothing, only a small PoC that can connect to the GitHub API and to the OpenAI's API.

Stay tuned for more and leave feedback about the project idea.
Guide to React leaflet
Tags: webdev, react, leaflet, tutorial
Published: 2023-05-04 19:51:19

React Leaflet provides bindings between React and Leaflet. It uses Leaflet to abstract Leaflet layers and turn them into React components, not replacing Leaflet.

React-leaflet is very easy to implement. But the official documentation is a little vague to me. So here are we,

**STEP - 1 // Installing React-Leaflet as dependency**

`npm install react-leaflet`

`yarn add react-leaflet`

**STEP - 2 // Importing components**

All the components and hooks can be imported from the module entry-point:

```jsx
import { MapContainer, Marker, Popup, TileLayer, useMap } from 'react-leaflet'
```

For TypeScript only 

``` 
yarn add -D @types/leaflet
```
 
**STEP - 3 // Creating map component**

``` jsx
<MapContainer center={[38.706928957217166, 35.51448175987359]} zoom={13} scrollWheelZoom={true}>
                <TileLayer
                   
                    url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
                />
                <Marker position={[38.706928957217166, 35.51448175987359]}>
                    <Popup>
                        popup <br /> message.
                    </Popup>
                </Marker>
            </MapContainer>
```

**STEP - 4 // Adding CSS style to show map properly**

```css
  .leaflet-container{
    width: 100vw;
    height: 100vh ;
  }
```

You are all set. This is the basic usage of leaflet. See the official documentation for more customization. Have fun!
[https://www.npmjs.com/package/react-leaflet](https://www.npmjs.com/package/react-leaflet)
[https://react-leaflet.js.org/docs/start-installation/](https://react-leaflet.js.org/docs/start-installation/)
[https://leafletjs.com/](https://leafletjs.com/)
[https://github.com/PaulLeCam/react-leaflet](https://github.com/PaulLeCam/react-leaflet)
Modern Cloud Workflow with Pebl - Part 3
Tags: devops, cloud, infrastructure, pebl
Published: 2023-05-04 19:18:17

In part 2 we added redis to our application.

In part 3 we are going to explore the object store interface that pebl provides by incorporating it into our application.

## Pebl's Object Store Interface

Object stores like S3 have become essential to cloud workloads. They provide massive scalability and a simplified storage model in which an object is the core building block. However utilizing them can be quite complicated, as we need to learn the intricate implementation details of the underlying system.

With pebl we provide the object store as a pseudo filesystem. This means that you access the remote files as if they were on a local filesystem with `pebl.open`. This gives you access to object store capabilities with the intuitive notion of files:

```python
import pebl

with open("local_file", "w") as f:
  f.write(b"hello!\n")

with pebl.open("cloud_file", "w") as f:
  f.write(b"world!\n")
```

In a similar fashion, accessing an object is done as a read operation:

```python
import pebl

with pebl.open("cloud_file", "r") as f:
  data = f.read(7).decode()
  print(data)
```

## Simple Example

The key benefit of this interface is that you can easily interlace object store operations anywhere in your code. So try extending the Flask example we've been working with to utilize the object store. Perhaps you can try creating logs for each request and response pair using [Flask's after request handler](https://flask.palletsprojects.com/en/2.2.x/api/#flask.Flask.after_request), or maybe you can try managing user uploaded content such as profile images.

## Inspecting

Once you have deployed your project that utilizes cloud storage, you can rely on
pebl's console in order to inspect any storage blobs.

  1. First navigate to pebl's console at https://www.pebl.io/console.

  2. Then select the objects tab on the left.
  ![Example console showing the new objects tab](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4liir89at9ffbknxyj6q.png)

You should see a full list of all blobs you have used, with their name and size.
Clicking on any blob name will download them so that you can easily inspect their
content.

## Next in Part 4

In part 4 we will cover how to use scheduled tasks.
How to share envs in a monorepo with vite and nextjs apps
Tags: monorepo, shared, envs
Published: 2023-05-04 19:11:09

---
title: How to share envs in a monorepo with vite and nextjs apps
published: true
description: To share environment variables between two projects in a monorepo, with specific prefixes for each project, you can create a .env.shared file with common environment variables and then use scripts to create specific .env files for each project.
tags: monorepo, shared, envs
# cover_image: https://direct_url_to_image.jpg
# Use a ratio of 100:42 for best results.
# published_at: 2023-05-04 19:06 +0000
---

To share environment variables between two projects in a monorepo, with specific prefixes for each project, you can create a `.env.shared` file with common environment variables and then use scripts to create specific .env files for each project. Here's how to do that:

Create a .env.shared file at the root of the monorepo with the common environment variables:

```
SECRET_KEY=your_secret_key
API_URL=your_api_url
```

Create a script to generate specific .env files for each project. In the example below, we will create a generate-env.js file at the root of the monorepo:

```
// generate-env.js
const fs = require('fs');
const path = require('path');

const envShared = path.join(__dirname, '.env.shared');
const envVite = path.join(__dirname, 'vite-project', '.env');
const envNext = path.join(__dirname, 'next-project', '.env');

const sharedVars = fs.readFileSync(envShared, 'utf-8').split('\n');

const viteVars = sharedVars.map((line) => {
  if (line.startsWith('SECRET_KEY') || line.startsWith('API_URL')) {
    return `VITE_PUBLIC_${line}`;
  }
  return line;
});

const nextVars = sharedVars.map((line) => {
  if (line.startsWith('SECRET_KEY') || line.startsWith('API_URL')) {
    return `NEXT_PUBLIC_${line}`;
  }
  return line;
});

fs.writeFileSync(envVite, viteVars.join('\n'), 'utf-8');
fs.writeFileSync(envNext, nextVars.join('\n'), 'utf-8');
```

Run the generate-env.js script to generate the specific .env files for each project:


```
node generate-env.js
```

This will create an .env file in the vite-project folder with environment variables prefixed with `VITE_PUBLIC_` and an .env file in the next-project folder with environment variables prefixed with `NEXT_PUBLIC_`.

Now, each project will have its own .env file with the correctly prefixed environment variables. Be sure to add the generated .env files to your .gitignore rules to prevent committing sensitive information to the repository.

Remember to run the `generate-env.js` script whenever you make changes to the .env.shared file to update the specific project .env files. You can also add this script as a step in your build or deployment process.
Django for Beginners
Tags: django, beginners, python, programming
Published: 2023-05-03 09:32:27

🌟 Completely updated for Django 4.2! 🌟



Django for Beginners is a project-based introduction to Django, the popular Python-based web framework. Suitable for total beginners who have never built a website before as well as professional programmers looking for a fast-paced guide to modern web development and Django fundamentals.

In the book you’ll learn how to:

Build 5 websites from scratch, including a Blog and Newspaper website
Deploy online using security best practices
Implement signup, login, logout, password change, and password reset
Customize the look and feel of your sites
Write tests and run them for all your code
Add permissions and authorizations to make your app more secure
If you’re curious about Python-based web development, Django for Beginners is a best-practices guide to writing and deploying your own websites quickly.

FAQ

Who are you?

Hi, I'm William Vincent. I have used Django since 2012 and am a former Board Member of the Django Software Foundation. I co-host the Django Chat podcast, co-write the weekly Django News newsletter, and gave conference talks at DjangoCon US 2018, 2019, and 2022.

What's included?

A PDF watermarked with your email address and an ePub file for each book. Source code is available on GitHub. Updates for future editions (I have updated the book since Django 1.11) are automatically included.

Can I receive an invoice?

Yes! Gumroad will send you a receipt with a "generate" button to turn it into an invoice so you can be reimbursed by your employer.

if you are interested [check more](https://wsvincent.gumroad.com/l/aFiMm?a=551409363)