teleren/devto huggingface dataset:
creating Components (part I)
Tags: css, html, react, javascript
Published: 2019-10-31 05:30:44

there are two  main ways to creating components in React.now we can discuss about how to create the components in the React.

1.stateless functional components

stateless component is just a plain javascript function which takes props as an argument and returns a react element, A stateless component has no state.

They have 2 main features:
*When rendered they receive an object with all the props that were passed down.
 *They must return the JSX to be render.

basic structure for the statelss components

example:-


import React from 'react';
 import PropTypes from 'prop-types';
const FirstComponent = props => ( 
   <div>        
Hello, {props.name}! I am a FirstComponent.   
 </div> );
 FirstComponent.propTypes = {   
 name: PropTypes.string.isRequired, 
}









2.state components

The heart of every React component is its “state”, an object that determines how that component renders & behaves. In other words, “state” is what allows you to create components that are dynamic and interactive.

basic structure for the state components

example:-

import React, { Component } from 'react';
 class SecondComponent extends Component {
 constructor(props) { 
super(props);
 this.state = { 
toggle: true 
};
 this.onClick = this.onClick.bind(this);
 } 
onClick() {
 this.setState((prevState, props) => ({ 
toggle: !prevState.toggle 
})); 
} 
render() {
 return ( 
<div onClick={this.onClick}> 
Hello, {this.props.name}! I am a SecondComponent. 
<br /> 
Toggle is: {this.state.toggle}
 </div> 
); 
}
 }
Quote of quotes [#1 Scary Code]
Tags: scarycode
Published: 2019-10-31 14:32:00

---
title: Quote of quotes [#1 Scary Code]
published: true
date: 2019-10-31 05:30:37 UTC
tags: Scary Code
canonical_url: https://boobo94.xyz/scary-code/quote-of-quotes/?utm_source=rss&utm_medium=rss&utm_campaign=quote-of-quotes
---

```html
<div id="'some-name'" ></div>
```

I discovered this week the quote of quotes.. because why not?!

## About this new category – Scary code

Because I had a lot of quality content for this category I decided to start it right away on the [blog](/developer-story/copy-paste-developer/). I’ll try to publish as often as I can, depending on the materials provided by projects that I’m involved in. This series presents a funny but scary code.

The name of variables or content can be altered because of [NDA (Non-Disclosure Agreement)](https://en.wikipedia.org/wiki/Non-disclosure_agreement), but the idea will don’t be changed.

Having this mention this is #1 from a long series.

The post [Quote of quotes [#1 Scary Code]](https://boobo94.xyz/scary-code/quote-of-quotes/) appeared first on [boobo94](https://boobo94.xyz).
Install Django on Ubuntu 18.04
Published: 2019-10-31 05:30:35

Django is a free and open-source high-level Python web framework that encourages developers to develop fully-featured Python Web Applications. Using Django you can build secure, scalable and maintainable web applications. 

Django framework wrote a well structured that helps to do quickly create Python web applications. It provides higher security for the application and avoids developers for making many common security mistakes.

There are different methods to install the Django framework on Ubuntu:

1. Install Django with pip in a virtual environment
2. Django install from packages
3. Install Django from GitHub Repo

In this tutorial, we are going to install Django on Ubuntu 18.04 using Python Virtual Environment. The best thing to use Python virtual environments is to create an isolated environment for different Python projects.

Here is a step by step instructions for <a href="https://speedysense.com/how-to-install-django-on-ubutnu-18-04/">how to install Django</a> in a Python virtual environment on Ubuntu 18.04. Before we start to install Django on Ubuntu 18.04 you must have the non-root user with sudo privileges.

<b>Prerequisites</b>
First, Install tree package to better understand on our further tutorial.

sudo apt install tree

<b>Install Python 3</b>
Python 3.6 by default installed in Ubuntu 18.04. You can verify the Python 3 is installed in your system using the following command.

python3 -v
The output should look like below. Please note that the version number may vary.

Python 3.6.8

<b>Install pip3 Package</b>
Next, Install pip package from the Ubuntu repositories.

sudo apt install python3-pip

<b>Install virtualenv modules</b>


sudo pip3 install virtualenv

<b>Create and Activate Virtual Environment</b>

mkdir django_app && cd django_app
python3 -m virtualenv env_name
source env_name/bin/activate

<b>Install Django</b>
pip install Django

<b>Create First Django Project</b>
django-admin startproject firstapp


That all you need to know how to create a Python virtual environment. Furthermore, we are going through step by step Django installation in Ubuntu 18.04. Even more, we see how to migrate the database, and create a superuser for Django.
Data Scientist
Published: 2019-10-31 05:18:50

A company manager is flying across the desert in a hot air balloon when he realises he is lost. He calls down to a man riding a camel below him and asks where he is.

The man replies, “You’re 42 degrees and 12 minutes, 21.2 seconds north, 122 degrees, 10 minutes west, 212 meters above sea level, heading due east by north east.”

“Thanks,” replies the balloonist. “By the way, are you a data scientist?”

“Yes,” replies the man, “how did you know?”

“Everything you told me was totally accurate, you gave me way more information than I needed and I still have no idea what I need to do.”

“I’m sorry,” replied the camel-riding data scientist. “By the way, are you a company manager?”

“Yes,” said the balloonist, “how did you know?”

“Well,” replied the scientist, “You’ve got no idea where you are, no idea what direction you’re heading in, you got yourself into this fix by blowing a load of hot air, and now you expect me to get you out of it.”
Should I use sliding tokens or {access+refresh} tokens for JWT Authentication?
Tags: django, python, beginners
Published: 2019-10-31 05:01:30

Hi,

I am using JWT for authentication in my mobile application and I am using the django JWT package called djangorestframework-simplejwt. In that I learnt (from the documentation: https://github.com/davesque/django-rest-framework-simplejwt) about sliding tokens and {access+refresh} tokens. So using which one of these would be the best practise?
Where are all the mobile developers?
Tags: beginners, career
Published: 2019-10-31 04:19:07

Hi, I'm new, teaching myself Flutter and considering the possibility of some day making money with this. I know that Flutter, specifically, is kind of a weird choice. I thought that I would be hearing more about mobile development in general, though. When I read about career stuff, it seems like it's always front end vs. back end. Are there not a lot of jobs in mobile development? Are they extra hard to get into? Do people talk about them in different places? What should I know about this now?

Thanks for any tips!
Why I'm sort of leaving Linux
Tags: linux, wsl, windows
Published: 2019-10-31 02:19:40

I've been a pretty heavy Linux user for over 15 years now. I have all the badges, Gentoo installs, Arch install, I have compiled my own kernel, used Debian, Redhat before Fedora existed, Slackware, SUSE, all the buntus, and on and on. I've participated directly with Fedora, Ubuntu-Mate and [Archlabs Linux](https://www.archlabslinux.com).

 What I'm saying is, I've been around.And I love Linux. I enjoy installing distros. Tweaking config files is my game. And the keyboard, oh! give me some [i3 ](https://i3wm.org/) and I can kiss the mouse goodbye. I love almost everything about Linux. So why would I leave?

Well, my arch-nemesis Windows has actually gotten sort of good. It's practically a pleasure to use. And have you heard of the 'Subsystem for Linux'? Yeah, the penguin now lives under the hood on Windows 10. I can be really productive on it. But is it enough?

By themselves, these things may not make it an absolute game-changer. But there is something else that happens when I am using Windows. I accomplish my work.

Yeah, I said it. I get things done on Windows. There isn't anything for me to really tweak, no new desktop to install, I don't change icons and themes. I have no distractions on Windows. This leaves me with one main thing to do. Get to work.

I have even tried to go back to Linux in the past couple weeks. But I'm just not content there. I inevitably end up tweaking and theming until the proverbial cows come home. Let alone the thousands of free apps to try.

On Windows I have my core apps, they are all high quality, some that are available on Linux also. But some that aren't. To the surprise to some, I'm sure, everything just works for me also, same as on Linux. The only drivers I installed were unnecessary. Mainly for updating SSD firmware and getting the latest and greatest from Intel. Mind you, I had no way to update my SSD firmware on Linux, that I knew of at least.

Now, remember, I'm not bashing Linux. Not in the slightest. I am acknowledging my ability to be distracted by the shiny. Like a dog who hears the word 'squirrel', I am instantly distracted. That is of no fault to Linux. But it does make the semi rigidness of Windows work well for me now that the 'Subsystem for Linux' now exists. I live in the best of both worlds.

So maybe give ole' Windows a shot again if you find yourself with the same issues I seem to have. Or, if your a bored Windows user, looking for more action, maybe go give Linux a try. Either way lets all just be as productive as we can be.

Cheers
Tim
About my learning of GameDev
Tags: gamedev, monogame
Published: 2019-10-31 03:35:51

---
title: About my learning of GameDev
published: true
date: 2019-10-31 03:17:22 UTC
tags: GameDev, MonoGame
canonical_url: https://giovanni.codes/about-my-learning-of-gamedev/
cover_image: https://thepracticaldev.s3.amazonaws.com/i/63wjkfq93lo8k3ge126f.jpg
---

For a long time I wanted to create video games; In fact, it was thanks to RPG Maker that I start to learn programming and I liked it, and that’s why I became a software developer

After a while I finally set out to really develop a game and release something, more than anything like a hobby, since I like everything that involves the game dev and also because it is very different from traditional programming.

I have tried some engines and sometimes I don’t feel at all comfortable, since I want to learn how everything works from inside and really learn how to program a video game without the help of engines.

After thinking a little and trying some frameworks, I decided, at least for now, to focus on two topics

- MonoGame and C#
- C++ and GBA programing

The first is because I like C # and it is [one of my favorite languages](https://giovanni.codes/why-c-sharp-is-one-of-my-favorite-language/), and I also consider MonoGame an excellent and well designed framework that comes from XNA and there is a lot of documentation since then, and something very important, it is cross platform!

Programming for GBA is because it is one of my favorite consoles. For me it would be a challenge, since you have to program at a very low level because we handle the hardware directly, even if C ++ is used you have to know its architecture. It is a great way to learn how computers work!

With this in mind, I will be writing in my blog about what I am learning and also uploading games that I will create.

So if you are interested in these two topics, you can follow my journey through my blog.

 

The post [About my learning of GameDev](https://giovanni.codes/about-my-learning-of-gamedev/) appeared first on [Giovanni Codes](https://giovanni.codes).

 ![](http://feeds.feedburner.com/~r/giovannicodes/~4/Df_sLp5wZYM)
What brought me here.
Published: 2019-10-31 02:37:29

Hi,I'm new here!Basic knowledge in PHP 5 , intermediate one in CSS , beginner's level in JavaScript.
Wordpress is the reason to start studying these programming languages.
Inspired by Matt Mullenweg 2016 "State of the World" and in particular "The future of web are (JavaScript-a note by me) API driven applications"
Have been doing my best to be a power WordPress user for 2 years.
#php,#javasript,#restapi
Day 23 : The Climb
Tags: hiphop, code, coding, lifelongdev
Published: 2019-10-31 02:36:14

_liner notes_:
- Professional : Did a bunch of digging in the documentation and found a way to connect the voice API with the messaging API. This, I think, is the main differentiator from other apps I've seen built before. It was a climb to get it to piece together, but super happy to get it working. Even more, I'm learning a lot about the product itself and getting more comfortable.

- Personal : So it's my birthday. After work, my folks came over to take me out to eat. Got full, got home and took a nap. haha My Gopro Max came in and I'm been playing with some of the mounts that came with it. I want to attach it to my bag and looking for ways to accomplish that. Other than that, I looked over some more Svelte tutorials.

![Sagres, Portugal coastline aerial view](https://thepracticaldev.s3.amazonaws.com/i/pwephvzs3lav3h0ll77l.jpg)

So far, I've been working on the backend / server side of my application. Tomorrow, I'm going to put together a quick front end to display the data coming from the backend and add some more error handling. 

Have a great day!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube 8hcv3q7vNTY %}
S’occuper d’une erreur FillDataElements en Jitterbit
Tags: salesforce, etl, database, french
Published: 2019-10-31 18:17:50

---
title: S’occuper d’une erreur FillDataElements en Jitterbit
description: "Parfois, il faut tout redémarrer"
published: true
date: 2019-10-31 02:00:00 UTC
tags: salesforce,etl,database,french
canonical_url: https://katiekodes.com/jitterbit-erreur-filldataelements-date/
---

Aujourd’hui, c’est l’Halloween. Et Jitterbit m’a bien effrayé en lançant une erreur `FillDataElements` lorsque j’élaborais une [opération d’insertion Salesforce](https://success.jitterbit.com/display/DOC/Salesforce+Insert+Wizard).   
  
**Hou** là là !
  
Heureusement, j’ai découvert une bêtise _(réélaborer l’opération de zéro)_ qui m’a plu autant que des friandises.

* * *

Face à l’erreur:

> FillDataElements() failed (bad data)

Qui continue peut-être :

> This occurs when constructing source data element “…” for target node “root$transaction…

Il est possible que vous trouverez un de ces articles du site GetSatisfaction.com:

1. [FillDataElements() failed (bad data)](https://getsatisfaction.com/dataloader/topics/filldataelements_failed_bad_data)
2. [Date Period Year out of Range - Format issue?](https://getsatisfaction.com/dataloader/topics/date_period_year_out_of_range_format_issue)

Ces deux articles m’ont aidé à voir qu’il y avait peut-être quelque chose dans la configuration de mon opération qui causait du chaos en Jitterbit:

1. J’avais [déclaré un champs d’un fichier CSV](https://success.jitterbit.com/display/DOC/Defining+File+Formats#DefiningFileFormats-ConfiguringFieldsManually) « `TEST_DATE` ») d’être une date et pas une chaîne de caractères _(« string »)_.
2. Dans le fichier CSV, il y a des enregistrements où `TEST_DATE` est vide.
3. J’ai peut-être tapé une erreur en [scriptant une condition](https://success.jitterbit.com/display/DOC/Conditional+Mapping) sur `TEST_DATE` pour la « transformation ».

Après avoir tout corrigé, le bouton « test the transformation » lançait toujours l’erreur `FillDataElements`.

Enfin j’ai:

1. réélaboré le « File Format » _(avec tous les champs déclarés des chaîne de caractères)_
2. recommencé de zéro avec l’assistant “Salesforce Insert Operation”

Je ne sais pas lequel des deux a corrigé la situation, mais l’erreur a bien disparu.
Open the doors!
Tags: html, css, javascript, beginners
Published: 2019-10-31 01:51:43

Hello!
I am going to present an animation, which is one of my favourites. Let's make doors!

First, HTML is very simple. You just prepare two doors.

    <div id="ldoor" class="door" onclick="opendoor()"></div>
    <div id="rdoor" class="door" onclick="opendoor2()"></div>

The div element with id="ldoor" creates the left door and the one with id="rdoor" does the right one.

Next, you make them more "door-like." You write the common CSS styles for the "door" class.

    .door{
        background-color: cornflowerblue;
        border: solid 2px navy;
        position: fixed;
        top: 0;
        width: 0;
        height: 100%;
        overflow-x: hidden;
        cursor: pointer;
    }
    #ldoor{
        left: 0;
    }
    #rdoor{
        right: 0;
    }

The left:0 puts the left door to the leftmost and the right:0 puts the right door to the rightmost. Because width is 0, the doors are not displayed at present yet.

So, finally, you display them and open the doors! However, fortunately, the JavaScript code is also very simple.

    var ldoor = document.getElementById("ldoor");
    var rdoor = document.getElementById("rdoor");
    ldoor.style.transition = "1s";
    rdoor.style.transition = "1s";

    function load(){
        ldoor.style.width = "50%";
        rdoor.style.width = "50%";
    }

    function opendoor(){
        ldoor.style.width = "0";
        rdoor.style.width = "0";
    }

    function opendoor2(){
        ldoor.style.width = "30%";
        rdoor.style.width = "50%";
    }

Two things I have to say are here. First, the transition is the CSS style, so you can write it inside the .door in CSS instead of writing here. In that case, transition: 1s. 
Second, the load function has to be firstly called. This is done by adding onload to the body element in HTML.

    <body onload="load()">

Okiedok, now, you can see that loading the page the doors close, clicking the left door the doors open and clicking the right door the left door open some.
Very cool, so give it a shot and safe journey!
Integrate Istanbul for test coverage with Mocha
Tags: javascript, node, testing, webdev
Published: 2019-10-31 08:48:53

---
title: Integrate Istanbul for test coverage with Mocha
published: true
date: 2019-10-31 01:09:57 UTC
tags: javascript, node, testing, webdev
canonical_url: https://boobo94.xyz/tutorials/integrate-istanbul-for-test-coverage-with-mocha/?utm_source=rss&utm_medium=rss&utm_campaign=integrate-istanbul-for-test-coverage-with-mocha
---

Even if you started programming for a short period of time or you are an experienced developer, for sure you heard about automatic tests. Why are tests useful, why are they not, is a waste of time or not is not the subject of this post.

In this article, I share with you a simple configuration that can be achieved in less than 5 minutes. It will make your project rock. Having coverage of code offers you a better understanding of where the code is not good enough tested, so in that area, the code has bigger chances to crash.

[Istanbul](https://istanbul.js.org/) for test coverage is one of the best tools for Node.js. In the example below I integrated Istanbul with [Mocha](https://mochajs.org/). The configuration in package.json can be shown below.

#### package.json

```json
{
  ...
  "scripts": {
    ...
    "test": "NODE_ENV=test mocha --require @babel/register --recursive --exit",
    "coverage": "nyc npm run test"
    ...
  },
  ...
}
```

I have a script that runs tests using the Mocha framework. Because I use Babel, I need to require the plugin in the script. Line 6 is the only thing that you should add to run the coverage over your tests.

#### .nycrc.json

```json
{
  "all": true,
  "include": [
    "src"
  ],
  "requires": [
    "@babel/register"
  ],
  "exclude": [
    "src/server.js",
    "**/database/seeders"
  ]
}
```

The file .nycrc.json contains all the configurations required. If you prefer a different file you can see all [supported formats on this link](https://github.com/istanbuljs/nyc#configuration-files). It will be loaded by default once the _nyc_ command is fired in execution. The property _required_ as I described before, is used because I use Babel in my project. I wanted to include only the content of _src_ folder. I excluded some files or folders which I don’t want to be covered.

Having all these on the table now you know how to integrate Istanbul for test coverage with Mocha in your project and take advantage of the power provided by tests. If at any moment you have something unclear in your tests and you want to debug, I created an article [VSCODE DEBUGGER CONFIG WITH MOCHA AND BABEL 7](/tutorials/vscode-debugger-config-with-mocha-and-babel-7/) where I teach you how to do it. Thank you for reading this and don’t forget to leave me a comment and subscribe to my newsletter.

_The post [Integrate Istanbul for test coverage with Mocha](https://boobo94.xyz/tutorials/integrate-istanbul-for-test-coverage-with-mocha/) appeared first on [boobo94](https://boobo94.xyz). So if you want to read more articles like this please [subscribe to my newsletter](https://boobo94.xyz/#colophon) or follow me here_
Join us in the quest to train and employ tech entrepreneurs in Africa
Tags: news, career
Published: 2019-10-31 00:57:53

<b>Codewit Seeks to train, find jobs or seed funding for 50, 000 tech entrepreneurs & developers in the next 10 years. </b>

The world is going through rapid digital transformation, and Africa needs to be at the forefront of the digital revolution. Today, we prefer doing a quick google search, or Wikipedia rather than visiting the local library.  The demand for skilled people with high technology quotient is on the rise, but how can we ensure that we provide employers with ready-to-work candidates, those who are qualified to add value to organizations they have been placed? 

Research has shown that Disruptive technologies will eliminate almost 50% of jobs in the next 25 years. In today’s world, 15-year-olds will have at least five career changes in their lifetime. According to Dell, 85% of available jobs in 2030 are yet to be invented, presenting enormous opportunities for individuals to elevate, accelerate, and transform their careers.

One of the promising and innovative social enterprises looking to create new jobs, and raise new tech leaders in Africa is Codewit. Codewit is a social enterprise that trains developers and empowers them to create sustainable solutions to problems that benefit their society and country at large.

Its goal is to position the African continent as a leader in the next move of digital disruptions. We have always played catch up with the rest of the world, but it is about time we start to see homegrown solutions making tremendous strides all over the world. 

How Codewit intends to make this happen? 

-	Provide easy access for people across Africa to access quality education without having to pay with an arm and a leg. It is designed to make it possible for everyone to access world-class technology education at very little or no cost to begin. 
-	Provide leading-edge and a robust technology education in Full Stack Web Development, Data Science, Mobile Application development, and UI and UX Design courses that can compete with course content in some of the world’s finest institutions. 
-	Practical training structure. 40% of the time for training, and guided by our instructors. 60% of the time participants will be working on projects, and doing actual work. 
-	Match graduating students with partner companies looking to hire, and provide seed financing + business support for those who would rather start their own business.
-	Physical classes in Accra, Kumasi, Takoradi, and Lagos. Online classes from anywhere and at the comfort of the candidate’s home or office.

Read more about what Codewit is doing on their website at https://www.codewit.co 
The time has come for Africa to set the pace, it is possible it only we believe and take steps to bringing this to reality.