teleren/devto huggingface dataset:
If I would rewrite React from scratch it would look like this
Tags: react, webdev, javascript
Published: 2022-12-15 18:47:07

#### Keep JSX and functions

```jsx
function MyComponent() {
   return <span>Hello, React<span>;
}
```

#### Keep useState, but add full HTML syntax support, use click not onClick, class not className

```jsx
function MyComponent() {
   const [count, updateCount] = useState(0);
   return <button click={_ => updateCount(count + 1)}>
      Count: {count}</button>
}
```

#### useState with objects

```jsx
function MyComponent() {
   var me = useState({ firstName: "Ibrahim", lastName: "ben Salah"});
   return (
      <div>
         fullName: {me.get("firstName")} {me.get("lastName"})
      </div>
   )
}
```

#### true first class support for async/await and promises, not the fake `use` hook
```jsx
async function MyComponent() {
   const ditto = await fetch("https://pokeapi.co/api/v2/pokemon/ditto")
      .then(e => e.json());
   return (
      <div>
         {ditto.name}
      </div>
   )
}
```

#### Add support for async iterator
Not sure if one would expect this to end up with one final div and auto dispose all the previous, or all div's should be retained
```jsx
async function *MyComponent() {
   for (const delay of this.delays) {
      await this.wait(delay);
      yield <div>`Delayed response for ${delay} milliseconds`</div>;
   }
}
```
#### Add support for observables (e.g. rxjs)

```jsx
function MyCounter() {
   const time = timer(0, 1000).pipe(map(() => new Date()));
   return (
      <div>Current time: {time}</div>
   )
}
```

#### Conclusion
Do you agree on using the _platform_ instead of inventing dubious hooks with many gotcha's? Or do you think it's an impossible idea? If the latter then you would be surprised to hear that the fastest UI library in the krausest js framework benchmark is already built with these concepts, it's called  _xania_ (named after a small district in Morocco).

benchmark results:
https://krausest.github.io/js-framework-benchmark/2022/table_chrome_104_windows.html

benchmark code:
https://github.com/xania/krausest-js-benchmark/blob/main/src/app.tsx
Free Service - Python Converter & Generator
Tags: generator, appseed, converter, opensource
Published: 2022-12-15 19:14:51

---
title: Free Service - Python Converter & Generator
published: true
description: Python Generator & Converter, a new open-source and free service provided by AppSeed that supports OpenAPI, CSV, and pandas DF input.
tags: generator, appseed, converter, opensource
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wgob7cu3b81fo1vlx8cu.jpg
canonical_url: https://app-generator.dev
---
Hello Coders!

This article presents a free [Data Converter and Generator](https://app-generator.dev/) service that aims to help developers and data scientists to manage the information with ease via a simple UI.  This tool converts **OpenApi**, **CSV**, and **Pandas DF** formats into `charts`, `data tables`, and python `model definitions` using a drag & drop interface. 

> Thanks for reading!

- 👉 Python [Generator & Converter](https://app-generator.dev/) - `LIVE demo`
- 👉 Python [Generator & Converter](https://github.com/app-generator/devtool-python-converter) - `source code`

--- 

> Supported formats and conversions:  

- ✅ `OpenAPI` Descriptor (JSON) **to models** (Flask, Django)
- ✅ `Edit` extracted `modules`
- ✅ `CSV to Models`
- ✅ `CSV to DataTables`
- ✅ `CSV to Charts`
- ✅ `DataFrames` to Models, DataTables
- ✅ `DataFrames` export (JSON format)

All the above features are visually explained in this video material published on YouTube:

{% embed https://www.youtube.com/watch?v=87qvYSvjGOk %}

---

## ✨ Video transcript

- ✅ Access the public repository: [Python Converter](https://github.com/app-generator/devtool-python-converter)
- ✅ `Present` the tool features
- ✅ `Start the project` in a local environment
- ✅ Upload different [inputs](https://github.com/app-generator/devtool-python-converter/tree/master/inputs): CSV, DataFrames, OpenAPI
- ✅ `Convert OpenAPI` files
- ✅ `Convert CVS` files
- ✅ `Convert Data Frames` files

The product is under heavy development and 2nd iteration will include: Yaml format for OpenAPI, Swagger UI (remote processing), and Remote Databases conversions.

--- 

> `Thanks for reading!` For more resources, please access:

- 🚀 Free [support](https://appseed.us/support/) provided by AppSeed (email & Discord)
- 👉 More [free apps](https://appseed.us/apps/open-source/) crafted in Flask, Django, and [React](https://appseed.us/apps/react/)
Building A Message Queue Using Go
Tags: systems, go, programming, devops
Published: 2022-12-15 19:05:25

Message queues are a critical component of many distributed systems, providing a way for different components to communicate and coordinate with each other asynchronously. In this article, we'll explore how to build a simple message queue in Go using the built-in Channel type.

A channel in Go is a concurrent data structure that allows one goroutine (a lightweight thread of execution) to send a value to another goroutine. Channels are a powerful tool for concurrent programming, providing a safe and efficient way for goroutines to communicate with each other.

Channels can be thought of as FIFO (first-in, first-out) queues, where the first value that is put into the channel is the first value that is taken out of the channel. This makes them a great data structure for implementing a message queue, where messages can be enqueued and dequeued in the order in which they were received.

To create a channel, we use the `make` function:

```
queue := make(chan string)

```

This creates a channel that can be used to send and receive string values. The type of the values that can be sent and received through the channel is specified as the argument to the `make` function. In this case, we're creating a channel that can be used to send and receive `string` values.

We can use the `<-` operator to send a value to the channel:

```
queue <- "Hello, world!"

```
And we can use the `<-` operator to receive a value from the channel:

```
msg := <- queue

```

If the channel is empty, this operation will block until a value is sent to the channel. This is a key feature of channels, as it allows goroutines to synchronize with each other without the use of explicit locks or other synchronization primitives.

We can use these two operations to create a simple message queue that allows one goroutine to enqueue messages and another goroutine to dequeue them:

```
type MessageQueue struct {
  queue chan string
}

func (q *MessageQueue) Enqueue(msg string) {
  q.queue <- msg
}

func (q *MessageQueue) Dequeue() string {
  return <-q.queue
}

```

This implementation is thread-safe and can be used by multiple goroutines without any additional synchronization. The `Enqueue` and `Dequeue` methods use the `<-` operator to send and receive values from the channel, respectively.

In conclusion, building a message queue in Go is a simple and efficient way to add asynchronous communication to your distributed system. Using Go's built-in Channel type, you can create a thread-safe message queue with just a few lines of code. Channels provide a powerful and efficient mechanism for goroutines to communicate with each other, making them a valuable tool in the Go programmer's toolbox.
Cadl: a new IDL
Tags: javascript, programming, opensource, typescript
Published: 2022-12-15 18:44:28

This one just crossed my feed today: [Cadl](https://github.com/microsoft/cadl), "... a language for describing cloud service APIs and generating other API description languages, client and service code, documentation, and other assets."

In other words, you write this:

```
import "@cadl-lang/rest";

using Cadl.Http;

@server("https://example.com", "Single server endpoint")
@route("/example")
namespace Example {
  @get
  @route("/message")
  op getMessage(): string;
}
```

... and when you "compile" it, you get an OpenAPI (or gRPC, or some other service-oriented protocol) specification out the other end. From there, it seems, you use other tools to go from OpenAPI to one of the service client or implementation languages (C#, Java, Python, Ruby, whatever suits your fancy), so long as there's an OpenAPI code generator for it.

First take: this seems so much less feature-rich than something like [Ballerina](https://ballerina.io/), but I suppose it will appeal to those who prefer to get all their Azure-related tooling from Microsoft and/or prefer their stack to be entirely JS-based. (Cadl seems to be a product of TypeScript.)

Will plan on investigating this more, soon.
Machine Learning Roadmap
Tags: machinelearning, datascience, beginners, computerscience
Published: 2022-12-15 18:39:29

In this article, I'll share some courses and recourses that you can follow to start your machine learning journey.
``` 
The First Step 
```
 The very first that you can take is start with learning a programming language; most of you would think of python and yes you are right!
Solution of "Can't find Python executable 'python'" Node Error
Tags: node, python, pyenv, sass
Published: 2022-12-15 18:06:45

Hello everyone, today we will take a look at a mix-in problem. The main reason of this situation is deprecated dependencies.

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

The project that we developed use a node version `14.18.0` and we use a **node-sass version 4.14.1** package and this package also [deprecated](https://github.com/sass/node-sass/commit/e2391c259167a9692f2c23b0c91caa37502334ca) for today.

> **PS:** You can use [normal sass](https://github.com/sass/dart-sass) package today instead of node-sass.

The error out looks like these 

```bash
Error: Can't find Python executable "python", you can set the PYTHON env variable.
```

The python3 was already installed on my pc. But this is not helped at all. 

We need to install **python 2.7.18** 

We can use **pyenv** to work multiple python version. Let's download it.

## 1- Install "pyenv"
```bash
brew install pyenv
```   
 
## 2- Install the "2.7.18" version of python

```bash
pyenv install 2.7.18
```

and set it as a global 

```bash
pyenv global 2.7.18
```

## 3- Add python executable directory to PATH
```bash
export PATH="${HOME}/.pyenv/shims:${PATH}"
```

You can check the PATHs with;

```bash
echo $PATH
```


## 4- Add python executable directory to the .npmrc

```bash
npm config set python $(which python)
```

> You can check the config with 

```bash
npm config list 
```

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

> or check from **.npmrc**;

```bash
cat .npmrc
```

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


After these steps, you can able to work with "python" and the node starts to will work with the "python" alias.

Arrivederci 👋

---

> ## Source: 

> - https://github.com/TryGhost/node-sqlite3/issues/1552#issuecomment-1075059490
How to use Apache Kafka in GO using Echo framework?
Tags: go, tutorial, abotwrotethis
Published: 2022-12-15 17:56:21

To set up Kafka in a Go application using the Echo web framework, you would first need to install the `sarama` package, which provides a Go client for Apache Kafka. You can do this using the `go get` command:


``` Go
go get github.com/Shopify/sarama
```

Once the `sarama` package is installed, you can use it to connect to Kafka and publish and consume messages. Here is an example of how to set up a Kafka producer in a Go application using the Echo framework and the `sarama` package:

``` Go
package main

import (
	"fmt"
	"time"

	"github.com/Shopify/sarama"
	"github.com/labstack/echo"
)

var (
	kafkaBrokers = []string{"localhost:9092"}
)

func main() {
	// Create a new Echo web server
	e := echo.New()

	// Set up a route to handle HTTP POST requests to the /messages endpoint
	e.POST("/messages", func(c echo.Context) error {
		// Read the message body from the request
		message := c.FormValue("message")

		// Create a new Kafka producer
		producer, err := sarama.NewSyncProducer(kafkaBrokers, nil)
		if err != nil {
			return err
		}
		defer producer.Close()

		// Publish the message to the "messages" topic
		msg := &sarama.ProducerMessage{
			Topic: "messages",
			Value: sarama.StringEncoder(message),
		}
		partition, offset, err := producer.SendMessage(msg)
		if err != nil {
			return err
		}

		// Return a response to the client
		return c.String(http.StatusOK, fmt.Sprintf("Message published to partition %d at offset %d", partition, offset))
	})

	// Start the Echo web server
	e.Start(":8080")
}
```

This Go application uses the Echo framework to handle HTTP POST requests to the `/messages` endpoint. When a request is received, the application reads the message body from the request and uses the `sarama` package to publish the message to the "messages" topic in Kafka.

Surprise, this article was generated by ChatGPT!
What actually sees a deep neural network model ?
Published: 2022-12-15 17:54:35

Hi,

How to visualize CNN Deep neural network model ? 
What is actually sees during the training ? 
What are the chosen filters , and what is the outcome of each neuron .

This is part no. 5 of Tensorflow tutorial for classify monkey’s species images using CNN and transfer learning 

In this part we will focus of showing the outcome of the layers.
Very interesting !!

I also shared the Python code in the video description.

Oreily  come up with this book . the best book for learning Deep learning based on Tensorflow-Keras. This is the link : [https://amzn.to/3STWZ2N]

You can find the link for the video tutorial here : [https://youtu.be/yg4Gs5_pebY]


Enjoy
Eran

#Python #Cnn #TensorFlow #Deeplearning #AI
DspytAI Real-Time Portfolio Tracking & Price Prediction Tool
Tags: ai, python, opensource, datascience
Published: 2022-12-15 17:44:30

Welcome to [DspytAI](https://github.com/dspytdao/dspytai), the Uniswap powered Dapp that uses on-chain data and machine learning to predict potential price fluctuations in real-time. With our browser-based frontend, you can determine price averages for any ERC20 contract and access simple, free to use downloadable price prediction data in both text based csv format and image based png and svg formats. Unlock the future of Uniswap trading with DspytAI and track your Uniswap portfolio with confidence.

{% embed https://www.youtube.com/watch?v=71l_uD8JuTc %}

## Further Resources

- [GitHub repository](https://github.com/dspytdao/dspytai)
- [Algovera Proposal](https://forum.algovera.ai/t/dspyt-ai-uniswap-portfolio-tracker/184/5)
- [Algovera](https://www.algovera.ai/)
- [Ethereum Price Prediction with LSTM Kaggle Notebook](https://www.kaggle.com/code/pavfedotov/ethereum-price-prediction)
- [DspytAI LSTM Uniswap Kaggle Notebook](https://www.kaggle.com/code/pavfedotov/dspyt-ai)
- [Blockchain Data Indexer with TrueBlocks](https://dspyt.com/blockchain-data-indexer-with-trueblocks)
- [Machine Learning with Simple Sklearn Ensemble](https://dspyt.com/machine-learning-simple-sklearn-ensemble)
- [How to illustrate log returns vs simple returns](https://dspyt.com/simple-returns-log-return-and-volatility-simple-introduction)
- [A How to EfficientNet Classification](https://dspyt.com/efficientnet-classification)
- [Cross-sectional data – An easy introduction](https://dspyt.com/cross-sectional-data-an-easy-introduction)
- [Advanced Realized Volatility and Quarticity](https://dspyt.com/advanced-realized-volatility-and-quarticity)
How to use fixture and parameterize in Python?
Tags: python, programming, testing, abotwrotethis
Published: 2022-12-15 17:39:19

In Python, fixtures are used to provide data for test functions. The parameterize function from the pytest-parameterize package can be used to run the same test function with different sets of data. Here is an example of how to use fixtures with parameterize:

``` Python
import pytest
from pytest_parameterize import parameterize

@pytest.fixture
def data():
  return [1, 2, 3]

@parameterize('num', data())
def test_numbers(num):
  assert isinstance(num, int)
```

In this example, the `data` fixture provides a list of numbers to the `parameterize` function. The `parameterize` function then runs the `test_numbers` test function with each of the numbers in the `data` list as the `num` parameter. The test function uses the `assert` statement to check that each `num` value is an integer.

``` Python
import pytest
from pytest_parameterize import parameterize

@pytest.fixture
def data1():
  return [1, 2, 3]

@pytest.fixture
def data2():
  return ['a', 'b', 'c']

@parameterize('num', 'letter', data1(), data2())
def test_numbers_letters(num, letter):
  assert isinstance(num, int)
  assert isinstance(letter, str)
```

In this example, the `data1` and `data2` fixtures provide lists of numbers and letters, respectively. The `parameterize` function is called with two arguments: num and letter. The `parameterize` function then runs the `test_numbers_letters` test function with each combination of `num` and `letter` values from the `data1` and `data2` lists. The test function uses the `assert` statement to check that each `num` value is an integer and each `letter` value is a string.

Overall, using `parameterize` with multiple data parameters is similar to using it with a single parameter. You simply need to provide multiple fixtures to supply the data and specify multiple arguments in the `parameterize` function call.

Surprise, this article was generated by ChatGPT!
TypeScript 基礎 -- Promise を返す関数を作り、Promise が解決された後に動く処理を書く
Tags: typescript, promise
Published: 2022-12-15 17:35:50


## 環境構築

```ts
npm --version
8.6.0
```

typescript をいれるための npm のインストール
9 で苦戦したのでそれ未満にした。

```ts
npm i typescript -g
```

tsc コマンドのための typescript のインストール

```ts
node --version
v18.0.0
```

tsc とその後の為の node

これらを入れておく。

```ts
npm i -g ts-node 

added 19 packages, and audited 20 packages in 910ms

found 0 vulnerabilities
Reshimming asdf nodejs...
```

さらにコンパイルと実行を続けてやるために、ts-node も入れる。

これで準備完了。

なお、ts-node は ファイル名に .ts をつけないと .js の方を読み込むので注意。

---


## Promise とは？

https://typescriptbook.jp/reference/promise-async-await#promise%E3%81%A8%E3%82%B8%E3%82%A7%E3%83%8D%E3%83%AA%E3%82%AF%E3%82%B9

連続するもの。処理Aが終わってから処理B、処理Bが終わってから処理C...と終わるのを待って実行することができる。

---

## 実行時の注意点

https://stackoverflow.com/questions/27573365/how-to-use-typescript-with-native-es6-promises

package.json に書いてある target が es2015 未満になっていると tsc では実行できない。

```ts
promise.ts:2:14 - error TS2585: 'Promise' only refers to a type, but is being used as a value here. Do you need to change your target library? Try changing the 'lib' compiler option to es2015 or later.

2   return new Promise((resolve) => {
               ~~~~~~~
Found 1 error.
```

---

## Promise で返ってくる関数を呼び出してみる

```ts
function request1(): Promise<number> {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve(1);
      console.log("resolved")
    }, 1000);
  });
}
console.log(request1());
console.log("not promise")
```


Promise のインスタンスを作り
内部で何が終わったら解決するか定義する。
この場合は setTimeout で 1 秒たったら解決し
console.log で resolved と print するようにした。

これを実行すると

```ts
ts-node promise.ts
Promise { <pending> }
not promise
resolved
```

関数の返り値がまだないので 処理待ちの Promise だと表示され
並列実行なので、Promise が返ってくる前に関数外の not promise と表示させる処理が先に動き
Promise が解決された後、resloved が print される。

---

## Promise 解決後に .then( (_) => {} で処理を動かすようにする

```ts
console.log("not promise")
request1().then((_) => {
  console.log("after promise resolved");
})
```

先程の Promise が返ってくる処理では
.then と (_) をつけることで、
Promise が終わった後に動く処理を付け足すことができる。

```ts
ts-node promise.ts
not promise
resolved
after promise resolved
```

----

## async で関数を定義することで、返り値を暗黙的に Promise にする

async で定義すると、返り値 Promise でラップされる。

```ts
async function asyncPromiseFunc(): Promise<number> {
  return 1;
}
asyncPromiseFunc().then((_) => {
  console.log("after promise resolved");
})

console.log("not promise")
```

setTimeout しなくても非同期の方が通常処理より遅くなるので、setTimeout は省略した。
これを実行すると

```ts
ts-node promise.ts
not promise
after promise resolved
```

ちゃんと not promise の出力の後に async での関数の後に then が動いて after promise resolved が実行されるので

Proimse が返ってきていることがわかった。

---

## まとめ

関数の返り値を new Promise で返すと、非同期で並列スレッドで動き、他の処理を先に動かすことができる。

promiseFuncName.then( (_) => { } を使うと、
関数の返り値が帰ってきた後に {} 内部の処理を動かせる。

関数に async をつければ、返り値を new Promise() で囲わなくても、暗黙的に Promise として返るようになる。

---

## 次回やること 

Promise の返り値を扱う
( then で引数を使う、await で受け取る )
Solidity Code Security
Tags: web3, saas, solidity
Published: 2022-12-15 17:25:48

Hey all, 
I am building a [tool](https://www.producthunt.com/my/upcoming/hi-audit) to check solidity code for security issues. The base is complete ( which checks the code , it generates a report based on many other tools and some AI too ) 

As next step, I wanted to simplify the process, I want to understand if people will be more interested in a Github Bot ( that automatically checks on commit ) or as a Cli ( which can be configured to run on CI/CD pipelines ). Currently they have to upload code on the platform which is not very convenient. 

Or if you have any other inputs it will be highly appreciated !
What is the difference between event-driven architecture and message-driven architecture?
Tags: architecture, beginners, programming, abotwrotethis
Published: 2022-12-15 17:13:47

**Event-driven architecture** and **message-driven architecture** are two design patterns that are commonly used in software development to enable asynchronous communication and processing within a system. While these two patterns have some similarities, there are also some key differences between them.

**Event-driven architecture** is a design pattern in which the components of a system communicate with each other by sending and receiving events. 
In this architecture, an event is a piece of data that represents a change or occurrence in the system. Components can publish events to notify other components of a change or occurrence, and can also subscribe to events to receive notifications from other components.

**Message-driven architecture**, on the other hand, is a design pattern in which the components of a system communicate with each other by sending and receiving messages. 
In this architecture, a message is a piece of data that is sent from one component to another to request or provide information. Components can send messages to request data or actions from other components, and can also receive messages to process requests or provide information.

One key difference between event-driven and message-driven architecture is the direction of communication. 

In event-driven architecture, communication is typically one-to-many, meaning that a single event can be published by one component and received by multiple components. 

In message-driven architecture, communication is typically one-to-one, meaning that a single message is sent from one component to another specific component.

Another key difference is the purpose of the communication. 

In event-driven architecture, the purpose of communication is typically to notify other components of a change or occurrence. 

In message-driven architecture, the purpose is typically to request or provide information.

Overall, the choice between event-driven and message-driven architecture will depend on the specific requirements and needs of your system. 

Both patterns can be effective for enabling asynchronous communication and processing, but the specific characteristics and differences between them should be considered when deciding which pattern to use.

Surprise, this article was generated by ChatGPT!