teleren/devto huggingface dataset:
Drawing cycloids with a specific number of cusps using Spyrograph
Tags: python, showdev, opensource, tutorial
Published: 2023-03-30 14:00:00

*DISCLAIMER: This blog post was written by a human with the help of AI*

In this blog post, we will explore a powerful feature of the `spyrograph` package: the ability to create and draw cycloids with a **specified number of cusps**

Cycloids are **special cases** of trochoids where the **distance** parameter `d` is **equal** to the rolling circle **radius** `r`

By using the `n_cusps` class method provided in the `Hypocycloid` and `Epicycloid` classes, we can easily create beautiful **cycloid** shapes with a desired number of cusps

---

## Table of contents

- [Prerequisite imports](#prerequisite-imports)
- [Creating a cycloid with a specified number of cusps](#creating-a-cycloid-with-a-specified-number-of-cusps)
- [Tracing the cycloid with `trace`](#tracing-the-cycloid-with-trace)
- [Conclusion](#conclusion)

{% github https://github.com/chris-greening/spyrograph %}

---

## Prerequisite imports <a src="#prerequisite-imports"></a>

Before we begin, let's make sure we have the `spyrograph` package **installed**:

```bash
pip3 install spyrograph
```

---

## Creating a cycloid with a specified number of cusps <a src="#creating-a-cycloid-with-a-specified-number-of-cusps"></a>

To create a cycloid with a specified number of cusps, we can use the `n_cusps` class method. Here's a quick example of how to create a **hypocycloid** with **5 cusps**:

```python
from spyrograph import Hypocycloid
import numpy as np

R = 50
n = 5
thetas = np.arange(0, 2 * np.pi, 0.01)

hypocycloid = Hypocycloid.n_cusps(R=R, n=n, thetas=thetas)
```
In this example, we set the radius of the fixed circle `R` to `50` and the desired number of cusps `n` to `5`. The `n_cusps` method calculates the rolling circle radius `r` as `R/n` and instantiates a cycloid object with the provided parameters

---

## Tracing the cycloid with `trace` <a src="#tracing-the-cycloid-with-trace"></a>

Now that we have created a hypocycloid with 5 cusps, let's **trace** it using the `trace` method provided by the `spyrograph` package

```python
hypocycloid.trace(exit_on_click=True)
```

![Tracing of a hypocycloid with 5 cusps being drawn](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gard09cqqm57rix0x3qg.gif)

The `trace` method will display an animation of the cycloid shape being drawn

The `exit_on_click` argument ensures that the **animation window remains open** until you click on it

---

## Conclusion <a src="#conclusion"></a>
The `n_cusps` class method in the `Hypocycloid` class is a powerful and **easy-to-use** feature for creating and drawing cycloid shapes with a specified number of cusps

By using this method, artists and educators alike can create **visually stunning** and mathematically precise cycloids in a matter of seconds

Give it a try and unlock your creativity with the `spyrograph` package today!
Top 3 text editors
Tags: webdev, programming, beginners
Published: 2023-03-30 13:58:40

The top 3 text editors are:

1. visual studio code
2. Atom
3. Sublime

## Visual studio code
Visual Studio Code, also commonly referred to as VS Code, is a source-code editor made by Microsoft with the Electron Framework, for Windows, Linux and macOS. Features include support for debugging, syntax highlighting, intelligent code completion, snippets, code refactoring, and embedded Git.
Download link: https://code.visualstudio.com/download

## Atom
Atom is a deprecated free and open-source text and source code editor for macOS, Linux, and Windows with support for plug-ins written in JavaScript, and embedded Git Control. Developed by GitHub, Atom was released on June 25, 2015.
Download link: https://github.blog/2022-06-08-sunsetting-atom/

## Sublime
Sublime Text is a shareware text and source code editor available for Windows, macOS, and Linux. It natively supports many programming languages and markup languages. Users can customize it with themes and expand its functionality with plugins, typically community-built and maintained under free-software licenses.
Download link: https://www.sublimetext.com/3
Getting formik dirty values on submit
Tags: react, frontend
Published: 2023-03-30 13:54:07

Formik is a react library to build forms, you register the values and send them in your onSubmit function. If you have an API Route that does a put, everything goes right, but you send more data than necessary in a patch.

So, how to get only dirty values in formik?

To do this, we need to compare it's current value on submit with it's initial value.

Let's start configuring formik data:
```ts
type PersonParams = {
  name: string;
  age: string;
};

const person = {
  name: 'vinicius',
  age: '19',
};

const Component = () => {
  const onSubmit = async (values: PersonParams) => {
    const payload = values;
  }
  
  const formik = useFormik<PersonParams>({
    initialValues: {
      name: person.name,
      age: person.age,
    },
    onSubmit,
  });

  const { initialValues } = useFormik(formik)
};
```

The form starts with `name = 'vinicius'` and `age = 19`. Now, imagine the user changes age to `20` and submits the form. All fields will be sent, including `name` which has not been changed.

Now let's create a function to get only dirty values:

```ts
const getDirtyValues = <T>(values, initialObject: T): object => {
  const data = { ...values };
  const keyValues = Object.keys(data);

  const dirtyValues = keyValues.filter(
    (keyValue) => data[keyValue] !== initialObject[keyValue],
  );

  keyValues.forEach((key) => {
    if (!dirtyValues.includes(key)) delete data[key];
  });

  return data;
};

export { getDirtyValues };
```

The function compares the current value with the initial value, if it is equal, it deletes.

Now instead submit all values, we call `getDirtyValues` function to get only dirty values.

```ts
const onSubmit = async (values: PersonParams) => {
    // payload = { age: '20' }
    const payload = getDirtyValues<PersonParams>(values, initialValues);
  }
```

That it's all, now we can get only the dirty fields and send them in our patch.

---

Gist: https://gist.github.com/vinibgoulart/845aefd6cd5c086417c7933e6760fbc6

---

See more in [zettelkasten](https://vinibgoulart.github.io/zettelkasten/)

---

Foto de <a href="https://unsplash.com/pt-br/@norevisions?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">No Revisions</a> na <a href="https://unsplash.com/pt-br/fotografias/cpIgNaazQ6w?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a>
Homepage Customer Counter Js Code
Tags: codepen
Published: 2023-03-30 13:52:22

<p>This JavaScript code displays a customer counter on the homepage of a website. When the user scrolls down to the area where the counter is located, the count starts and increments from 0 to a specified value (in this case, 3000). The code uses a "counter" class and the "data-count" attribute to get the target count from another file</p>

{% codepen https://codepen.io/azmideliaslan/pen/PodvGeg %}
Email marketing ROI (Return On Investment)
Published: 2023-03-16 17:50:14


![20fix.com Create Email with drag & drop editor](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/g0k5hifh03ftpfzu35dp.jpg)

**Email marketing** has long been a popular and effective way for businesses to reach out to **potential and existing customers**. One of the biggest advantages of email marketing is its high According to recent studies, email marketing has an average **ROI of 42:1**, which means that for every $1 spent on email marketing, businesses can expect to **earn $42** in return.

There are several factors that contribute to the high ROI of email marketing. One of the key factors is the ability to target specific audiences with personalized messages. By segmenting their email lists and sending targeted messages, businesses can increase the relevance and effectiveness of their email campaigns.
Another factor is the low cost of email marketing compared to other forms of marketing. With email marketing, **businesses can reach a large number of people** with minimal costs, making it an affordable and cost-effective marketing strategy.

Email marketing also offers a high level of measurability, which allows businesses to track the success of their campaigns and make adjustments based on the results. By analyzing metrics such as open rates, click-through rates, and conversion rates, businesses can optimize their email campaigns for maximum effectiveness.

Finally, **email marketing** offers a high level of flexibility and customization, allowing businesses to create campaigns that align with their branding and messaging. With a variety of design templates and customization options, businesses can create email campaigns that stand out and engage their audience.

Overall, email marketing offers a **high ROI** and numerous benefits for businesses looking to reach out to potential and existing customers. By leveraging the power of email marketing, businesses can increase, and ultimately **drive sales and revenue growth**.

Create and send professional emails – incredibly fast and easy with <https://20fix.com>!
Using Cypher Queries For Manipulating Graphs | Apache AGE
Tags: apacheage, cypher
Published: 2023-03-30 13:16:38

Greetings!

As you all know, cypher queries are on the stage. So let's see how we can use them to create and fetch data.

Now cypher queries follow a particular syntax, so make you do not make any mistakes. Or even you do, no problem, that's the way to learn!

First, suppose we have to create a connection between two nodes using of course an edge, we would have to write the following query:

**SELECT * FROM cypher('demo', $$ CREATE (:node)-[:edge] ->(:node) $$) AS (a agtype);**

The above command will create two nodes and an edge between them and return the result an an 'agtype'.

Now, let's see how to retrieve these connections based on some criteria to match.

**SELECT * FROM cypher('demo', $$ MATCH (n) RETURN n $$) AS (a agtype);**

This command will return all the relations that match our criteria as an agtype.

https://age.apache.org/
https://github.com/apache/age

That's all for now guys!

Good Bye!
How I can speed up a lateral join (or avoid it at all)
Tags: help, postgres
Published: 2023-03-30 13:07:14

In my case: 
https://dba.stackexchange.com/q/325355/118215

I have a table:
```
create table "appointments"(
    id SERIAL PRIMARY KEY,
    client_id INTEGER NOT NULL,
    appointment_timestamp TIMESTAMP WITHOUT TIME ZONE NOT NULL,
    store_id INTEGER NOT NULL,
    CONSTRAINT fk_user FOREIGN KEY(client_id) REFERENCES "client"(id),
    CONSTRAINT fk_store FOREIGN KEY(store_id) REFERENCES "store"(id)
);
```

I want in it to find the most recent appointment in appointments for each user. An approach of mine is to use a lateral join:

```
select 
 * 
from 
 "client"
 left join lateral (
   select 
       * 
   from 
      appointments join store on  appointments.store_id = store.id
   where appointments.client_id = client.id 
  order by appointment_timestamp DESC
  limit 1
 ) as latest_appointment on true
``` 

But seems kinda slow to me. Is there a way to speed it up?
Creating A Graph | Apache AGE
Tags: apacheage
Published: 2023-03-30 13:02:53

Hi Guys!

This is going to be a short one. We are just going to see how to create a graph in the database.

This is a simple procedure and just requires to run a command and provide with the graph name.

So run the following command in **psql**.

**SELECT create_graph('demo');**

Now for successful creation, it will display a success message and since we have also used the SELECT command, it will also return the initial state of the graph which would only contain 1 empty row.

We are going to see how to use cypher queries to manipulate graphs in the next blog.

https://age.apache.org/
https://github.com/apache/age

See you there!
The Role of Apache Age in Managing Graph Databases
Published: 2023-03-30 12:59:37



**Introduction:**
In the modern business world, data plays a vital role in making informed decisions. As companies generate a large amount of data every day, it is necessary to store and analyze it to gain insights into business operations. Traditional databases are not always sufficient for storing and analyzing complex data, particularly when dealing with relationships between data points. This is where graph databases come in, using nodes and edges to represent data points and their relationships, respectively.

**The Role of Apache Age:**
Apache Age is a distributed graph database built on PostgreSQL and is one of the most popular open-source graph databases available. It provides a scalable and efficient solution for storing and querying large graph datasets. Additionally, it is compatible with other graph databases, such as Neo4j and JanusGraph, making data migration easier.

**Key Features of Apache Age:**
One of the essential features of Apache Age is its ability to handle large datasets. It uses a distributed architecture that allows it to scale horizontally, maintaining performance while handling large datasets. Moreover, it provides a powerful query language called Cypher, specifically designed for graph databases, making querying easier for non-experts.

Another key feature of Apache Age is its support for graph algorithms. Graph algorithms are mathematical algorithms used to analyze graphs. Apache Age provides several built-in graph algorithms, such as PageRank, Shortest Path, and Betweenness Centrality, allowing users to gain insights into the relationships between data points and make informed decisions.

**Conclusion:**
Graph databases are crucial in today's data-driven world, offering an efficient solution for storing and analyzing complex relationships between data points. Apache Age, as a powerful tool for managing graph databases, is an excellent choice for companies that require large graph datasets. With its scalability, compatibility, and support for graph algorithms, Apache Age is driving the growth and development of graph databases.


[Apache-Age:-https://age.apache.org/](https://age.apache.org/)
[GitHub:-https://github.com/apache/age](https://github.com/apache/age)
APACHE AGE & PostgreSQL | Alternate Way To Load AGE
Tags: postgres, apacheage, c
Published: 2023-03-30 12:54:02

Hi!

Sometimes configuring 'postgresql.conf' does not work properly and the system does not seems to have 'age' loaded. I faced this problem so I thought of sharing it with others who might be facing it too.

So let's get started.

First of all, we have to run the following command:

**bin/createdb --port=5430 demo**

Use the port number suitable for you and again your custom db name, here it's demo.

One more thing to note is that here we are actually creating the database with 'createdb' command while with 'initdb', we just initialized the database cluster.

Now we have to start "**psql**", its a command-line tool to run queries.

**bin/psql --port=5430 demo**

After the running this command, you should see a different prompt for the following lines.

Here we can write our queries for manipulating the database.

To load age, follow the steps described below.

Run commands in the following sequence:

**CREATE EXTENSION age;
SET search_path TO ag_catalog;
LOAD 'age';**

That should load age in the database and make it ready to run age queries. Make sure to end each command with a semi-colon "**;**" or else it would not work correctly.

https://age.apache.org/
https://github.com/apache/age

See You Soon!
Building a new type of testing framework
Tags: opensource, testing, javascript, discuss
Published: 2023-03-30 12:34:00

**Hi Community!**
Looking forward to hearing your thoughts on this.

[Jest-opentelemetry](https://github.com/traceloop/jest-opentelemetry) was created out of a pain that @galklm and I felt when working on complex systems with multiple side effects, some of which happen asynchronously. People were changing the code of different services frequently, but weren't always aware of the dependencies across the system. So often, things would break - resulting in us up at 4am debugging the issue and reverting some recent deployments.

![Complex Architecture](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4daexc6bow9setich7mc.png)

We were basically missing a way to make sure that all side effects always happen, even when we change the code of different microservices.

Most testing frameworks out there are testing the frontend but for some reason, only a few focus on backend and integration tests.

## Validating side-effects with telemetry data

Enter [OpenTelemetry](https://opentelemetry.io/). Don't worry if you're not familiar with it (although it's the [2nd largest CNCF project!](https://www.cncf.io/blog/2023/01/11/a-look-at-the-2022-velocity-of-cncf-linux-foundation-and-top-30-open-source-projects/)) - it's just a standard protocol for reporting traces, logs and metrics from production services.
We realized it's a great way to observe all the side effects as they happen within the system. We can send a request to the system and then validate side-effects using the OpenTelemetry data coming out of the system.

![Jest-OpenTelemetry Architecture](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kd99bsm307u0c9mm73ff.png)

We wanted to make it easy to validate any side effect. So you should be able to validate that an e-mail gets sent by writing: 

```ts
expectTrace(t)
    .toSendEmailWithSendGrid()
    .withRecipient('someone@gmail.com')
    .withBody('Your order is ready!')
```

Behind the scenes, this should look for a span (=part of a trace) with a POST request to SendGrid with the appropriate parameters.

## Next Steps

We try to constantly add more high-level constructs so more side effects on systems (like Snowflake, Stripe, BigQuery, Segment, and others) can be tested.

What are your thoughts about the need for such a framework? Have you ever needed to write integration tests in that way? What would you expect to see here?

Feel free to comment here or at our Github page https://github.com/traceloop/jest-opentelemetry
Introduction to Data Version Control for Data Scientists
Published: 2023-03-30 12:33:33

Hello there! Here's a detailed introduction to Data version control (DVC) from a junior data scientist's experience. This is a tool for managing and versioning data that is akin to version control systems like Git. I have outlined simple steps to get started with DVC for data science:

DVC Installation: To begin with install DVC on your pc. DVC can be installed via pip or conda for those using anaconda.

DVC Initialisation: Following installation, you can initialize it in your project working directory by running the `dvc init` command. This creates a .dvc directory in your project that will hold information about your data and the versions of your data.

Set up a memory location: You will need to decide on a memory location either locally or on a cloud-based service like Amazon S3. DVC can be configured to store data by running the `dvc remote` add command.

Adding data to DVC: Adding a file to DVC involves running the command `dvc add <file_you_intend_to_add>`. This creates a .dvc file that will be used to track the changes made to the data. One may add multiple files to DVC by running this command on each file.

To version data: Creating a version of your data involves running the `dvc commit` command. A new Git commit is created and the .dvc file is updated with the new version information. You can then push this commit to your Git repository.

To retrieve previous versions of your data the `dvc checkout` command is called. This will replace the current version of your data with the specified version.

If you are working on a project with other developers/data scientists, DVC comes in handy as well in collaborating on the same data. You can share the .dvc directory with your collaborators and they can use the same commands to manage the data.

The Data Version Control has an edge over github in that it allows storage of large data sets unlike github which has a cap of 100 mb for a single file that can be pushed.
Announcing DHTMLX JavaScript Booking Widget
Tags: javascript, webdev, programming, news
Published: 2023-03-30 12:25:39

Spring is here, and we continue working on expanding our product portfolio with versatile JavaScript UI widgets for building web apps of any complexity. Currently, the DHTMLX team engages in developing a lightweight and responsive solution for appointment booking, namely DHTMLX Booking widget.


![javascript-booking-widget](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b0xga4hl4yil2d1y416v.png)

The DHTMLX booking widget is designed to schedule appointments online. It displays a range of available dates and time slots, so end-customers can easily find and book doctor appointments, therapy sessions, business calls, tutoring and wellness services, whatnot. They can also reschedule or cancel appointments through a web interface.

On the backend, companies can set parameters about when their customers are able to book certain services, based on business hours and staff availability. DHTMLX widget allows preventing double-booking as it blocks off time slots when services may be unavailable.

Moreover, we’re planning to make the upcoming Booking widget compatible with [DHTMLX Scheduler](https://dhtmlx.com/docs/products/dhtmlxScheduler/new/). With this JavaScript library, you can build data-intensive scheduling apps with an intuitive drag-n-drop interface. It includes 10 views and allows working with recurring and multisection events.


![booking-appointment-in-dhtmlx](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/896ll7qkfvkp3ya1kklr.png)

Anyway, it’s very important for us to hear your opinion about the upcoming DHTMLX Booking widget.

Does your project need a simple time reservation widget? What features are most relevant to you? How would you like to use it? With which DHTMLX widgets would you like to combine DHTMLX Booking widget?

You can share your thoughts as well as leave a request for early access on our website. Just [fill in the form](https://dhtmlx.com/docs/contact.shtml), do not forget to specify a “booking widget” tag, and we’ll keep you informed on all updates related to the upcoming DHTMLX widget.


![confirming-appointment](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/joc3pyr9u6jwbwuodvja.png)

**_This article was originally published on the [DHTMLX blog](https://dhtmlx.com/blog/announcing-dhtmlx-javascript-booking-widget/)_.**