teleren/devto huggingface dataset:
Debug Challenge Week 1
Tags: debug, challenge, javascript, beginners
Published: 2019-09-16 00:16:29

It’s that time, guys!  The Debug Challenge has begun!  Keep in mind, mildly skilled devs can probably skip this as this weeks’s challenge is oriented toward beginners.  Here we go!  

# What’s wrong with this code?

Not just what’s broken; also what’s depreciated or just impolite syntax.  The language for this week is JavaScript.  

```
<script type="text/javascript">
  function displaymessage {
    var socks = "3"
    alert(join("You have this many socks, plus 6: " + socks + 6))
  }
 </script>
 <input type="button" value="Click me!" onclick="displaymessage" >
``` 
Please answer in the comments!
Meet Your New Queens
Tags: ruby, rails
Published: 2019-09-16 00:01:42

<h1><center>Rails + React + Redux - Pt 4</center></h1>
*********************************************************

This post is going to focus on some of the more challenging tasks I encountered while scraping data from Fandom then connecting the data appropriately into the schema established in the last post. In retrospect I would scrape seasons before queens, so I've accounted for the order here. This post will focus on defining the get_queens method and the get_seasons will follow. The gist is heavily commented!

*********************************************************
<h1><center> Let's get started! </center></h1>
*********************************************************

*1. Def get_seasons in season.rb to scrape the list of season names from Fandom, concatenate each season name into an array of URLS for each Season's Wikipedia page, then iterate through the array to .create!() an instance of each Season.*

<center>__see previous post for the gist__</center>

*2. Def get_queens in queen.rb to scrape the list of queens' names from Fandom, concatenate each queen's name into an array of URLs for each Queen's Fandom page, then iterate through the array to .create!() an instance of each Queen and her attributes (including associations for Quotes and Trivia.*

{% gist https://gist.github.com/JaredHarbison/81310adafa59fdbe31863edc2f098ef7 %}

*3. With Seasons and Queens instantiated, iterate through the Seasons and .create!() an appearance for each episode per Queen and her appropriate appearance attributes.*

<center>__see the next post for the gist__</center>

*********************************************************
<h1><center> That's all folks! </center></h1>
Elixir Style Conditions in Javascript
Tags: elixir, javascript
Published: 2019-09-22 01:32:36

---
title: Elixir Style Conditions in Javascript
published: true
tags: Elixir,Javascript
canonical_url: http://www.petecorey.com/blog/2019/09/16/elixir-style-conditions-in-javascript/
---

Elixir has a useful control flow structure called [`cond`](https://elixir-lang.org/getting-started/case-cond-and-if.html#cond) that lets you branch on arbitrary conditions. Unlike the more common [`switch`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch) control structure ([`case` in Elixir](https://elixir-lang.org/getting-started/case-cond-and-if.html#case)), `cond` doesn’t match against a predetermined value. Instead, it evaluates each condition, in order, looking for the first one that evaluates to a truthy value (not `nil` or `false`).

```

numbers = [1, 2, 3]
result = cond do
  4 in numbers ->
    :four
  6 == Enum.sum(numbers) ->
    :sum
  true ->
    :default
end

```

This is all probably old hat to you.

As I mentioned, `cond` can be an incredibly useful control structure, and there are times when I’ve missed it while working in languages like Javascript that only have `switch` expressions.

A traditional Javascript implementation of the above (with a little help from [Lodash](https://lodash.com/)) would look something like this:

```

let numbers = [1, 2, 3];
if (_.includes(numbers, 4)) {
  var result = "four";
} else if (6 === _.sum(numbers)) {
  var result = "sum";
} else {
  var result = "default";
}

```

However, [I recently stumbled upon a trick](https://twitter.com/swyx/status/1163225169676132353) that lets you implement a `switch` statement in Javascript that behaves very similarly to a `cond` expression in Elixir. The key is to `switch` on the value of `true`. The case expressions that evaluate to `true` will match, and their corresponding statements will be evaluated in order.

```

let numbers = [1, 2, 3];
switch (true) {
  case _.includes(numbers, 4):
    var result = "four";
    break;
  case 6 === _.sum(numbers):
    var result = "sum";
    break;
  default:
    var result = "default";
    break;
}

```

Whether or not this is any more useful or readable than a series of `if`/`else` blocks is debatable. That said, this is definitely an interesting example of perspective shifting and seeing old code in a new light. Hopefully you find it as interesting as I do.
`Display: None` vs `Visibility: Hidden`
Tags: css
Published: 2019-09-18 13:07:54

---
title: `Display: None` vs `Visibility: Hidden`
published: true
tags: css
canonical_url: https://stephencharlesweiss.com/css-display-vs-visibility/
---

When hiding elements on the client, there are multiple options. Two of the most common are through the selective toggling ofCSS properties of `display` and `visibility`.

What’s the difference? From LearnLayout.com<sup>1</sup>

> This [`display`] is different from `visibility`. Setting `display` to `none` will render the page as though the element does not exist. `visibility: hidden;` will hide the element, but the element will still take up the space it would if it was fully visible.

As a result, if the element is positioned absolutely, the “space” consumed when displayed will not affect anything.

To ensure that the layout doesn’t shift, however, it makes sense to use the `visibility` property.

Options for `display`<sup>2</sup>:

- `block`
- `inline`
- `flex`
- `none`
- … and many more. See MDN has an exhaustive list: 

Options fo `visibility`<sup>2</sup>:

- `visible`
- `hidden`
- `collapse`

## <svg aria-hidden="true" focusable="false" height="16" version="1.1" viewbox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>Resources

- <sup>1</sup> [CSS - the “display” property | LearnLayout](http://learnlayout.com/display.html)
- <sup>2</sup> [display | MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/display)
- <sup>3</sup> [visibility | MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/visibility)
Error handling while using native fetch API in JavaScript
Tags: javascript, showdev, webdev, tutorial
Published: 2019-09-26 15:30:28

---
title: Error handling while using native fetch API in JavaScript
published: true
tags: ['javascript', 'showdev', 'webdev', 'tutorial']
description: We will see, how to handle fetch API errors using promises and async await syntax in JavaScript
canonical_url: https://learnwithparam.com/blog/how-to-handle-fetch-errors/
---

Fetch API is very powerful. We can easily send Ajax request using browser fetch API. But it has its own disadvantages too.

One major disadvantage is error handling when using fetch.

Example,

```js
fetch(url).then((response) => {
  // Always gets a response, unless there is network error
  // It never throws an error for 4xx or 5xx response 😟
}).catch(error) => {
  // Only network error comes here
};
```

- It always gets a response, unless there is a network error
- All 4xx, 5xx don’t get into catch block

### Error handling in fetch API using promises

First lets see, without handling errors,

```js
fetch(url)
  .then(response => {
    return response.json();
  })
  .then(jsonResponse => {
    // do whatever you want with the JSON response
  });
```

- this is bad, because even if the url sends a 404, we send that as response without breaking it.

We can rectify it by throwing error and allow only response which has status code between 200 and 299.

```js
fetch(url)
  .then((response) => {
    if (response.status >= 200 && response.status <= 299) {
      return response.json();
    } else {
      throw Error(response.statusText);
    }
  })
  .then((jsonResponse) => {
    // do whatever you want with the JSON response
  }).catch(error) => {
    // Handle the error
    console.log(error);
  };
```

This will fix the problem, you can even extract out the checking status part as a function which returns a promise or throw error.

```js
function CheckError(response) {
  if (response.status >= 200 && response.status <= 299) {
    return response.json();
  } else {
    throw Error(response.statusText);
  }
}

// Now call the function inside fetch promise resolver
fetch(url)
  .then(CheckError)
  .then((jsonResponse) => {
  }).catch(error) => {
  };
```

### How to handle fetch errors using async-await syntax

It is same as promises, only the syntax will change. First we will see without error handling,

```js
const response = await fetch(url);
const jsonResponse = await response.json();
console.log(jsonResponse);
```

example with error handling,

```js
const response = await fetch(url);
if (response.status >= 200 && response.status <= 299) {
  const jsonResponse = await response.json();
  console.log(jsonResponse);
} else {
  // Handle errors
  console.log(response.status, response.statusText);
}
```

Hope you learnt some tricks in using fetch API, stay tuned for more JavaScript tricks 😇
Loops in Dart
Tags: dart, todayilearned, code, beginners
Published: 2019-09-15 22:55:28

There are many situations occur while coding, when we want to repeat a certain block of code for a number of times. Now there are two ways to do the job.

1. Write that block of the code number of times.
2. Use Loops.

Now in the first case, the problem is your code will become too lengthy and boilerplate. And also after a certain time, it will become too hard to maintain that code. And as there is a general rule in programming that ***“never repeat your code”***.

So to rescue you in that situation loops come into the picture. To repeat some statements number of times we use loops.

The statements inside the body of the loop will keep repeating until the condition becomes false.

The repetition of a loop is called Iteration in programming.

* There are two types of loops are there in programming:

1. Definite
2. Indefinite

**Definite Loop -**  The Loop whose number of iterations is fixed, where you know the exact number of iterations before entering the in the loop, then it is called a definite loop. for ex- for loop

* [For Loop](https://dev.to/jay_tillu/while-loop-in-dart-21og)

**Indefinite Loop -** The Loop whose number of iterations is not fixed, where you don’t know the exact number of iterations before runtime, then it is called indefinite loop. Ex — while loop & do-while loop

* [While Loop](https://dev.to/jay_tillu/while-loop-in-dart-21og)
* [Do While Loop](https://dev.to/jay_tillu/do-while-loop-in-dart-33ee)

That’s it for loops guys. Again it’s a first introductory article on loops. We will discuss all three loops in upcoming articles.

As usual, if I miss something please feel free to let me know. Till Then Keep Loving Keep Coding. I’ll surely catch you up in the next article.

Jai Hind, Vande Mataram 🇮🇳

Wanna get in touch with me? Here are links. I’ll love to become your friend. 😊

- [My Site] (https://www.jaytillu.in)
- [My Blogs] (https://blogs.jaytillu.in)
- [Twitter](https://twitter.com/jay_tillu)
- [Facebook](https://www.facebook.com/jaytillu.1314/)
- [Instagram](https://www.facebook.com/jaytillu.1314/)
- [Medium](https://medium.com/jay-tillu)
- [LinkedIn](https://www.linkedin.com/in/jaytillu/)
- [Github](https://www.github.com/jay-tillu)
- [Stack overflow](https://stackoverflow.com/users/8509590/jay-tillu)
or just mail me at jd.tillu@gmail.com
For Loop in Dart
Tags: dart, todayilearned, beginners, code
Published: 2019-09-15 22:54:11

* ***for loop*** is a type of definite loop (it can also iterate for infinite times, but in practical cases, we use it when the number of iterations is known).
    
* The ***for loop*** executes a block of code for a specified number of times.

The ***for loop*** is commonly used when the number of iterations is known.

###Syntax
***

```dart
for (initialization; condition; step) {
  // Statements
}
```

###Sample Code
***

```dart
void main() {
  for (int i = 0; i < 3; i++) {
    print(i);
  }
}

Output
0
1
2
```

##How for Loop works

* The ***initialization*** step is executed first and only once. This step allows us to declare and initialize any loop control.

* In the next step, the ***condition*** is evaluated. If the condition is true then the body of for loop executes. If it is false then the flow of control jumps back to the next statement after for loop.

* After the body of for loop executes, the flow of control jumps back to ***step***, where the increment or decrement occurs. This statement allows us to update any loop control variables.

* Then again condition is evaluated. If it is true then the whole process repeats again and again, until the condition becomes false.
    
* Once the condition becomes false, the for loop is terminated and the flow of program goes to the next statement after the for a loop.

So, Guys, That’s it for the *for loop*. I hope you understand how for loop is structured and works in a dart. In other languages, just syntax changes but the core concept and working of loops will remain the same for any language. So Please spend some time with loops and understand how it works.

Till then Keep Loving, Keep Coding. And I’ll surely catch you up in next article.

Remember no teacher, no book, no video tutorial, or no blog can teach you everything. As one said Learning is Journey and Journey never ends. Just collect some data from here and there, read it, learn it, practice it, and try to apply it. Don’t feel hesitate that you can’t do that or you don’t know this concept or that concept. Remember every programmer was passed from the path on which you are walking right now. Remember Every Master was Once a Beginner. Work hard and Give your best.

###For More Information Please Visit Following Links
* [Fuchsia OS official site](https://fuchsia.dev/)
* [Dart official site](https://dart.dev/)
* [Flutter official site](https://flutter.dev/)

Jai Hind, Vande Mataram 🇮🇳

Wanna get in touch with me? Here are links. I’ll love to become your friend. 😊

- [My Site] (https://www.jaytillu.in)
- [My Blogs] (https://blogs.jaytillu.in)
- [Twitter](https://twitter.com/jay_tillu)
- [Facebook](https://www.facebook.com/jaytillu.1314/)
- [Instagram](https://www.facebook.com/jaytillu.1314/)
- [Medium](https://medium.com/jay-tillu)
- [LinkedIn](https://www.linkedin.com/in/jaytillu/)
- [Github](https://www.github.com/jay-tillu)
- [Stack overflow](https://stackoverflow.com/users/8509590/jay-tillu)
or just mail me at jd.tillu@gmail.com
Do-While Loop in Dart
Tags: dart, todayilearned, beginners, code
Published: 2019-09-15 22:53:42

* A **do-while loop** is a type of indefinite loop.

* **do-while loop** first executes the statements and then check for the condition. If the condition is true it will keep executing and if the condition is false loop will terminate.

* So whether the condition is true or false, do while loop’s statements will execute at least once.

###Syntax
***

```dart
do {
  Statement(s) to be executed;  
} while (expression);
```

* Here also take a look that in **for loop** or **while loop** we don’t use semicolon at the end of the loop. But in do while loop semicolon is mandatory after the while statement.
    
* Incrementer or decrementer must be placed inside the do’s block, it cannot be placed outside the **do’s block**.

###Program
***

```dart
main() {
  int number = 0;
  do {
    if (number % 2 == 0) {
      print(number);
    }
      number++;
  } while (number < 10);
}

Output
0
2
4
6
8
```

That’s it for do-while loop guys. Feel free to share with me if I miss something I will love to learn it from you.

Remember no teacher, no book, no video tutorial, or no blog can teach you everything. As one said Learning is Journey and Journey never ends. Just collect some data from here and there, read it, learn it, practice it, and try to apply it. Don’t feel hesitate that you can’t do that or you don’t know this concept or that concept. Remember every programmer was passed from the path on which you are walking right now. Remember Every Master was Once a Beginner. Work hard and Give your best.

Till Then Keep Loving, Keep Coding. And just like always I’ll surely catch you up in the next article.

###For More Information Please Visit Following Links
* [Fuchsia OS official site](https://fuchsia.dev/)
* [Dart official site](https://dart.dev/)
* [Flutter official site](https://flutter.dev/)


Jai Hind, Vande Mataram 🇮🇳

Wanna get in touch with me? Here are links. I’ll love to become your friend. 😊

- [My Site] (https://www.jaytillu.in)
- [My Blogs] (https://blogs.jaytillu.in)
- [Twitter](https://twitter.com/jay_tillu)
- [Facebook](https://www.facebook.com/jaytillu.1314/)
- [Instagram](https://www.facebook.com/jaytillu.1314/)
- [Medium](https://medium.com/jay-tillu)
- [LinkedIn](https://www.linkedin.com/in/jaytillu/)
- [Github](https://www.github.com/jay-tillu)
- [Stack overflow](https://stackoverflow.com/users/8509590/jay-tillu)
or just mail me at jd.tillu@gmail.com
My key learnings running multiple startups and growing businesses
Tags: startup, career, sideprojects
Published: 2019-09-15 22:35:06

Hey,

George here founder of www.loopcv.pro 

We are building the first job search automation platform!

I wanted to share some key learning from my experience building Loopcv.

1) Team is number #1 . Great businesses are a result of great teams.

2) Prioritising tasks is more important than you think(what to build next, where to focus, what to do every day is critical)

3) Getting advice from mentors on the way, reshaping the idea and re-thinking of everything is a must


What are your key learnings from startups and side projects?
Feel free to share!
What are your favourite meetups?
Tags: discuss, meetups
Published: 2019-09-15 22:32:56

What are your favourite meetups and what makes you enjoy them?

I enjoy [Junior Dev](https://juniordev.io/) because I get to see all the cool things people have been learning about and building. I want to get a Junior Dev meetup set up in Sydney now that I'm living there.

[Perth Fenders](https://twitter.com/fendersperth) is also great. While I'm not a professional front end developer, I love playing around with HTML, JS and CSS at home on my own projects. The amount of work they put in to making sites accessible, fast and work across browsers and devices is amazing.

And [Identity And Security Meetup Sydney](https://twitter.com/ISM_Sydney) is one that I will always remember as it is the first meetup that I gave a presentation at, and now I want to give more.

I'm also keen to get along to the [Sydney Technology Leaders](https://www.meetup.com/Syd-Technology-Leaders/) meetup and the Microsoft Reactor Lunch And Learns to catch up with friends, learn and network.


Oh, and I'm not big on food/drinks at meetups. I normally grab a snack before I go and dinner on the way home.
How to automate your job search and find a job 3x fast (Yes it is true)
Tags: career, beginners
Published: 2019-09-15 22:28:27

Hey!

George here!

I wanted to introduce our startup Loopcv which automates the job search and job application process!

Steps:
1) You upload your cv
2) You set your job search criteria
3) We Loop daily to find you new matches
4) Once we find a new match, we send an email directly to the company!
5) You get emails and interviews automatically

Check it here: www.loopcv.pro

Feel free to send your feedback!
Conditionals in Dart
Tags: dart, todayilearned, code, beginners
Published: 2019-09-15 22:18:05

* There are various situations comes in programming when you have to check the condition before code executes.
    
* There are many ways to check the condition and execute the code. It’s totally depends on us to choose the which way in which condition.

* There are total five ways in dart to check the conditions:

1. [if statement](https://dev.to/jay_tillu/if-statement-in-dart-2k91)
2. [if-else statement](https://dev.to/jay_tillu/if-else-statement-in-dart-5396)
3. Nested If statement
4. [else if statement](https://dev.to/jay_tillu/else-if-ladder-statement-in-dart-15dl)
5. [switch case](https://dev.to/jay_tillu/switch-case-in-dart-1p7c)

In this article I just share basic idea of conditionals in dart. For detailed article on each topic please check it on dart section or click on the following link.

Feel free to share me if I miss something. I’ll love to learn it from you guys. Till then Keep Coding, Keep Loving.

Remember no teacher, no book, no video tutorial, or no blog can teach you everything. As one said Learning is Journey and Journey never ends. Just collect some data from here and there, read it, learn it, practice it, and try to apply it. Don’t feel hesitate that you can’t do that or you don’t know this concept or that concept. Remember every programmer was passed from the path on which you are walking right now. Remember Every Master was Once a Beginner. Work hard and Give your best.

###For More Information Please Visit Following Links
* [Fuchsia OS official site](https://fuchsia.dev/)
* [Dart official site](https://dart.dev/)
* [Flutter official site](https://flutter.dev/)


Jai Hind, Vande Mataram 🇮🇳

Wanna get in touch with me? Here are links. I’ll love to become your friend. 😊

- [My Site] (https://www.jaytillu.in)
- [My Blogs] (https://blogs.jaytillu.in)
- [Twitter](https://twitter.com/jay_tillu)
- [Facebook](https://www.facebook.com/jaytillu.1314/)
- [Instagram](https://www.facebook.com/jaytillu.1314/)
- [Medium](https://medium.com/jay-tillu)
- [LinkedIn](https://www.linkedin.com/in/jaytillu/)
- [Github](https://www.github.com/jay-tillu)
- [Stack overflow](https://stackoverflow.com/users/8509590/jay-tillu)
or just mail me at jd.tillu@gmail.com