teleren/devto huggingface dataset:
How to Build Your First GitHub App with JavaScript and GitHub API: Easy and Fast
Tags: css, javascript, beginners, tutorial
Published: 2023-04-09 14:08:09

{% youtube B1w07ogfWgQ %}

In this video, we'll show you how to build a simple, fast, and easy web application using the GitHub API and JavaScript. We'll use a dark and light theme and responsive design so that your app looks great on any device.

If you're looking to learn how to build a web application using the GitHub API, then this is the video for you! We'll show you everything you need to know to build a simple web application. This is a great beginner's guide to web development and working with API. so be sure to watch it!

[Source code](https://www.patreon.com/posts/gitfinder-github-81262389?utm_medium=clipboard_copy&utm_source=copyLink&utm_campaign=postshare_creator&utm_content=join_link)
[Starter file](https://drive.google.com/file/d/1-3HOhwqiufVZeKXzCtlBXSFUoY_nDZMg/view?usp=share_link)
[Figma UI](https://www.patreon.com/posts/gitfinder-github-81262510?utm_medium=clipboard_copy&utm_source=copyLink&utm_campaign=postshare_creator&utm_content=join_link)
[GitHub API - Postman](https://www.postman.com/codewithsadee-team/workspace/github-api-public)

⏱️ Timestamps
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
0:00 - Demo
3:21 - Demo - testing accessibility
4:39 - Demo - testing responsive
5:54 - Project stucture and initiallization
20:04 - Skip to content
22:16 - Header
39:22 - Light and dark theme
44:48 - Initial mian js file and header functionality
50:21 - Profile section
1:12:48 - Tab and tab content section
1:51:31 - Initial the api.js file
1:53:47 - Working with API
1:54:36 - Search API integration
1:57:30 - Profile API integration
2:17:00 - Repository API integration
2:25:35 - Fork repo API integration
2:28:55 - Follower API integration
2:35:58 - Following API integration
2:41:58 - Media queries
4 ways to get file size in Linux
Tags: linux, beginners, programming
Published: 2023-04-09 14:05:18


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

To check file size in Linux, you can use du, ls, stat, or find commands.

- The du command tells you how much space a particular file or directory is taking up on your system.
- The ls command shows you information about files, including their size.
- The stat command gives you more details about a particular file, including its size. 
- The find command helps you search for files of a certain size.

[4 ways to check file size in Linux
](https://www.howtouselinux.com/post/check-file-size-in-linux)
All about Microservices in 350 words
Tags: microservices, beginners, monolithic, webdev
Published: 2023-04-09 13:38:24


In relatively recent times, we moved from monolith architecture to microservices. Monolith is the one of the architectures. In monolith, we write the whole code base ( all the functionalities ) within a single service. This makes change difficult so much so that even a small change can take up to weeks to get implemented. In such a situation, updating the monolith to a new technology becomes very tedious and time consuming. Moreover, monoliths are often stand alone application and it is often difficult for them to communication with other applications. Microservices offer a solution to the above problems and have become the popular architecture style.

Microservices are numerous small services that add up to provide the same functionality as the monolith. This makes them easier to implement, update, test and deploy individually. Also, should it be required, we can use different technologies to write individual microservices ( though it is not recommended that we use different technologies for different microservices under the same application. )

Microservices need to communicate with each other, either within the same application or outside the application. The communication techniques can be divided into mainly two subdomains: Synchronous and asynchronous


Synchronous communication is popularly done using REST API or HTTP APIs. A new form of communication is now becoming popular which is GraphQL ( will discuss it in a new article )

Asynchronous is popularly done using AMQP. The messages are sent using message broker systems like Kafka and RabbitMQ.

Each service can have its own database in order to be decoupled from other services. Data consistency between services is maintained using the Saga pattern.

Docker is a popular choice for deployment of microservices as are serverless functions ( AWS Lambda, Azure functions etc. )

To manage a large number of these APIs, we may use some API management tools like Google APIGEE, Amazon API Gateway, Microsoft Azure API Management etc. These platforms provide ways to manage APIs easily, uniformly and provide ways to secure, monetise and provide validations to the APIs.

Finally organizations like OWASP provide ever-updating list of how to improve the security of the APIs.

That’s all Folks!

-Shruti
Tutorials for Python beginners
Published: 2023-04-09 13:17:01

One of the most widely used programming languages worldwide, Python is used by many engineers, data scientists, and developers. If Python is new to you, you might not know where to begin. Fortunately, there are many online resources that can be used to learn Python. We'll look at some of the top tutorials for Python beginners in this blog post.

**Python.org**
The Python programming language's official website is located at Python.org. For beginners, it has a lot of resources, such as tutorials, documentation, and sample code. Learn Python by starting with the Python.org tutorial. In addition to data types, control structures, functions, and modules, it also covers the fundamentals of Python. Because it is written simply, the tutorial is simple enough for beginners to understand.

**Tutor Python**
Students looking to advance their knowledge of Python programming can use the platform provided by the tutor Python website.

These websites typically employ a group of skilled and knowledgeable Python tutors who provide individualized one-on-one tutoring sessions to assist students in learning Python, address their concerns, and lead them through coding assignments. This platform provides [online Python tutor](www.tutorpython.com) Support to all those who are looking out to learn Python with the help of experienced teachers.

**YouTube**
Beginners can find excellent Python tutorials on YouTube. Many YouTube users produce Python tutorial videos, covering everything from the fundamentals to complex subjects. 

To sum up, learning Python can be intimidating for a beginner, but with the aid of online tutorials and resources, it can be much simpler. There are a good amount of resources online that can assist you in learning Python, regardless of whether you like reading or watching videos. Therefore, choose a resource that suits you and begin your path to becoming a Python developer.
NextJS compilation issue
Tags: nextjs, typescript, react, webdev
Published: 2023-04-09 13:16:19

Recently started with Next js, just installed it and trying to run 'npm run build' and getting following - 



> SyntaxError: Unexpected token '?'
>     at wrapSafe (internal/modules/cjs/loader.js:915:16)
>     at Module._compile (internal/modules/cjs/loader.js:963:27)
>     at Object.Module._extensions..js (internal/modules/cjs/loader.js:1027:10)
>     at Module.load (internal/modules/cjs/loader.js:863:32)
>     at Function.Module._load (internal/modules/cjs/loader.js:708:14)
>     at Module.require (internal/modules/cjs/loader.js:887:19)
>     at require (internal/modules/cjs/helpers.js:74:18)
>     at Object.<anonymous> (/home/sushil/Work/Negotiation App/Code/codednode.pms.ui/node_modules/next/dist/cli/next-build.js:10:37)
>     at Module._compile (internal/modules/cjs/loader.js:999:30)
>     at Object.Module._extensions..js (internal/modules/cjs/loader.js:1027:10)

Looking for help in fixing this
`
Run GPT4All on Google Colab
Tags: gpt, googlecolab, llm
Published: 2023-04-09 12:38:01

In this article, I'll introduce how to run GPT4ALL on Google Colab.

{% github nomic-ai/gpt4all %}



1. Clone the repo
2. Download `pt4all-lora-quantized.bin`
3. Run gpt4all-lora-quantized-linux-x86 

```shell
main: seed = 1681043249
llama_model_load: loading model from 'gpt4all-lora-quantized.bin' - please wait ...
llama_model_load: ggml ctx size = 6065.35 MB
llama_model_load: memory_size =  2048.00 MB, n_mem = 65536
llama_model_load: loading model part 1/1 from 'gpt4all-lora-quantized.bin'
llama_model_load: .................................... done
llama_model_load: model size =  4017.27 MB / num tensors = 291

system_info: n_threads = 2 / 2 | AVX = 1 | AVX2 = 1 | AVX512 = 0 | FMA = 1 | NEON = 0 | ARM_FMA = 0 | F16C = 1 | FP16_VA = 0 | WASM_SIMD = 0 | BLAS = 0 | SSE3 = 1 | VSX = 0 | 
main: interactive mode on.
sampling parameters: temp = 0.100000, top_k = 40, top_p = 0.950000, repeat_last_n = 64, repeat_penalty = 1.300000


== Running in chat mode. ==
 - Press Ctrl+C to interject at any time.
 - Press Return to return control to LLaMA.
 - If you want to submit another line, end your input in '\'.
hello!

> \n
Thank you for your message, I'll be sure to respond as soon as possible
> You are welcome :) 
I hope my response was helpful. Let me know if there is anything else that we can do! Thank you again for reaching out and allowing us the opportunity to assist with your needs.\n \nThanks,
> What is the capital of the United States of America? \n
\n
The current capital city of the USA is Washington D.C., which was established as a result of an act passed by Congress in 1790 to establish a permanent seat for government functions.\n
> I am sorry, but I do not have enough information about your question or request. Please provide more details and context so that we can better assist you with our services!
> 
```

## clone the repo
```zsh
!git clone https://github.com/nomic-ai/gpt4all.git
```

## Download the model
This step will take some time so maybe mounting Google Drive would be a better way for this step.
```zsh
cd gpt4all/chat
!wget https://the-eye.eu/public/AI/models/nomic-ai/gpt4all/gpt4all-lora-quantized.bin
```

## Run the program
```zsh
!./gpt4all-lora-quantized-linux-x86 
```

You need to click the stop button to stop the program
Reflection (Programação Reflexiva)
Published: 2023-04-09 11:52:15



## Definições
Reflection é a habilidade de um programa reconhecer a sua estrutura através dos tipos de dados.

Reflection permite que um objecto obtenha informações sobre sua estrutura e sobre os motivos de sua computação.

Usando reflection, os dados sobre a estrutura do programa são inseridos e produzidos automaticamente pelo compilador na forma de meta-dados.

O paradigma de programação por trás dessa capacidade é chamado **programação reflexiva**.

## Usos da Reflection
- Informações de um objecto;
- Criação e modificação de classes, métodos e atributos dinamicamente (em tempo de execução);
- Adaptação do sistema dinamicamente às diferentes situações: carregar novas classes em tempo de execução. 
- Auto-otimização ou auto-modificação de um programa: pode ser feito modificando a própria área de memória do programa;
- Criação de ORMs poderosos, combinando com as anotations (anotações)
- Criação frameworks que baseados em injecção de Dependência (Ex: ASP NET Core, Spring e Quarkus);
- Programação genética;

## Vantagens
- Ganho de produtividade;
- Extensibilidade da linguagem;
- Substituição um trabalho repetitivo por automação;


## Desvantagens
- Complexidade do código;
- Facilidade na introdução de erros e falhas de segurança na aplicação
- Quando usada por excesso, pode reduzir o desempenho da aplicação;
- Sobrecarga da aplicação em tempo de execução.
 
Observação
As linguagens interpretadas são mais adptadas a trabalhar com reflections. Ex: PHP, Javascript e Python. A estrutura dessas linguagens permite trabalhar dinamicamente com os atributos e métodos de um objecto.

Linguagens compiladas usam o seu ambiente de execução para fornecer informação sobre o código fonte. Em algumas linguagens compiladas, o compilador grava o nome de elementos numa tabela que faz a correspondência desses nomes com os métodos e classes.

**Exemplo:** Usando a linguagem Go, vamos representar os seguintes problemas:
- Inspecionar um objecto (métodos, atributos, tipos e valores);
- Chamar métodos dinamicamente;
- Verificar se métodos e atributos existem;
- Contar quantos tipos primitivos são chamados por uma função.

**Artigo disponível em: **
https://www.dev.to/ortizdavid
https://www.medium.com/@ortizaad1994

**Código Fonte: **
https://github.com/ortizdavid/reflection-golang



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


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8hj7y9ju32lc0l41bqbo.jpg)


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9sc3btdrjzz9jrb9vrg5.jpg)


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


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



![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/h4z1wd2w24knvzlb8oon.jpg)
Working with streams in Node.js
Tags: javascript, typescript, node, streams
Published: 2023-04-09 11:52:02

When working with streams one of the coolest things ever is using async generators to do piped processing. Let's start with a simple example that generates numbers from 1 to 5:

```typescript
const numbers = async function* () {
  for (let i = 0; i < 5; i++) yield i.toString()
}
```

This generator yields 5 numbers, 0 through 4, as strings. Let's pipe them through to see them on the screen:

```typescript
Readable.from(numbers()).pipe(process.stdout)
```

Boom! Just like that, we're printing the content of the stream to standard output. Let's see how we can do the printing using `console.log()`:

```typescript
const logger = async function* (
  source: AsyncGenerator<string>
) {
  for await (const number of source) {
    console.log(number)
  }
}

Readable.from(numbers())
  .pipe(Duplex.from(logger))
  .resume()
```

The call to `Readable.resume()` at the end makes the stream pull all the values and process them.

What's interesting here is that we're using a `Duplex` stream created from an async generator. Since it is a `Duplex` stream (so `Readable` and `Writeable`) we can still process the data further. For example, we can augment the numbers with some description:

```typescript
const augmenter = async function* (source: AsyncGenerator<string>) {
  for await (const number of source) {
    yield `This is number ${number}`
  }
}

Readable.from(numbers())
  .pipe(Duplex.from(augmenter))
  .pipe(Duplex.from(logger))
  .resume()
```

Please note that the `source` argument to all the generators have a generic type, that will determine the type of element we are iterating over. In our case, the generic type is `string` so the `number` variable is of type `string`. 

I think that's totally cool - how about you?

Happy coding!
Best State Management Libraries in React.js
Tags: react, javascript, frontend, webdev
Published: 2023-04-09 11:50:09

**Introduction**

State management in React.js refers to the process of managing the state of a React component and updating its UI based on changes to that state. React components can have internal state that determines their behavior and rendering. State management is important for creating dynamic and interactive user interfaces.

In React, state is an object that represents the current state of a component. A stateful component has a state object that can be modified based on user interactions, server responses, or other factors. When the state changes, the component re-renders, updating its UI to reflect the new state.

---

**State Management Libraries**

There are several state management libraries available for React.js, each with its own advantages and disadvantages.

As with any library, it's important to consider the trade-offs and decide which one is the best fit for your specific needs.

---

Here are some of the most popular options:

- **Redux:** 
Redux is the most widely used state management library for React. It allows you to manage the state of your application in a centralized store, making it easier to debug and test your code. Redux also provides tools for handling asynchronous actions and middleware to extend its functionality.

---

- **MobX:** 
MobX is a simpler alternative to Redux that uses observable objects to manage state. It provides a more reactive programming model, where your components automatically update when the underlying state changes. MobX also has a smaller learning curve compared to Redux.

---

- **Context API:** 
The Context API is a built-in feature of React that allows you to share state between components without having to pass props down the component tree. It's useful for small to medium-sized applications, but can become unwieldy for larger applications.

---

- **Recoil:** 
Recoil is a newer state management library developed by Facebook. It aims to provide a simpler and more intuitive way to manage state in React. Recoil uses atoms and selectors to manage state, and supports asynchronous data fetching.

---

- **Zustand:** 
Zustand is a lightweight and fast state management library that uses the Context API under the hood. It's designed to be easy to use and to provide a simple API for managing state. Zustand supports middleware, derived state, and reactive updates.

---

**Conclusion:**

- Ultimately, the choice of state management library depends on the needs of your application and your personal preferences. It's worth trying out a few options to see which one works best for you.

---

💡 Thank you for reading this article. 

💡 You can follow me on: 
- [LinkedIn](https://www.linkedin.com/in/dev-alisamir)
- [Telegram](https://t.me/dev_ali_samir)
- [Facebook](https://www.facebook.com/alisamir.dev)
- [Instagram](https://www.instagram.com/alisamir.dev)
why a computer science degree is not necessary for success in the tech industry
Tags: webdev, javascript, programming, beginners
Published: 2023-04-09 11:07:50

The idea that you need a computer science degree to succeed is widespread in the technology sector. Although it can be helpful, a computer science degree is not necessary to succeed in the tech industry.

**Here are a few reasons why you don't need a computer science degree to succeed in tech:**

1. The technology sector is one of the most dynamic and quickly changing sectors, with new tools and technologies being developed on a regular basis. This implies that in a few years, the abilities that are in demand now might not even exist. Employers are seeking for people that can adapt, are inquisitive, and eager to learn because of this ongoing change. A computer science degree can be useful, but it's not the only method to acquire these abilities.

2. Degrees are less important in the computer business than experience and skills since employers are more interested in your abilities than your educational background. They want to know that you have experience using the technologies and tools that they do, and that you possess the knowledge and abilities required to identify issues and come up with solutions. You can acquire some of these talents without a computer science degree, however it's not the only option.

3. There are numerous entry points into the world of technology because it is so diversified. Many people enter the computer industry through self-taught or coding bootcamp programs, while others move from other professions. Although having a degree in computer science can be beneficial, it's not the only method to break into the industry.

4. Soft skills are also crucial: The tech sector values soft skills like cooperation, problem-solving, and communication in addition to technical skills. These abilities are frequently acquired through practical teamwork experience, and in many professions, they are just as crucial as technical abilities.

Having a computer science degree can be advantageous in the tech sector, but it's not necessary for success. Everyone can succeed in the tech industry if they have the perfect blend of experience, talent, and soft skills. Therefore don't let the fact that you lack a computer science degree stop you from pursuing a career in technology.
Understanding HTML tags.
Tags: beginners, programming, html
Published: 2023-04-09 11:04:02

**1. What are tags?**
Tags are the basic building blocks of HTML. HTML is a group different kind of tags having their own unique properties. Every tag contains opening and closing tag. Tags are also opened and closed in a specific order. The most recent tag should be closed first than the outer one.
For example:
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/s0xf5jtgx1svdm3q7niq.png)
There are many number of tags, a few of are:

- Heading tag.

- Paragraph tag.

- Image tag and many more.
We will understand each tag in detail in next module.
**2. Let's see few examples for better understanding:**

Example-1;
```
<h1>My HTML webpage content.</h1>
```
OUTPUT:

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

Example-2;

```
<h2>My Blog post</h2>
<img src="https://dev-to-uploads.s3.amazonaws.com/uploads/logos/resized_logo_UQww2soKuUsjaOGNB38o.png" />
```
OUTPUT:

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qfybtsfo9i9q2m18qmjo.png)
Typescript project template (NodeJS)
Tags: typescript, javascript, node, beginners
Published: 2023-04-09 11:03:01

TLDR
This is a minimum setup of Typescript project template (NodeJS).

Github repo:
https://github.com/airicyu/typescript-project-template

--------

I faced some setup issues some time ago.
The typescript stuff X nodejs module type bla bla bla....
I also spent some time to find correct setup to debug with typescript that looks fit.
All I want is sth that "It just works" and let me start coding.

After all, recently I find this template looks good and I used in several projects as starter template.
So I also want to share it with other developers, especially those who are new to learn NodeJS/Typescript.
Create security group and Key pair using Ansible
Tags: aws, cloud, awscommunity, 100daysofcloud
Published: 2023-04-09 11:01:56

[98/100] #100DaysOfCloud Today, I created a security group with SSH access and a Key pair and saved the Key pair on your local system using Ansible.

Ansible is an open-source automation tool that uses playbooks to enable you to make deployments faster and scale to various environments. Think of playbooks as recipes that lay out the steps needed to deploy policies, applications, configurations, and IT infrastructure. You can use playbooks repeatedly across multiple environments. Customers who use Ansible playbooks typically deploy periodic changes manually. As complex workloads increase, you might be looking for ways to automate them

You can try do it by yourself by following the steps from the link below: [GitHub](https://github.com/aaditunni/100DaysOfCloud/blob/main/Journey/098/Readme.md)