teleren/devto huggingface dataset:
Simple API Design with OpenAPI - 1
Published: 2023-07-25 22:23:58

![image1](https://raw.githubusercontent.com/Grifo89/grifo-devlab-images/main/simple-api-design-with-openapi-1/1.png#center)

Always the beginning of a new web project has its pain points along the way, one of those pain points is the business modeling, another would be the workflow between backend, frontend and the stakeholders. The starting point of a project is a hard stage that every team needs to overcome.

Today there are many tools that help us with those stressful situations and encourage us to designing it first and implementing it later, promesing that the designing time will be well spent and also will decrease dramatically our implementation time avoiding us a lot of back and forth between the stakeholders, the frontend team and the backend team and therefore headaches 😅.

Fortunately, the world of web development is teeming with powerful tools designed to tackle these challenges and transform the development process. These tools encourage teams to focus on designing APIs first before diving into implementation, promising that the time spent on design will be well invested, leading to smoother implementation and reduced back-and-forth with stakeholders and teams.

One of these game-changing tools is OpenAPI, a specification language that goes beyond defining HTTP APIs. It's an entire ecosystem of tools that make API design and development enjoyable and efficient. OpenAPI empowers developers to create APIs in a robust, fun, and interactive way, revolutionizing the way we build and consume APIs.

Let's dive into a hands-on exercise to experience the power of OpenAPI. In this exercise, we'll design a microservice to serve a resource called `Users`, demonstrating the capabilities and benefits of OpenAPI's ecosystem.

![Users Model](https://raw.githubusercontent.com/Grifo89/grifo-devlab-images/main/simple-api-design-with-openapi-1/3.png#center)

If you would like to read the whole article I invite you to my site, hope you like it. [Link to the article](https://www.grifo-devlab.com/blog/openapi/simple-api-design-with-openapi)
Build in Public: Final Check-in
Tags: beginners, learning, discuss
Published: 2023-07-30 18:20:24

---
title: Build in Public: Final Check-in
series: build in public monthly challenge
published: true
description: Join Virtual Coffee as we spend the month of July building in public!
tags: beginner, learning, discuss
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fhsb2axu1sna401hlpe0.png
# Use a ratio of 100:42 for best results.
---

Hey friends :wave:

It's the last check-in for the [Virtual Coffee Build in Public Challenge](https://dev.to/virtualcoffee/join-virtual-coffee-for-the-build-in-public-the-power-of-daily-standup-and-demo-challenge-35kb)! This is a challenge where you commit to sharing your progress on a project publicly, on a weekly basis.

**Tell us how you did this month.** You might share things like: 

- What did I accomplish this month?
- What are my goals for next month?
- What challenges did I face this month? How did I navigate those challenges?
- Based on what I worked on this month, what are my strengths and weaknesses? What’s next?
What's Sifu art style?
Tags: gamedev, shaders
Published: 2023-07-30 17:58:05

I noticed that a couple of games have used an intriguing art style, namely [Sifu](https://www.sifugame.com/) and [Midnight Fight Express](https://www.humblegames.com/games/midnightfightexpress/). Surprisingly their art style really fits into such brutal games.

Originally I thought that it's some kind of low poly (or polyart), but you don't really see any polygons and the shading looks bit unusual. Also I found that people called it "painterly" or "stylized", which I find quite vague and misleading. But after some investigation I finally find the answers!

The style seems to be based on Team Fortress 2, for which Valve developers even described the art style in [a paper here](https://steamcdn-a.akamaihd.net/apps/valve/2007/NPAR07_IllustrativeRenderingInTeamFortress2.pdf). Long story short it's a specific use of the [Gooch shading](https://en.wikipedia.org/wiki/Gooch_shading) rendering technique without the edges.

Someone in past tried to create a shader for Unity [here](https://web.archive.org/web/20180204200813/http://leodomingues.com/2016/05/team-fortress-2-toon-shader-in-unity/). While the web is no longer available, the archive.org did a great job!

Anyway I personally find the style distinctive enough to simply call it a TF2 art style.
Run Apache Age with docker
Published: 2023-07-30 17:50:53

To run Apache-AGE and age-viewer using Docker, you can follow these steps:

    Install Docker: First, you need to install Docker on your system. You can download and install Docker from the official website: docker.

    Clone the following Github Repo:
`git clone https://github.com/apache/age.git

Go to project directory and run the following command 
`git submodule update --init --recursive`

Replace the age-viewer/Dockerfile with following code 

FROM node:14-alpine3.2
RUN npm install pm2
WORKDIR /src
COPY . .
RUN npm run setup
EXPOSE 3000


```
 docker compose up
```

Now run 

```
localhost:3000
```
Enter credentials :

```
    Connect URL : age
    Connect Port : 5432
    Database Name : postgresDB
    User Name : postgresUser
    Password : postgresPW
```
Apache-Age:(https://age.apache.org/)
[GitHub:-https://github.com/apache/age](https://github.com/apache/age)

`
React Native fix android build error "[CXX1428] exception while building Json A problem occurred starting process"
Tags: reactnative, android
Published: 2023-07-30 17:49:55

I [setup dev environment](https://reactnative.dev/docs/environment-setup) for my new m1 laptop and faced with weird error when tryied to build React Native 0.72.x [New Architecture](https://reactnative.dev/docs/new-architecture-app-intro) on Android:

```shell
[CXX1428] exception while building Json 
  A problem occurred starting process 
  'command /Users/my/Library/Android/sdk/cmake/3.22.1/bin/cmake'
```


1. I was managed to fix it removing all cache:
    ```shell
    rm -rf android/app/build/ android/app/.cxx/
    ./android/gradlew clean -p android
    ```
2. and reinstalling some Android SDK components:

2.1 open `Android Studio` -> open `Settings` -> then `Appearance & Behavior` ->  `System Settings` -> `Android SDK` ->choose `SDK Tools` -> enable `Show Package Details`

2.2 And then unmark all `CMake`, `NDK`, `Command build tools` versions: 

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

2.3 then `Apply`


2.4 finally install again:

- `latest` Command-line Tools
- `3.22.1` CMake
- `23.1.7779620` NDK
Importing Class Files in Python: A Beginner's Guide
Tags: webdev, tutorial, beginners, python
Published: 2023-07-30 17:48:39

Python's import statement is a powerful tool that allows us to use code written in one file within another file. This is especially useful when working with class files, as it helps organize and reuse code efficiently. In this beginner-friendly blog post, we will explore the step-by-step process of importing class files into other class files in Python, using code snippets as examples. So let's dive in!

Step 1: Create the class file To begin with, let's create a class file called calculator.py that contains a simple Calculator class:

# calculator.py

```
class Calculator:
    def add(self, a, b):
        return a + b

    def subtract(self, a, b):
        return a - b

```
Step 2: Now, let's create another class file called main.py that will import the Calculator class from calculator.py and utilize its functionalities:

```
# main.py

from calculator import Calculator
```

Step 2.5 Let's start using our Calculator class from within our main.py file. 

```
# main.py
# Create an instance of the Calculator class
calc = Calculator()
```

```
# main.py
# Use the 'add' method from the Calculator class
result = calc.add(5, 3)
print("Addition result:", result)
```

```
# main.py
# Use the 'subtract' method from the Calculator class
result = calc.subtract(5, 3)
print("Subtraction result:", result)
```

Step 3: Understanding the import statement In the code snippet above, we used the import statement to import the Calculator class from the calculator.py file. This allows us to create an instance of the Calculator class and access its methods.


Step 4: Now, save both the calculator.py and main.py files in the same directory (lib is a common choice here.), and run the main.py file. You should see the following output:

```
Addition result: 8
Subtraction result: 2
```
Congratulations! You have successfully imported class files in Python.

In this beginner's guide, we explored the step-by-step process of importing class files in Python. We learned how to create a separate class file, import it into another file using the import statement, and utilize the imported class's methods. This technique is an essential aspect of Python programming, enabling code organization and modularity!
Intro to Apache Age PostgreSQL Extension
Published: 2023-07-30 17:43:13

Apache Age is a PostgreSQL extension that allows users to use graph database features in PostgreSQL. It provides an efficient way to store and query graph data using SQL.
**
How to use Apache Age with PostgreSQL
**
To use Apache Age with PostgreSQL, you need to first install the extension. You can do this by following the instructions provided on the Apache Age GitHub page.

Once you have installed the extension, you can start using Apache Age to store and query graph data in PostgreSQL.
**
Key Features of Apache Age
**
Some of the key features of Apache Age include:

Graph data modeling: Apache Age allows you to model your data as a graph, with nodes and edges. You can create tables for nodes and edges, and use SQL to add, update, and delete nodes and edges.
Graph query language: Apache Age provides a powerful graph query language called PGSQL. PGSQL allows you to query your graph data using graph traversal algorithms, and to return results in a tabular format.
Graph visualization: Apache Age comes with a built-in graph visualization tool called PGAdmin. PGAdmin allows you to visualize your graph data and to explore the relationships between nodes and edges.
Conclusion

Overall, Apache Age is a powerful tool that extends the functionality of PostgreSQL to support graph data modeling and query. If you have graph data that you need to store and query, Apache Age can be a great option to consider.

Apache-Age:(https://age.apache.org/)
[GitHub:-https://github.com/apache/age](https://github.com/apache/age)
How to save cost in non-prod AWS environment
Tags: aws, costoptimization, cloud, cloudcost
Published: 2023-07-30 17:37:43

If you are in an organisation whose non-prod AWS environment costs are high and want to cut short on the cost without compromising on the development and deployment velocity, here is a short checklist/quick wins of actions that you can do in order to save money. Of Course you need to check whether the action has an impact on your environment or any process that they follow.

**Use instance scheduler**: There is this great solution on the AWS solution library. I highly recommend this. It stops and starts EC2 instances and RDS on a defined schedule. Use this to stop the environment when not in use. [Instance Scheduler](https://aws.amazon.com/solutions/implementations/instance-scheduler/)

**Spot instances**: If your application is stateless we can use spot instances or spot fargate in the environment to reduce the cost.

**Single NAT gateway per VPC**: NAT Gateways are costly and many IaaC by default create one NAT gateway per AZ which increases the costs. If it does not impact the working, you can create a single NAT gateway per VPC for your non prod environment. This will bring down a considerable amount of cost.

**RDS IOPS instead of Storage**: If your RDS storage requires IOPS, check if increasing the disk size meets your requirements. If your non-prod environment has reduced load, creating a RDS of 400GB is a great deal rather than creating a 100GB RDS with 1000 IOPS. (~$46 compared to ~$112)

**Clean Up scripts**: There should be an automation script which regularly detects and deletes unused AMI, EBS volumes, RDS snapshot etc. Storage Lifecycle manager is a great option to handle this. [snapshot lifecycle](https://docs.aws.amazon.com/AWSEC2/latest/UserGuide/snapshot-lifecycle.html)

**Schedule Scaling**: If we are clear on the time when the environment usage will be high, We can increase or decrease the number of EC2/containers in the environment accordingly. S3 One Zone IA / S3 Intelligent Tier / LifeCycle Policy: This should not be needed always, S3 is dirt cheap, But if objects are accumulated over time, are huge, non-critical and rarely accessed, we can use these solutions accordingly.

**Reseller**: I do not know about other countries, But in India If we go for offline billing via a reseller of AWS we get a flat discount of 10% on the total monthly bill (Of course you need to commit a monthly amount and this may differ from customer to customer)

**Reservation**: If your future load is planned and have a clear requirement you can go for a savings plan or reservations.

To summarise, the above actions can help in reducing your non-prod AWS environment bills. Let me know what you think about it. Did any of these give you a TIL moment? Do you have something that is not listed here? Do you want me to cover more services? Do let me know.
Using AGE Viewer to View Graphs
Tags: postgres, apacheage, ageviewer
Published: 2023-07-30 17:04:06

A graph is a data structure containing vertices (or nodes) and edges. The vertices represent objects or entities, while the edges represent the relationship between these vertices.

Using [Apache AGE](https://age.apache.org/), PostgreSQL can be given the functionalities of a graph database. We will be able to create graph databases and manipulate them in PostgreSQL, and AGE Viewer gives us a visual representation of these graphs.

## Installation
Apache AGE requires `node` (version 14.16.0 recommended) and `npm` to run. To download `node`, we'll be using Node Version Manager (`nvm`).

### Installing `nvm`
Run the following command in your terminal.
```bash
sudo apt install curl 
curl https://raw.githubusercontent.com/creationix/nvm/master/install.sh | bash 
```
After the installation is completed, reload the terminal to effect the changes.

### Installing `node`
Install `node` version 14.16.0 using `nvm`.
```bash
nvm install 14.16.0
```
To check your installation, run the following commands to view the versions of `node` and `npm`.
```bash
node -v
npm -v
```

### Installing AGE Viewer
Clone AGE Viewer from its repository.
```bash
git clone https://github.com/apache/age-viewer.git
```
Now, install the required node modules and start the viewer. To do that, go into the AGE Viewer folder and run:
```bash
npm run setup
npm run start
```
AGE Viewer will run on `localhost:3000` if port 3000 is free.

## Viewing a Graph Database
For this, we'll be using the same data used in my article, [Six Degrees of Separation Using Apache AGE](https://dev.to/hallixon/six-degrees-of-separation-using-apache-age-c0).

Connect to your database in AGE Viewer using the following parameters:
* Connect URL: `localhost`
* Connect Port: `5432` (PostgreSQL's port by default)
* Database Name: <Name of your database>
* User Name: <Username>
* Password: <Password>
The username and password for the connection, if not set, will be the name and password of the current user.

Run the following code in AGE Viewer.
```SQL
SELECT * FROM cypher('social_network', $$
    MATCH (a:Person)-[e]-(b:Person)
    RETURN a, e, b
$$) AS (a agtype, e agtype, b agtype);
```

![Running a cypher query in AGE Viewer](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/am8uk7wm41pvg53c8b8k.png)

The graph will be displayed.

![Graph displayed in AGE Viewer](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/y3cl6h9nmkm97u802xbt.png)
Google Cloud Platform (GCP) for Beginners
Tags: googlecloud, beginners, learning, cloud
Published: 2023-07-30 17:02:58

Google Cloud Platform (GCP) is a suite of cloud computing services that runs on the same infrastructure that Google uses for its end-user products, such as Google Search and YouTube. GCP offers a broad range of services, including computing, data storage, data analytics, and machine learning.

If you're new to cloud computing, GCP can be a great place to start. The platform is easy to learn and use, and it offers a wide range of features and capabilities.

##Understanding Google Cloud Platform

Google Cloud Platform consists of a wide range of services, including computing, storage, networking, and databases. Some of the most popular services include:

**Google Compute Engine**: It is a service that provides virtual machines (VMs) that can be used to run applications. VMs are scalable and can be customized to meet the needs of your application.

**Google Kubernetes Engine**: It is a managed service that makes it easy to deploy and manage containerized applications. Containers are a lightweight way to package and deploy applications, and Kubernetes Engine makes it easy to scale and manage your containers.

**Google Cloud Storage**: It is a scalable and durable object storage service. Object storage is a great way to store large amounts of data, such as images, videos, and logs.

**BigQuery**: BigQuery is a fully-managed, serverless data warehouse that enables businesses to analyze large datasets quickly and easily. BigQuery is a great choice for businesses that need to analyze large amounts of data to gain insights.

**Cloud AI Platform**: It is a suite of services that helps businesses build, train, and deploy machine learning models. Cloud AI Platform is a great choice for businesses that want to use machine learning to improve their operations or products.

**Cloud SQL**: It is a fully-managed relational database service that makes it easy to set up, maintain, manage, and administer your relational databases on Google Cloud Platform.


**Cloud Functions**: It is a serverless platform that makes it easy to run code in response to events


##Learning more about Google Cloud Platform

Here are some resources to get you started:

1. [Google Cloud Platform Documentation](https://cloud.google.com/docs/)
2. [Google Cloud Platform Training](https://cloud.google.com/learn/training)
3. [Google Cloud Platform Blog](https://cloud.google.com/blog/)
4. [Google Cloud Platform Community]( https://cloud.google.com/developers)
5. [Google Cloud Communities](https://cloud.google.com/communities)
6. [Google Cloud Platform Stack Overflow](https://stackoverflow.com/questions/tagged/google-cloud-platform)
7. [Google Cloud Platform GitHub Repository](https://github.com/GoogleCloudPlatform)
8. [Google Cloud Tech YouTube Channel](https://www.youtube.com/channel/UCJS9pqu9BzkAMNTmzNMNhvg)
9. [Google Cloud YouTube Channel](https://www.youtube.com/googlecloud)

##Conclusion

I hope this article has given you a brief introduction to Google Cloud Platform. If you're interested in learning more, I encourage you to check out the resources I've provided.
React.memo is not memoization
Tags: react, performance, webdev, javascript
Published: 2023-07-30 16:34:13


In a recent conversation with some colleagues at work, I suggested using `React.memo` for a component we were building. However, one of my colleagues questioned whether this higher-order component (HOC) would provide any optimization benefits. It seems that many software engineers don't fully understand the memoization that React offers, so I wanted to clarify it in this post.

**Memoization is** the process of optimizing performance by caching the result of a computation and associating it with the parameter used to calculate it. However, **React's version of memoization is different**. When a component is wrapped in `React.memo`, React's reconciliation algorithm only compares the previous and current properties to determine whether to re-render the component. It doesn't cache all the properties passed to it or keep a history of properties to return instant results based on previous function calls. Instead, it only skips re-rendering a component if the props remain unchanged.

While memoization can help optimize performance in some cases, it's not a one-size-fits-all solution. The React documentation cautions that memoization does not guarantee optimization, and I agree. Memoizing everything can lead to slower reconciliation due to an overload of comparisons. Therefore, `React.memo` is most useful for pure function components or components that frequently re-render with the same props and output. *(Image below)*


![A small view of re-render process](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/dbi6qx5dk5ocr3jooe3m.png)

**In conclusion**, technology is a trade-off, and there is no silver bullet for all problems. If you need to pass a function or complex data, other optimizations may be necessary.

**Credits & References**

- Photo by <a href="https://unsplash.com/@busgram?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Büşra Salkım</a> on <a href="https://unsplash.com/photos/a-display-case-filled-with-lots-of-different-colored-macaroons-MidUI6QPiys?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a>
- [memo – React](https://react.dev/reference/react/memo)
- [Keeping Components Pure – React](https://react.dev/learn/keeping-components-pure)
- [Reconciliation – React](https://legacy.reactjs.org/docs/reconciliation.html)
🇵🇹 GitHub Portugal: the Portuguese development community on GitHub 🇵🇹
Tags: development, opensource, community, portugal
Published: 2023-07-30 16:27:16

![Patrick says hi!!](https://i.giphy.com/media/3ogwFGEHrVxusDbDjO/giphy.webp)

👋 Hii developers and open-source enthusiasts! We are excited to announce **GitHub Portugal**, an open community dedicated to promoting the **Portuguese development community** and **open-source projects** on [GitHub](https://github.com/).

- [Website](https://www.githubportugal.com/)

- [Discord community](https://discord.com/invite/rzAB2xtzBc)

## 👀 Introducing GitHub Portugal

GitHub Portugal is a **dynamic** open-source project, inspired by [GitHub Brazil](https://githubbrasil.com/) - the official GitHub Brazilian community. We aim to create a **rich ecosystem** of open-source projects and bring together interested **developers**, **programmers**, and **_tech-lovers_** from all over **Portugal**.

GitHub Portugal **IS NOT** an official GitHub community. We are a **NON-PROFIT** group that works on an applied, volunteer interest.

Our main goal is to showcase the **incredible talent** of the Portuguese development community and shed light on the **unique open-source projects** from Portugal.

Here is what you can do after joining our fantastic community:

### 📚 Learning and sharing

We believe in the power of knowledge sharing. Members can attend **workshops**, **webinars**, and other online events to learn from each other and improve their skills.

### 💻 Contribute to open-source projects

GitHub Portugal is not just a place for talk, but also a place for action. Participate in exciting open-source projects, collaborate with others, and **make a meaningful impact** in the tech community.

### 🌱 Growing together

Whether you’re an experienced developer or just starting, we support **EVERYONE’s growth journey**.

## 🛠 Let's build the future

Together, let's build an exciting hub for open-source enthusiasts in Portugal. Head over to our [GitHub repository](https://github.com/mmroch4/githubportugal) and **contribute** to **the first open Portuguese development community on GitHub**. Remember, the power of open-source lies in **collaboration**, and we can't wait to see what we can achieve together!

### **🫵 Let's make Portugal's tech community shine on the global stage 🫵**

![Yeaahhh](https://i.giphy.com/media/t3sZxY5zS5B0z5zMIz/giphy.webp)