teleren/devto huggingface dataset:
Git Commit Show by Invide #season03
Published: 2021-10-14 15:29:32

**Allow us to introduce Git Commit Show 💻 One of the Leading Online Tech Conferences of the year! Is now up for it’s 3rd Season. Book the dates: 27th and 28th November, 2021. (GMT+5:30)**

--- --- ---

Come join us, live and interact with 👨‍⚖️Industry Leaders 👩‍💼 in Technology👩‍💻, Career🎓, and Open Source📀, to gain gargantuan knowledge in the tech domain and beyond that! 
Join us over our [discord](https://discord.gg/BWeENvyktD) [Youtube](https://www.youtube.com/c/InvideDeveloperCommunity)
Writing a story for a visual novel
Tags: gamedev, writing, renpy
Published: 2021-10-14 15:22:47

The story is one of the core aspects for visual novels. This article will focus on the early planning stages of creating a visual novel. 

The story is one of the core aspects of visual novels. This article will focus on the early planning stages of creating a visual novel.

###Why planning is important
In the early stages when developing a visual novel it is best to have an idea of what the game will be about. That's why I suggest writing out the story and dialogue draft before moving on to the next step. It keeps the story on track and prevents plot points from being forgotten.

###Tools to use for story writing
There are various tools when outlining the story for a visual novel. There are both free and paid software to use for writing. My personal choice is Twine, it is an open-source tool for writing interactive stories. I use Twine to draft and map stories before moving to Ren'Py for the next steps.

####Things will change
Going back and making changes to the story is likely going to happen when adding dialogue to the game. An example is going back to change the dialogue to flow more easily.

###How long does it take?
Depending on what the visual novel is about. The story could be long or short, simple or complex, the duration of a story varies. Writing and editing your story could take a week, to a few months, or maybe up to a year.

###Ask for help
Having another pair of eyes to look over the story to proofread is a good check to make sure the story flows as the game progresses. Another option is to ask for feedback to help improve the story. 

### Tools Mentioned
* [Twine] (https://twinery.org/)
* [Renpy] (https://www.renpy.org/)
Lab 2 6502 Assembly language lab
Tags: analyst, programming
Published: 2021-10-14 15:18:31

Hello, this is the lab 2 of SPO600.
##Print the horizontal line##
The first task in this lab that we are going to draw green line at the top and draw a blue line at the bottom.
```
LDA #05       		; Color Green code
          LDY #$00      ; Position Index on First Line
 
TOP: 
          STA $0200,Y   ; Store color into the current Pixel
          INY           ; Go to the next pixel
 
          CPY #32       ; Check if it gets to the pixel 32
          BNE TOP  ; If it didn't hit pixel 32 yet, keep going
```
We load a green pixel and set the start position of y at #$00. Then we store the color into the current position and set a loop to check the value of Y. If Y reached the end of the top line which is #32 then jump out of the loop.
We used the same logic to draw another blue line at the bottom.
```
LDA #06                  ; Color Blue Code
        LDY #$00         ; Position Index on Last Line
 
BOTTOM: 
             STA $05E0,Y; Store color into the current Pixel
             INY        ; Go to the next pixel by increase the value of Y
             CPY #32    ; Check if it gets to the pixel 32
       BNE BOTTOM  ; If it didn't reach pixel 32 yet, keep looping

```

##Print the vertical line##
In the second task we are going to print 2 vertical lines at each side the square. 
```
    LDA #$00          
    STA $10
    LDA #$02
    STA $11
    LDY $00
     
LEFT: 
       LDA #$07     ; Set color Yellow
       STA ($10),Y
 
       LDA $10
       CLC
       ADC #$20
       STA $10
 
       LDA $11
       ADC #$00
       STA $11
 
       CMP #$06
       BNE LEFT
```
First, we create 2 pointers to video memory and set them to $10 and $11.
Second, we set the loop. Inside of the loop, we set the yellow color and put it into the current pixel.
Next, we load the accumulator and clear the carry flag. Then we add $20 into the accumulator in order to increment each line in the screen vertically. After that, we store the value $10 into the memory. 
Afterwards, we load the value of $11 into the accumulator and store contents and carry flags into the memory.
At the end, we compare the content of memory with the accumulator to ensure the lines reach to the last page. If not, continue the loop.
Same idea to draw the purple line.
```
       LDA #$1F 
       STA $10
       LDA #$02
       STA $11
       LDY $00
     
RIGHT: 
       LDA #$04     ; Set color Purple
       STA ($10),Y
 
       LDA $10
       CLC
       ADC #$20
       STA $10
 
       LDA $11
       ADC #$00
       STA $11
 
       CMP #$06
       BNE RIGHT
```
And the result:
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6avtwf3p4bhl1oqhc54o.png)
Caveat
Published: 2021-10-14 15:14:29

There could be a potential web performance issue

If you have 3 of the same custom components in your app, and the custom component has huge JS library.

```py
  st.subheader("Component Test")
  rv = my_component(name="NameViteVanilla", key="K1", config=config, nodes=nodes, edges=edges)
  my_component(name="NameViteVanilla", key="K2", config=config, nodes=nodes, edges=edges)
  my_component(name="NameViteVanilla", key="K3", config=config, nodes=nodes, edges=edges)
```

You could end up loading the library 3 times (see image below). Ouch!

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

---

Seems like the multiple reload of JS code also happens if `streamlit-aggrid` is used.

Code snippet below displaying 3 grids

```python
grid_data1 = AgGrid(titanic_data, key="ag1", gridOptions=gridOptions)
grid_data2 = AgGrid(titanic_data, key="ag2", gridOptions=gridOptions)
grid_data3 = AgGrid(titanic_data, key="ag3", gridOptions=gridOptions)
```

Snapshot of browser network calls, showing the aggrid related JS file being called three times...

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

I could be doing something wrong here though. So this definitely needs some investigation...
First 2 Weeks Experience | Hacktoberfest 2021
Tags: hacktoberfest
Published: 2021-10-14 15:04:52

I always wanted to contribute in Open Source project and Hacktober Fest gives me this chance.

I Registered my self on the very first day it was available _(30th Oct)_ and started to find some good projects to contribute to.

### First Commit

After registering, I was surfing the Hacktoberfest website and found one video in the resource section which showed me how to contribute.

<p><a href="https://hacktoberfest.digitalocean.com/resources?wvideo=tf3u5ruz5y" target="_blank"><img src="https://embedwistia-a.akamaihd.net/deliveries/4bdee00ef68274f35bc6ad84ac1e49c6.jpg?image_play_button_size=2x&amp;image_crop_resized=960x540&amp;image_play_button=1&amp;image_play_button_color=1e71e7e0" width="400" height="225" style="width: 400px; height: 225px;"></a></p>

So, I contributed to the repo which was less about coding but more about how to contribute on github.
> I was already knowing about git and GitHub so it wasn't hard for me to get started


The project was that, every contributor have to write a `Haiku` (A Japanese format for poem) and then ask for a pull request

### Other Contributions
After getting how open source works I started finding projects of my interest which is Web Development.

The thing which I noticed here is that, making a project from zero is more _comfortable_ than working on someone else project and trying to fix something or add some new stuffs.

But working on someone else project is fun as it forces to learn new things because at first you can't know everything.

I also came to know that working directly on production level projects can be difficult as everyone wanted to contribute to those, so will not get any easy issues or bugs easily.

So, I tried doing some good projects which I found on Hactoberfest discord server and also found some from GitHub search.

### Progress
![My Hacktoberfest PRs](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/octw7dry1cdo4qxte3ud.png)  
I did my all 4PRs, and now I am finding some good project which I will do for fun.

You can suggest me some projects related to Web Development _(if you can)_.
> My Tech Stack:
- React
- Node JS
- Flask
- Firebase
- and HTML/CSS/JS _(my brain screaming don't mention it DUMB!)_

### Contributions

Projects I have contributed by now are:

- do-community/cloud_haiku
{% github https://github.com/do-community/cloud_haiku/pull/1704 no-readme %}

- vikhyatsingh123/Naruto-Shippuden
{% github https://github.com/vikhyatsingh123/Naruto-Shippuden/pull/371 no-readme %}

- Rishit30G/Personal-Portfolio
{% github https://github.com/Rishit30G/Personal-Portfolio/pull/20 no-readme %}

- Alitindrawan24/2048
{% github https://github.com/Alitindrawan24/2048/pull/3 no-readme %}

### Reflections
I think Hacktoberfest is a great way to start open source journey, till now I haven't made any good connections yeah but I am looking for some good projects and people whom I can work with.
Input Box For Halloween
Tags: codepen, javascript, showdev, webdev
Published: 2021-10-14 15:04:00

<h1>Input Box For Halloween</h1>

<h2>Description</h2>

<p>Try to focus on the text box! Trust me, it won't hurt you! 😉</p>

<p>I can't think of any text boxes having a bad UX interface, so I made an animation of halloween themed objects instead. 😅</p>

<p>This is an animation of objects when the user focuses on the text box.</p>

<p>There are few objects will appear during animation. Below is those objects:</p>

<ul>
<li>Pumpkins 🎃</li>
<li>Graves 🪦</li>
<li>Bats 🦇</li>
<li>Spider 🕷</li>
<li>Manor 🏠</li>
<li>Castle 🏰</li>
<li>Frankenstein 🧟‍♂️</li>
</ul>

<p>All the images are made using HTML and CSS only.</p>

<h3>Apologize</h3>

<p>I would like to say sorry for the repetitive codes I made especially in CSS, and JavaScript animation.</p>

<h2>Resources</h2>

<p><a href="https://greensock.com">GreenSock</a> Animation library for JavaScript. I really love this animation tool!</p>

<p><a href="https://fonts.google.com/specimen/Creepster">Creepster</a> Font used for this.</p>

{% codepen https://codepen.io/takaneichinose/pen/bGrNaJz %}
Stop Writing JavaScript Like This

Tags: javascript, webdev, programming
Published: 2021-10-14 14:53:16

Most of us are used to writing JavaScript code for a long time. But we might not have updated ourselves with new features which can solve your issues with minimal code. These techniques can help you write clean and optimized JavaScript Code. Today, I’ll be summarizing some optimized JavaScript code snippets which can help you develop your skills.

### 1. Shorthand for if with multiple || conditions
```
if (fruit === 'apple' || fruit === 'orange' || fruit === 'banana' || fruit ==='grapes') {
    //code
}
```
Instead of using multiple || (OR) conditions, we can use an array with the values and use the includes() method.

```
if (['apple', 'orange', 'banana', 'grapes'].includes(fruit)) {
   //code
}

```

### 2. Shorthand for if with multiple && conditions
```
if(obj && obj.address && obj.address.postalCode) {
    console.log(obj.address.postalCode)
}
```

Use optional chaining (?.) to replace this snippet.

```
console.log(obj?.address?.postalCode);
```
###3. Shorthand for null, undefined, and empty if checks


```
if (first !== null || first !== undefined || first !== '') {
    let second = first;
}
```

Instead of writing so many checks, we can write it better this way using ||
(OR) operator.

```
const second = first || '';
```

### 4. Shorthand for switch case
```
switch (number) {
  case 1:
     return 'one';
  case 2:
     return 'two';
  default:
     return;
}
```
Use a map/ object to write it in a cleaner way.

```
const data = {
  1: 'one',
  2: 'two'
};
//Access it using
data[num]
```
### 5. Shorthand for functions with a single line
```
function doubleOf(value) {
  return 2 * value;
}
```
Use the arrow function to shorten it.

```
const doubleOf = (value) => 2 * value
```

# [Buy me a coffee](https://www.buymeacoffee.com/rubengabriel)
Confused about online courses ?
Tags: beginners, programming, productivity, androidclub
Published: 2021-10-14 14:40:16

#### Shortlisting online courses is a major ordeal ......

But VIT Android Club is here to resolve your headache for you with a eloquent blog .
Click on the link below and get brilliant insights and learn the tips and tricks to efficiently chose online courses and begin your learning journey

{% link  https://dev.to/garimanbhutani/how-to-shortlist-online-courses--203h %}
How to setup and test Postman API Collection
Tags: postman, javascript, frontend, webdev
Published: 2021-10-14 13:58:59


If you are a web frontend developer or mobile app developer, you have likely encountered the need to test your API before integration. For experienced developers, this is not an issue, but for the newbies, it could get confusing. 

Whenever we onboard new interns in the dev department of [Special Man Global Solution LTD](https://specialmansolution.com) and they are assigned a task, especially a frontend task, the first challenge is how to test the API, and I am always happy to guide them through it. 

In this article, I will share a brief on how you can test API endpoints using [Postman](https://www.postman.com/) to help you consume [API](https://www.infoworld.com/article/3269878/what-is-an-api-application-programming-interfaces-explained.html) appropriately.

##Accessing the collection
First, you are giving a collection URL for the Postman. When you open it, you will see something like this.
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/f123di9czptmmsrhkxjn.png)

###1 and 2. The Request Endpoint and Folder
This section shows the arrangement of the API endpoints. Here they are grouped in folders. Inside the folder, there is the actual endpoint. Showing the endpoint name and the request method. 

###3. The Environment
This shows any environment setup that contains all variables the Postman collection is set up with. 

###4. Specification
This allows you to select the preferred pattern or specification you want to view the endpoint request with.

###5. Documentation Body
This is the documentation body that describes guides you need to know to be able to consume the request.

###6. Run in Postman
This allows you to test the API on the web or your local PC.

###7. Request Definition
This shows you the request definition depending on the pattern or specification you selected above.

##Testing the endpoint
Click on run in Postman, then Postman for the web.
Select your preferred workspace

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

Then click on the endpoint you want to test, make sure the method, body and data type are correct, then click on send, you will see the data show.

##Request with JWT Authentication
If your endpoint is protected using JWT; you will need to set the auth on Postman else you will be getting unauthorized error.
Login using the login endpoint, copy the JSON Web Token, then click on the collection, under Authorization tab, sent:
**Type** = Bearer Token
**Token** = The JWT token you copied.
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/euklaxin4vbne4dsq0b9.png)

With this you can access all the endpoints, if you encounter more issues, you inform the backend team to get them fixed.

I hope this article can help you set up and test API endpoints before integration on your frontend project.

> The API documentation used here is from [The StartUp Intern's Refinery Program](https://thestartupintern.com)
5 coisas pra você saber antes de palestrar: Call For Papers
Tags: video, events, career
Published: 2022-02-16 21:36:48

---
title: 5 coisas pra você saber antes de palestrar: Call For Papers
published: true
date: 2021-10-14 13:40:00 UTC
tags: video,events,career
canonical_url: https://blog.lsantos.dev/5-dicas-de-cfp/
cover_image: https://raw.githubusercontent.com/khaosdoctor/blog-assets/master/images/2021/10/5-dicas-de-cfp.png
---

Bora discutir um pouco sobre eventos de tecnologia e como eles podem ajudar na sua carreira?

Nesse vídeo vamos iniciar uma série onde vamos falar só sobre eventos de tecnologia de vários aspectos! Começando com um dos mais importantes: **O Call For Papers**!

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

## Links comentados

- [Coisas que ninguém te ensina a fazer, mas que todo mundo espera que você saiba: submissão de C4P](https://dev.to/godspowercuche/coisas-que-ninguem-te-ensina-a-fazer-mas-que-todo-mundo-espera-que-voce-saiba-submissao-de-c4p-45ba-temp-slug-9215468)
Code Smell 94 - Too Many imports
Tags: oop, programming, webdev, tutorial
Published: 2021-10-14 13:03:40

*If your class relies on too many others, it will be coupled and fragile. A long import list is a good indicator.*

> TL;DR: Don't import too much.

# Problems

- Coupling

- Single Responsibility Principle violation

- Low Cohesion

# Solutions

1. Break the class

2. Hide intermediate accidental implementation

# Sample Code

## Wrong

[Gist Url]: # (https://gist.github.com/mcsee/1ee88717de17b2cc57b12fbd5d6e9bf2)
```java
import java.util.LinkedList;
import java.persistence;
import java.util.ConcurrentModificationException;
import java.util.Iterator;
import java.util.LinkedList;
import java.util.List;
import java.util.ListIterator;
import java.util.NoSuchElementException 
import java.util.Queue;
import org.fermi.common.util.ClassUtil;
import org.fermi.Data;
//We rely on too many libraries

public class Demo {
   public static void main(String[] args) {
      
   }
}
```

## Right

[Gist Url]: # (https://gist.github.com/mcsee/920db69fda667e32b9d682fdab61c634)
```java

import org.fermi.domainModel;
import org.fermi.workflow;

//We rely on few libraries
//and we hide their implementation
//So maybe transitive imports are the same
//but we don't break encapsulation

public class Demo {
   public static void main(String[] args) {
      
   }
}
```

# Detection

We can set a warning threshold on our linters.

# Tags

- Coupling

- Ripple Effect

# Conclusion

We need to think about dependencies when building our solutions to minimize Ripple Effect.

# Relations

{% post https://dev.to/mcsee/code-smell-61-coupling-to-classes-3jdk %}

# More Info

- [Coupling: The one and only software design problem](https://dev.to/mcsee/coupling-the-one-and-only-software-design-problem-2pd7)

- [Namespaces on Wikipedia](https://en.wikipedia.org/wiki/Namespace)

# Credits

Photo by <a href="https://unsplash.com/@zmachacek">Zdeněk Macháček</a> on <a href="https://unsplash.com/s/photos/pile">Unsplash</a>

{% twitter 1447623706767921153 %}

* * *

> Fools ignore complexity. Pragmatists suffer it. Some can avoid it. Geniuses remove it.

_Alan Perlis_
 
{% post https://dev.to/mcsee/software-engineering-great-quotes-26ci %}

* * *

This article is part of the CodeSmell Series.

{% post https://dev.to/mcsee/how-to-find-the-stinky-parts-of-your-code-1dbc %}
SPO600 - Lab 1
Published: 2021-10-14 12:58:05

Lab 1 requires the selection of 2 open source software packages which run under different licenses, and researching their solutions. Here are my selections.


#**Trezor Wallet**

Trezor Wallet is an open source hardware wallet for storing a wide variety of cryptocurrencies. I personally own a Trezor Model T, and it hasn't disappointed. The wallet is licensed under GPLv3 which means you can use it but you must make your own sources available to the public as well.

They publish everything on their [GitHub](https://github.com/trezor).

The most recently accepted pull request (23 hours ago) can be seen [here](https://github.com/trezor/trezor-firmware/pull/1848). 6 people were needed to check and approve this change.

#**TaskbarX**

TaskbarX is an open source software allowing you to customize your Windows taskbar in many different ways. The way in which I use it is to center the icons on the taskbar, rather than having them stick to the left side. They run under the MIT License.

They too publish through [GitHub](https://github.com/ChrisAnd1998/TaskbarX).

The most recently accepted pull request for them was [posted 12 days ago](https://github.com/ChrisAnd1998/TaskbarX/pull/820) and successfully approved. It took 10 days and only one person was needed to do so.
Set logback to different level for specific package
Tags: logback, java, logging
Published: 2021-10-14 12:54:10

If I want to set log level for package `com.foo.bar` to `TRACE` I can use a system property `logback.configurationFile` to define path to logback config.

```
-Dlogback.configurationFile=/Users/foo/logback.xml
```

In the Logback config I just need to set a new logger like this:
```
<configuration>
    <appender name="STDOUT" class="ch.qos.logback.core.ConsoleAppender">
        <encoder>
            <pattern>%d{HH:mm:ss.SSS} [%thread] %-5level %logger{36} - %msg%n</pattern>
        </encoder>
    </appender>

    <logger name="com.foo.bar" level="TRACE"/>

    <root level="INFO">
        <appender-ref ref="STDOUT"/>
    </root>
</configuration>
```
Mengenal Google Blockly (Semua Orang Bisa Menjadi Programmer)
Tags: googleblockly, javascript, programming
Published: 2021-10-14 12:50:09

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

### Pengenalan Blockly

Pada artikel kali ini saya ingin membahas mengenai google blockly, dimana semua orang bisa menjadi programer karena interfacenya yang mudah dipahami.

Kerumitan dalam bahasa pemrograman membuat google mempunyai inisiatif untuk menemukan suatu metode agar para pemula dapat memahami pemrograman.  

Dengan mengubah bahasa pemrograman seperti variable, looping, statements menjadi balok-balok. Untuk menulis suatu program, blok tersebut harus disusun sehingga menjadi suatu scipts terjemahan suatu bahasa pemrograman.


### Sejarah blockly

Pengembangan blockly dimulai pada musim kemarau 2011 dan dirilis ke publik untuk pertama kalinya tahun 2012 pada Maker Faire. Blockly sebenarnya didesain untuk menggantikan OpenBlocks yang ada pada App Inventor. Para tokoh yang mengembangkan blockly adalah Neil Fraser, Quynh Neutron, Ellen Spertus, dan Mark Friedman.

### Menjadi developer blockly

Dari perspektif pengguna, Blockly adalah cara visual dan intuitif untuk membuat kode. Dari perspektif pengembang, Blockly adalah UI siap pakai untuk membuat bahasa visual yang men-generate kode yang dibuat secara sintaksis yang dibuat pengguna. Blockly dapat mengkonvert blok ke banyak bahasa pemrograman seperti dibawah ini : 

- JavaScript
- Python
- PHP
- Lua
- Dart

### Keunggulan Google Blockly 

Blockly adalah salah satu visual programming yang akan terus berkembang dan populer. Dalam mengambil keputusan atau decision making dalam aplikasi sangatlah penting, Blockly ini mempunyai kemampuan dalam membuat suatu keputusan dengan mudah. 

Kode yang Exportable. Pengguna dapat meng-extract block mereka ke berbagai bahasa pemrograman lain sehingga blockly dapat diterapkan di berbagai macam platform yang ada.
Open source. Segala sesuatu yang ada pada blockly bersifat terbuka. Kita dapat mengedit block baik mengubah code, warna, jenis dan menambahkannya di site yang kita miliki.
Extensible. Dengan API pada blockly kita dapat mendambahkan berbagai macam block khusus atau jika ingin menghapus block yang tidak dibutuhkan
Mempunyai kapabilitas yanag tinggi. Blockly bukan mainan. Anda dapat mengimplementasikan tugas pemrograman yang rumit seperti menghitung standar deviasi dalam satu blok.
Digunakan secara Internasional. Blockly telah diterjemahkan ke lebih dari 40 bahasa, termasuk versi kanan-ke-kiri untuk bahasa Arab dan Ibrani.
Sekian untuk pembahasan kali ini pada artikel selanjutnya saya akan menjelaskan secara teknis bagaimana menggunakan blockly pada aplikasi web.

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