teleren/devto huggingface dataset:
Native Development vs React Native
Published: 2021-04-01 03:34:43

I often asked myself why developing apps for either iOS or Android had to be so different throughout my time at Algonquin College. It was no secret that I was much better at using Javascript, HTML, and CSS instead of OOP (Object Oriented Programming) or Swift. Then in the third term, we were introduced to React Native. React Native allows a developer to create one application and deploy it to both the Google Play Store and App Store, as long as they followed each store's respective rules and guidelines. 

So, is native app programming dead? To answer this question, let's list some pros and cons for both. Interestingly, the pros for one language are the con of another and vice versa.


#### Pro: Native Development (Android Studio and Swift)	
#### Con: React Native (or similar programming languages)

##### 1. Control 

While React Native allows you to create custom code for both platforms, it can become quite tedious as the same element on one platform and behave completely different on the other. Trying to pinpoint each one of those differences and coding them differently in different folders can create confusion. In some cases, it might be easier to develop them separately to keep a smooth workflow. 

##### 2. Features

When coding for a platform natively, developers can take full advantage of a phone's technology and features. In many cases, platforms and devices vary in this respect. 


#### Con: Native Development (Android Studio and Swift)
#### Pro: React Native (or similar programming languages)

##### 4. Following Different Guidelines

The biggest struggle of developing an app is following platform guidelines. When coding in React Native, you can keep all the same back-end of an app and change the front-end design to accommodate guidelines. Instead of having two sets of code like with Native development.

##### 5. Different Experiences for Users 

Often overlooked is the hassle of explaining to an elderly relative how to use an app over the phone. Throw in different UX designs, and it gets worst. When developing with React Native, you can code to follow iOS standards and still deploy to the Google Play Store. Perhaps this is intentional to create user envy and drive conversion, but all in all, it's sometimes annoying.

##### 6. Developing Two Versions 

I know that I am starting to sound like a broken record. Still, the natural appeal to using React Native or similar program languages is that these languages attempt to take away the hassle of developing an application twice. By having a single source code, developers can release new versions promptly and consistently.
	
#### Verdict 

All in all, both programming languages have their appeal. I prefer React Native for both front-end and back-end development and only run into trouble when an android device decides to render my design differently. With that said, you have to find what works best for you and your project.

[Image Reference](https://www.futuremind.com/blog/pros-and-cons-react-native-and-native-apps)
Draw Ironman Helmet With Python Turtle Graphics
Tags: python, techarge, programming, turtle
Published: 2021-04-01 03:32:17

Hi folks, Hope you are doing great!

Today, We are going to learn how to draw Ironman Helmet using [Python](https://techarge.in/getting-started-with-python/) Turtle Graphics by making use of various functions of the turtle module.

Turtle is an inbuilt Python library that enables users to create simple graphics and shapes by providing them with a virtual canvas. Here’s my code that creates a simple Ironman Helmet using a turtle. Have fun!

```
import turtle
# Top Part
piece1=[[(-40, 120), (-70, 260), (-130, 230), 
(-170, 200), (-170, 100), (-160, 40), (-170, 10), 
(-150, -10), (-140, 10), (-40, -20), (0, -20)],[(0, -20), 
(40, -20), (140, 10), (150, -10), (170, 10), (160, 40),
(170, 100), (170, 200), (130, 230), (70, 260), (40, 120), 
(0, 120)]]
# Middle Part
piece2=[[(-40, -30), (-50, -40), (-100, -46), (-130, -40),
 (-176, 0), (-186, -30), (-186, -40), (-120, -170), 
(-110, -210), (-80, -230), (-64, -210), (0, -210)],
[(0, -210), (64, -210), (80, -230), (110, -210), (120, -170), (186, -40), (186, -30), (176, 0), (130, -40), (100, -46), (50, -40), (40, -30), (0, -30)]]
#Bottom Part
piece3=[[(-60, -220), (-80, -240), (-110, -220), 
(-120, -250),(-90, -280), (-60, -260), (-30, -260), (-20, -250), (0, -250)],[(0, -250), (20, -250), (30, -260), (60, -260),
 (90, -280), (120, -250),(110, -220), (80, -240), (60, -220), (0, -220)]]
turtle.hideturtle()
turtle.bgcolor('#ba161e') #Dark Red
turtle.setup(500,600)
turtle.title("I AM IRONMAN")
piece1Goto=(0,120)
piece2Goto=(0,-30)
piece3Goto=(0,-220)
turtle.speed(2)
def draw_piece(piece,pieceGoto):
    turtle.penup()
    turtle.goto(pieceGoto)
    turtle.pendown()
    turtle.color('#fab104') #Light Yellow
    turtle.begin_fill()
    for i in range(len(piece[0])):
        x,y=piece[0][i]
        turtle.goto(x,y)

    for i in range(len(piece[1])):
        x,y=piece[1][i]
        turtle.goto(x,y)
    turtle.end_fill()
draw_piece(piece1,piece1Goto)
draw_piece(piece2,piece2Goto)
draw_piece(piece3,piece3Goto)
turtle.hideturtle()
turtle.done()

```

For more python project like this checkout [python projects](https://techarge.in/python-projects/)

Thanks for playing! Happy coding!
LeetCode 328. Odd Even Linked List (javascript solution)
Tags: algorithms, javascript
Published: 2021-04-01 03:29:12

###Description:
Given the head of a singly linked list, group all the nodes with odd indices together followed by the nodes with even indices, and return the reordered list.

The first node is considered odd, and the second node is even, and so on.

Note that the relative order inside both the even and odd groups should remain as it was in the input.

###Solution:
Time Complexity : O(n)
Space Complexity: O(1)

```javascript
var oddEvenList = function(head) {
    // Handle base cases
    if(!head || !head.next || !head.next.next) {
        return head
    }
    
    // Set two pointers
    let cur = head
    let next = head.next
    
    // Set the odd.next to point to the next even node
    // Move each pointer up one node on each iteration
    while(next && next.next) {
        const temp = next.next
        const temp2 = cur.next
        
        cur.next = temp
        next.next = temp.next
        temp.next = temp2
        
        cur = cur.next
        next = next.next
    }
    
    return head
};
```
So Sánh Giá
Published: 2021-04-01 03:23:30

Sosanhgia.com.vn là website so sánh giá tự động, chia sẻ mã coupon, đánh giá sản phẩm trên các trang thương mại điện tử lớn và uy tín nhất hiện nay.
Website: https://sosanhgia.com.vn
Email: contact@sosanhgia.com.vn
Brave Creators
Published: 2021-04-01 03:17:27

Heeeeey guys!!

My name is Gustavo Scarpim, and today I’m going to show you how to be a digital creator verified by Brave.

I particularly enjoyed the Brave browser a lot and I believe that it's not just me, besides being identical to Google Chrome it still has some more features that make it even better, and one of those features that in my view draws a lot of attention is the possibility you are able to receive payments on your own website through the Brave wallet.
If you still don't know how to assign this to your website, I'll show you how to quickly and easily add this functionality to your website.

1- Go to <a href="https://creators.brave.com/sign-up" target="_blank">https://creators.brave.com/sign-up</a> and register your email to access your creator area.

2- Click here "+Add Channel"
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7fh75haw9fmyfsj0z8hv.png)
 
3- Choose the type of account you want to assign to your wallet (We will only focus on WebSite)
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wpm2nmcoyg4abemdnd6u.png)
 
4- Insert your domain
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b4n79nmxyslmo9ucp9em.png)

5- Choose one of the options to configure (I will choose Download a trusted file here)
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4wmlpun9rrz8cexryaq5.png)
  
6- Download the well-known file, go to your website's repository and create a folder at the root of your project called .well-known
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/at3gzwnjsltxuj76qzv4.png)
 
And ready, the process takes about a maximum of 48 hours to be approved, after it is approved, your website will show that you are a creator verified by Brave and any amount you receive on it, will fall directly into your Brave wallet.
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/51wdql5lo23v4ha53iwx.png)
 
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/aump02dk4uitf3ae7vfl.gif)
Experience with MLH
Tags: csharp, mlh, localhackday
Published: 2021-04-01 02:54:00

When I was about 9 years old, I would always see my cousins heading out in the morning. I was very confused and built some courage to ask them, why they would get up so early and where they are going. They told me that they were attending something called a Hackathon, and that's where it all started. Currently, I'm in high school and I have attended multiple hackathons and events such as local hack day share. I am so thankful that I've joined such a helpful and great community, and I am excited to see what the future has in stock for me.
First picture of semi-functional mining terminal
Tags: gamedev, communitydeveloped, opensource, projectuniverse
Published: 2021-04-01 02:49:38

Mining is initially handled by your personal drone fleet. Look through the menu for available asteroids, click launch on the one with the desired resources, wait for them to mine, then return with loot.

Player fleets are upgradable & expandable, what yours is composed of is entirely up to you!

To learn more, join the community, crowdfund support dev, contribute to dev as a dev: Shaostoul.com
Understand "esModuleInterop" option in Typescript
Tags: typescript, esmoduleinterop, webpack
Published: 2021-04-01 02:46:58

Here are couple of cases that I have tested how the option `esModuleInterop` of Typescript compiler (`tsc`) works.

Each test will have 2 different imports (one is default import and an namespace import) and we'll check the generated code.

# #1
- `{ esModuleInterop: false }` with `tsc`

```typescript
import * as foo from "foo";
import bar from "bar";

console.log(foo, bar)

// JS

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var foo = require("foo");
var bar = require("bar");
// I'm not sure why (`.default`), but most of `commonjs` modules 
// won't export this value which causes void 0
console.log(foo, bar.default);

```

# #2
- `{ esModuleInterop: true }` with `tsc`:

```typescript
import * as foo from "foo";
import bar from "bar";

console.log(foo, bar)

// JS
var __importStar = (this && this.__importStar) || function (mod) {
    if (mod && mod.__esModule) return mod;
    var result = {};
    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
    __setModuleDefault(result, mod);
    return result;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};

Object.defineProperty(exports, "__esModule", { value: true });
var foo = __importStar(require("foo"));
var bar = __importDefault(require("bar"));

// In this case, `foo` won't work if `foo` is `commonjs` which is a single export: 
// `module.exports = {}` 
// then it would return { default: {} }
console.log(foo, bar.default);
```

# Finally, we have an issue with `webpack`:

Let's say to have module `foo` which is quite common pattern: 

```
- lib
-- index.cjs.js
-- index.esm.js
```

`index.cjs.js`
```javascript
module.exports = {}
```

`index.esm.js`
```javascript
export default {}
```

Then import:
```typescript
import * as foo from "foo"

console.log(foo)
```

with `foo`'s package.json: 

```json
{
  main: './lib/index.cjs.js',
  module: './lib/index.esm.js'
}
```

would result in in `webpack`:

```typescript
var foo = __webpack_require__("./node_modules/foo/lib/index.esm.js");

console.log(foo) // { default: {...} }

// But with `cjs`, it works

var foo = __webpack_require__("./node_modules/foo/lib/index.cjs.js");

console.log(foo) // {...}

```

If `webpack` takes `es2015+` module, it will transform to `harmony` module.

```javascript
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony default export */ __webpack_exports__["default"] = (Bar);
```

- `__webpack_require__` with `esm`:

```javascript
// foo.js
export default 1;

// result
__webpack_require__('foo.js'); // { default: 1 }
```

- `__webpack_require__` with `cjs`:

```javascript
// foo.js
module.exports = 1;

// result
__webpack_require__('foo.js'); // 1
```

- `esModuleInterop` option won't affect to `es2015+` module.
K8s in KIND
Tags: kubernetes, docker
Published: 2021-04-01 02:40:20

I have been playing around with Kubernetes lately and was looking for an easy way to get a cluster going locally. I came across [Kind](https://kind.sigs.k8s.io/) when looking for this solution and found it really easy to use.

It's super easy to get a cluster going especially if you already have kubectl installed. It's fast to install kind as you can just download the executable and include it in your path. 

In PowerShell for example
```sh
curl.exe -Lo kind-windows-amd64.exe https://kind.sigs.k8s.io/dl/v0.10.0/kind-windows-amd64
Move-Item .\kind-windows-amd64.exe c:\some-dir-in-your-PATH\kind.exe
```

Getting a cluster going after installation is just as easy

![Kind Cluster Created](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x41e6kmxbxuurzeuobiq.gif)

Commands:
```sh
docker ps
kind create cluster
docker ps
watch kubectl get nodes
```

After a few seconds you will have a control plane up and ready to accept commands. I think it will be really fun to explore what can be done by having a Kubernetes cluster available in such a short amount of time.
Open Source Discord Bot
Tags: discord, discordbot, opensource, contributorswanted
Published: 2021-04-01 02:09:34

I recently decided to start writing a Discord Bot. After struggling through a few sessions of work, I decided it would be fun to open source it so I could have a community to work on it with. Open Source is a great experience.

If you want to check out the project, visit https://github.com/Heptagram-Bot/Heptagram

EDIT: 
I forgot to clarify. The bot is a multipurpose bot so it has lots of commands. The goal is to have one bot for everything instead of lots of bots.
Accessibility checklist for UX Designers
Tags: webdev, ux, programming, codenewbie
Published: 2021-04-01 02:09:24


Creating accessible style isn't that troublesome and expensive as you'll assume. Let's see the subsequent list of topics and enhancements, which may assist you with this method. 🔥🧑🏽‍💻

---

### Responsivness

Firstly you should make sure that your design is accessible for all devices. Also, make sure that breakpoint are set well. 

- 1280px and more : Large Desktop
- < 991px  : Tablets
- < 767px  : Mobile landscape
- < 478px  : Mobile portrait


---

### Hierarchy 

Clear hierarchy is one the key UX aspects of every interfaces. Let's see the following examples how to express the importance (hierarchy) of particular elements: 

- Use scale and sizes to express the importance
- Use white space around the element to make them stand out
- Using different color and contrast
- Layout in Z or F pattern
- Use animation and motion (but not excess of it)

---

### Color Contrast

One of the key principles of great accessibility is a contrast. You should carefully care about good contrast ratio of each design element. You can use ![Get Stark](https://getstark.co) to check accessibility. 


---

### Colorblind

Making your design accessible means also taking care of people with colorblind diseases. Make sure your color palette is recognizable for all people. You can again use ![Get Stark](https://getstark.co) to do various simulations. 

Tips: 

1. You should limit the color palette used for the website. The fewer colors used in the design, the less confusion. In addition to being a timeless and beautiful trend, minimalist design is useful when considering color accessibility.  Instead of just relying on black and white as the only contrasting color; try to use significantly different colors and shades in the design. 

2. It is difficult to overlay text with images because some or all of the images may not be in good contrast with the text. Decreasing the opacity of the background increases the contrast, making the text easier to read.


---

### Feedback

Communication is a really important aspect also in design. Make sure that users know what they have done. You can achieve it for example with great interaction design or dialogs. 

---

Only 5 simple steps to check when designing to increase User Experience. 

Thank You For Reading !
Need React.js Developers for 4/30/2021 Deadline
Tags: react, node
Published: 2021-04-01 01:39:48

Working on a large financial planning product.  Might need 4-6 developers to help meet a deadline of 4/30/2021 to get to level of basic functionality for 40 remaining modules (68 modules already done).

Classic product, first developed in 1984, is widely used (first VisiCalc, then Lotus 1-2-3, then Pascal/Delphi for the past 27 years).

Looking for guidance on how to build a short-term "SWAT" team to help existing team take product into the end zone.
Episode 1 Of "The Quasar Show" goes live on Thursday
Tags: quasar, vue, webdev
Published: 2021-04-01 01:23:32

## Episode 1 of "The Quasar Show" goes live tomorrow! Thursday 9:00pm CET
{% youtube XxUYIg1eS9o %}

Hello Quasar Developers!

My name's Luke, and I'm a new member of the quasar team, focusing on video content.

This is a quick post to let you know that **Episode 1 of "The Quasar Show" goes live tomorrow!**

time: Thursday 9:00pm CET

## What will be covered?

I hope to see you there! We'll be covering:
- The latest quasar/vue news
- A short play with the composition API
- Showcasing awesome quasar projects, live in the real world!
- Two cool components and how to use them
- "Corners of the docs" you may not know about
- Architecture (For all you Intermediate to Advanced Devs)
- And the story of how I fell in love with Quasar

Excited? Me too!
Here's a short teaser...
{% youtube rnB0YcGUOPM %}

*Save the date/time* in your calendar, and remember...

You can build anything.
Start Making My 1st Game
Tags: gamedev, help, godot
Published: 2021-04-01 01:18:55

I'm a tech artist, I know a bit about coding and web development. For this gardenring game, I only created 3D models and UI elements so far, no platform selected yet. I was looking at some "How to "tutorials related to GODOT, but most of them are for fps or Parkour games. I wonder if I can still use GODOT for my gardening game?
New Test
Tags: test, tags, for, things
Published: 2021-04-01 01:16:16

![Cover Image/Header Image for 
        New Test](https://cdn.searchenginejournal.com/wp-content/uploads/2020/02/seo-javascript-the-good-the-bad-the-uncertainty-5e4a09b3cd5db.png)
        <br>Testing again
Four months later...
Tags: codenewbie, womenintech, impostersyndrome
Published: 2021-04-01 00:59:39

Truth is half the time if not all the time, I’m not sure what I am doing. 
The first month I was getting familiar with how things are done in the organization, reading the code which I didn’t even understand. Watching tutorials of the system to see what am I gonna be dealing with. I wanted to code sooo bad, I mean I’m hired as a software developer why the hell am I not coding? 

I watched the tools they use, visual Studio, asp.net , VB ,C#, Json, APIs,  postman ... I took my free time to learn these because ... imposter syndrome was also hitting your girl real hard. I became consistent in learning, asked stupid questions. Yes, I did this to get better at my job, but above everything I did that to get confidence in my work...

I was so nervous that they will see I don’t know what I’m doing and just fire me, so I needed to get better for the time I’m there so that if I do get fired I can still find a job elsewhere, showcase my skills that I learnt the time I was there. I was desperate to learn, I worked everyday, every night, even during weekends. When my team lead couldn’t explain or help cause he deals with a lot, clients and devs, local and international...I’d just ask other team members to help. For this four months I am doing All I can to “breath just above the water”. 

The second month we got in pairs, well, I think a team of new people who both are clueless is tough, it’s like sending two blind strangers on a treasure hunt in the woods. Yes, you want to find the treasure but you also want to be the one that finds it, trust is minimal, my team mate and I would work on the same thing like it’s a 400m race, who ever gets there first...not trusting what he said , me not trusting his instinct as well. So... ok bro do what you think is right I’ll do the same, and we will use whatever works. 
That’s one thing I learned early ... trust is important in team members. Well, our team leads both helped us with trusting each other...eventually got there. 

Later on came, “working from home...”
What a challenge it was at first, but eventually I got to love it, saves money, I mean...jnrs don’t get paid a lot y’all know. So this was great for me financially, no transport money and no lunch money. It was a blessing I didn’t even know I needed, I worked twice as hard, I managed to solve my tasks by myself.. with lil help from my team leads and YouTube and stack Overflow lol ..I have to admit solving a task from stack Overflow makes one feel like a bad ass...that’s senior devs platform.i got to have confidence in my self...and that might not be good enough, but it’s good. 

All I have to say is ... four months later...I grew, I adapted and thanks to supportive team and family...I am definitely at a better level of “I don’t know anything”. Team members that will get stuck with me and try to solve a problem, which also they have no idea of, was kind of enough for me. Learning that it’s okay to not know everything but just give your best ‘try’...you might ‘catch’ a big fish;
linux lite test results
Tags: linux, testing
Published: 2021-04-01 00:48:37

Well guys, I had my first approach with this Linux distro but my experience was not pleasant since I could not do the extended screen mode so it does not serve me since the purpose of testing Linux distros is focused on programming
I read during these days documentation in forums, official but I did not find a solution to my problem, so well .... I will try Ubuntu (this is because I am still new to Linux distros) and based on its large community to solve problems that may arise.
Without further ado I will be uploading how I am doing with this new distro.
And have you used Linux Lite? what was your experience? Leave your comments.
Greetings !!