teleren/devto huggingface dataset:
Sorting objects with undefined values
Tags: javascript, weird
Published: 2020-03-12 14:46:05

So take a look at this:

```
const a = { id: 'a', timestamp: 1570790874500 }
const b = { id: 'b' }
```

You may have some data like this at some point, and you might try a comparison thinking that a defined value will always be higher and truthier than an undefined one.


You might try and sort them, expecting the undefined timestamps to fall to the bottom. But they won't.

```
> const c = [b, a]
> c.sort((i, j) => i.timestamp > j.timestamp)

(2) [{…}, {…}]
  0: {id: "b"}
  1: {id: "a", timestamp: 1570790874500}
```

Let's take a look at some comparisons which don't really help us.

```
> undefined > 1570790874500

false

> 1570790874500 > undefined

false
```

The best thing to do in this situation is to check the existence of the timestamp field within the sort predicate and only compare the values when the field exists. Depending on whether you want the objects with the undefined field first or last, you change which object you check for timestamp and return true when they are undefined.

Let's create some data.

```
> const list = [
    { id: 'a', timestamp: 1535090874500 },
    { id: 'b' },
    { id: 'c' },
    { id: 'd', timestamp: 1570790874500 },
    { id: 'e', timestamp: 1510790874500 }
  ]
```

So for undefined last, you check the first object passed in.

```
> list.sort((a, b) => !!a.timestamp ? a.timestamp > b.timestamp : true)

[ { id: 'e', timestamp: 1510790874500 },
  { id: 'a', timestamp: 1535090874500 },
  { id: 'd', timestamp: 1570790874500 },
  { id: 'c' },
  { id: 'b' } ]
```

And for undefined first, you check the second object passed in.

```
> list.sort((a, b) => !!b.timestamp ? a.timestamp > b.timestamp : true)

[ { id: 'b' },
  { id: 'c' },
  { id: 'e', timestamp: 1510790874500 },
  { id: 'a', timestamp: 1535090874500 },
  { id: 'd', timestamp: 1570790874500 } ]
```

And of course, the comparison here, `a.timestamp > b.timestamp` defines the sort order of the objects where the field _is_ present.
2048 Game 🕹 using Flutter - Animations added
Tags: dart
Published: 2020-03-12 14:29:07

I am building classical 2048 game using Flutter and here is the link to [previous post](https://dev.to/arnavpuri/2048-game-using-flutter-work-in-progress-1bal)

[Repository Link](https://github.com/ArnavPuri/game_2048_flutter)

In this post, I want to share that I have added slide animations. It wasn't very easy to do so. 

The single-cell is a stateful widget and it always stores old value. So old value slides out and new value slides in.


I am using a single animation controller which is being used by all the cells (16 total).

Every time there is a swipe I make the controller go forward.

Also for keeping track of swipe direction, I am using enums which makes it easier and faster to manage.

It can still be refactored a lot. 

Next up is undo feature and show the 'game over' or 'you win' dialog
A brief history of JavaScript
Published: 2020-03-12 14:12:32

Creator of JavaScript  Brendan Eich developed JavaScript in 1995 in just 10 days, originally named Mocha, then LiveScript and later JavaScript.


Java was very popular at that time, so it was decided that positioning a new language as a “younger brother” of Java would help.

Running Java programs, the code must be first compiled into an executable form. But  JavaScript was created to be interpreted at run time, making it much more dynamic.

JavaScript became a fully independent language with its own specification called  ECMAScript, a body founded with the goal of standardizing computing and now it has no relation to Java at all.

Lightweight means that the language does not take too much memory of the computer and it has a relatively simple syntax. It can be used cross-platforms which means it executes not only the browser but also on servers.

Browsers have embedded engine sometimes called “JavaScript virtual machine”, how an engine works:
- it reads(parses) the script
- then converts(compile)the script to the machine language
- and then machine code runs, fast!


JavaScript made modern web development possible, used to create and control dynamic website content, i.e. anything that moves, refreshes, or otherwise changes on your screen without requiring you to manually reload a web page.

*Trio fantastico* HTML, CSS  and JavaScript form the backbone of web development.

- HTML is responsible for content 
- CSS for representation styling and laying out  elements on the web page
- JS allows you to add dynamic on the web page.

How does JavaScript work?
There are two ways how we can add JavaScript to our website.
The first one is adding an online script tag into our HTML file.
```
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>JavaScript Blog</title>
  </head>

  <body>
    <h1>JavaScript</h1>
  </body>

  <script>console.log("Hello World!")</script>

</html>
```
Open up index.html and inspect/console
You should see “Hello world!” printed out.

The second one is adding an external JS file, in this case, I made a new external file script.js. and added to index.html
```
<script src="/script.js"></script>
```

Brendan Eich’s 10-day coding spree is the most important sprint in the history of computing.
Today JavaScript has become one of the most used programming languages.
Absinthe Journey with Wolfiton or How to Bring the Absinthe Tutorial UP to Date- Part 6 Can you fly?
Tags: beginners, elixir, graphql, absinthe
Published: 2020-03-12 14:08:13

Hi everyone,

**Series navigation**
[PART 1 Introduction](https://dev.to/wolfiton/absinthe-journey-with-wolfiton-or-how-to-bring-the-absinthe-tutorial-up-to-date-part-1-introduction-5fgg)
[PART 2 Foundation](https://dev.to/wolfiton/absinthe-journey-with-wolfiton-or-how-to-bring-the-absinthe-tutorial-up-to-date-part-2-foundation-3jnh)
[PART 3 The Walls](https://dev.to/wolfiton/absinthe-journey-with-wolfiton-or-how-to-bring-the-absinthe-tutorial-up-to-date-part-3-the-walls-n86/)
[PART 4 The Door](https://dev.to/wolfiton/absinthe-journey-with-wolfiton-or-how-to-bring-the-absinthe-tutorial-up-to-date-part-4-the-door-10m0)
[PART 5 Testing](https://dev.to/wolfiton/testing-1ohn)
[PART 6 Can you fly?](https://dev.to/wolfiton/absinthe-journey-with-wolfiton-or-how-to-bring-the-absinthe-tutorial-up-to-date-part-6-can-you-fly-3al5)
[PART 7 The User](https://dev.to/wolfiton/absinthe-journey-with-wolfiton-or-how-to-bring-the-absinthe-tutorial-up-to-date-part-7-the-user-58)

Welcome to part 6 of the series but before we jump in let's recap what we did in the fifth part:

    - we created a test

    - conn

    - pattern matching

Today I am wondering if you can create on your own **Dear reader**:

- an Account context
- A user schema
- a users migration with the following fields: username, password

Extra create a user object and a query.

If not will come on Monday with this part.

I hope you can Dear Reader, try this homework and see how much you understood from this series.
day 3/100 => 100daysofcode Flutter
Tags: 100daysofcode, flutter
Published: 2020-03-12 14:01:40

Goal: Complete flutter-dart-to-build-ios-android-apps from Udemy

Today's Progress: Belajar tentang adaptive dan responsive layout, use mediaquery of context, appBar bisa dibuat sebagai variabel (objek) yang didalamnya ada prefred size, termasuk tinggi dariappBar itu sendiri, padding, statusbar,


https://twitter.com/triyono__
https://github.com/triyono777/100-days-of-code/blob/master/log.md
Decode pointer arithmetic 
Tags: cpp, pointer, arithmetic
Published: 2020-03-12 13:39:50

This is a very short article about quick pointer arithmetic decoding. The basic pointer arithmetic is very easy to handle, and most of us are familiar with them. Array arithmetic is a bit tricky, but using following formula in your mind, can be easily interpreted.  


in C/C++ handle pointer with an array as follows

int a[5] = {1,2,3,4,5}

int *p = a 

print a        // address of a, in this case, &a[0]
print a+1      // address of a[1]   -> &a[1] 

print *a       //   dereference array a[0]
print *(a+1)    // dereference array a[1]

print p         //  address of &a[0]
print p+1       //  address of &a[1] 
print *(p+1)     // dereference array a[1]


Look at the following example 
```c++
int(*a)[5]; 
  
int b[5] = { 1, 2, 3, 4, 5 }; 
int i = 0; 
// Points to the whole array b 
a = &b; 
```

If we print the value of   *(*a+1)?  Can you guess?

Now the question of, do we have any fundamental formula to apply all the cases, **yes !!**, we do have. 

*(A+1)  = A[i]
A+1     = &A[i]

Now, let's decode the above expression, **(*a+1) -> *( *(a+0) +1)  -> *(A[0] +1) ->  **(A[1])



int B[2][3]

print B       = &B[0]        Using above formula, B+0 -> &B[0]
print *B      =  B[0]  or &B[0][0]  *B -> *(B+0) ->   B[0]
print B+1     = &B[1]        (B+1)  -> &B[1]
print *(B+1)  = B[1] & &B[1][0]   *(B+1)  -> B[1]

print *(B+1)+2     B[1]+2 &B[1][2]  *(B+1)+2  ->B[1]+2 -> &B[1][2]
print *(*B+1)     = = *(&B[0][1])    *(*(B+0)+1) -> *(B[0] +1) ->*(&B[0][1]) -> B[0][1]


Likewise, all the complex pointer arithmetics are easily solvable, There are many use cases for this variation, developers should remember this variation as functions are accepting all this variation to access. It will help to read complex source codes.
How I Developed the Nintendo Switch Game Store UI using CSS Grid
Tags: codepen, css, react, webdev
Published: 2020-03-12 13:29:35

I am taking courses about CSS Grid via Kevin Powell Web Responsive Design Bootcamp at Scrimba.com.

After several lessons, I thought of maybe I can re-create some real websites that I have been visiting using what I have learned.

It just happened that I bought a Nintendo Switch and came across this Game Store UI and I think I could try to develop this using the CSS Grid I have just learned.

This UI is developed using technologies
- HTML
- SCSS (Inheritance, Nesting)
- CSS Grid (Mainly Grid Area)
- React

Feel free to give feedback.

Thanks for reading.

{% codepen https://codepen.io/teklooncheah/pen/BaNweRR %}
Add disqus comments and search functionality to your ghost blog
Tags: ghost
Published: 2020-03-16 13:08:26

---
title: Add disqus comments and search functionality to your ghost blog
published: true
date: 2020-03-12 13:28:20 UTC
tags: Ghost
canonical_url: https://blog.shuaib.org/add-disqus-comments-and-search-functionality-to-your-ghost-blog/
---

 ![Add disqus comments and search functionality to your ghost blog](https://images.unsplash.com/photo-1461969539980-32974612df40?ixlib=rb-1.2.1&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=2000&fit=max&ixid=eyJhcHBfaWQiOjExNzczfQ)

I have been meaning to add commenting functionality to [this blog](https://blog.shuaib.org/) for a while because I am really interested in hearing feedback from readers on what they like and what can be improved. Adding disqus commenting facility to my site had been on the to do list for a while and I finally tackled it today. It was much quicker and easier to setup than I had expected and primarily just required setting up some configuration options. I have also changed the theme for the site to [Attila](https://github.com/zutrinken/attila) which I came across reading another blog last night. The theme itself introduced me to the client-side search functionality via [ghostHunter](https://github.com/jamalneufeld/ghostHunter).

Detailed and clear setup instructions are provided in the links above so I'm not going to repeat them here but I will lay down high level steps that you will be able to follow:

1. Setup a [disqus](https://disqus.com/) account and make note of your _disqus short name_ that we will require for configuration.
2. Via the ghost integrations > custom intergrations, create a new custom integration called _ghostHunter_ and copy the _Content API Key_
3. Clone the attila theme repository for GitHub from command line and cd into the directory /assets
4. Clone the ghostHunter repository as mentioned in the setup on the ghostHunter GitHub readme page.
5. Zip the resulting attila theme folder and upload it via Ghost Admin web interface under the Design section. Activate the theme.
6. Go to the Code integrations page an copy and paste the `script` tags mentioned in the attila GitHub repository readme in the Ghost Blog Header section. Add the _disqus short name_ and _Content API Key_ from earlier steps as relevant. Save changes.
7. Go to your blog home page. You will notice the search icon on the top right. Play with the search functionality to make sure it works. Navigate to one of the pages and go to the bottom of the page and verify that you have disqus section visible. Click the 'Show Comments' button to see that comment input form appears.

That's it. Everything should be working correctly. The whole setup will take 15 to 30 mins. I setup all this and wrote this blog post within my 1 hour train ride.
How to add or renew an Apple Push Notification Certificate
Tags: ios, xcode, apps, apple
Published: 2020-03-12 13:25:08

Apple Certificates are a **necessary evil**, we know that. Although Apple has simplified the process of dealing with them over the years, it's still a bit of a pain. And, since it's something we do from year to year when they expire and not on a daily basis, it's something really easy to forget. 

I've written this guide for myself and [**The Agile Monkeys** 🐒 ](https://theagilemonkeys.com) but I'm sure you will benefit from it, too!

You will probably need a *.p12* file to configure your Push Notification Server or third-party service. Let's see how to do it:

1. Go to [https://developer.apple.com/](https://developer.apple.com/)￼, under Certificates, add a new one selecting a new service certificate of type *Apple Push Notification service SSL (Sandbox & Production)*:

![New Certificate](https://dev-to-uploads.s3.amazonaws.com/i/0x3x8lzihzfjs3ye79pw.png)

2. Continue and select the *Bundle Identifier* of your app or the identifier of the Push Extension of your app in case you have it:

![Bundle Identifier](https://dev-to-uploads.s3.amazonaws.com/i/ruwsgxxaq1eg2e9wuqfb.png)

3. Next, you need a *Certificate Signing Request*. You can get it from your Keychain Access app following [these steps](https://help.apple.com/developer-account/#/devbfa00fef7).

4. Upload the **Certificate Signing Request** you just saved to your disk:

![Certificate Signing Request](https://dev-to-uploads.s3.amazonaws.com/i/49zmpunivj2m4nfetlrl.png)

5. Continue and download the Apple Certificate.

6. Double click on it to install it in your *Keychain Access*. You will see it with a little arrow at the left side (this will contain the private key): 

![Certificate](https://dev-to-uploads.s3.amazonaws.com/i/pqb4qii01qld9ozzdmsd.png)


7. Select it in your Keychain Access app, right-click on it and *Export*. A prompt will appear. Select *.p12* as the format if that wasn't selected by default already.

8. *Et voilá!* Upload that file to your server or third-party service.
Daily Developer Jokes - Thursday, Mar 12, 2020
Tags: jokes, dailydeveloperjokes
Published: 2020-03-12 13:00:26

---
title: "Daily Developer Jokes - Thursday, Mar 12, 2020"
description: "Check out today's daily developer joke! (a project by Fred Adams at xtrp.io)"
series: "Daily Developer Jokes"
cover_image: "https://private.xtrp.io/projects/DailyDeveloperJokes/thumbnail_generator/?date=Thursday%2C%20Mar%2012%2C%202020"
published: true
tags: #jokes, #dailydeveloperjokes
---

Generated by Daily Developer Jokes, a project by [Fred Adams](https://xtrp.io/) ([@xtrp](https://dev.to/xtrp) on DEV)

___Read about Daily Developer Jokes on [this blog post](https://xtrp.io/blog/2020/01/12/daily-jokes-bot-release/), and check out the [Daily Developer Jokes Website](https://dailydeveloperjokes.github.io/).___
### Today's Joke is...
![Joke Image](https://private.xtrp.io/projects/DailyDeveloperJokes/public_image_server/images/5e1259a37a785.png)

---
*Have a joke idea for a future post? Email ___[xtrp@xtrp.io](mailto:xtrp@xtrp.io)___ with your suggestions!*

*This joke comes from [Dad-Jokes GitHub Repo by Wes Bos](https://github.com/wesbos/dad-jokes) (thank you!), whose owner has given me permission to use this joke with credit.*

<!-- 
Joke text:
A new database query walks into a bar.

The server says "Sorry, cache only."
 -->
repeat() - JavaScript
Tags: firstpost, webdev, javascript, repeat
Published: 2020-03-12 12:46:41

The repeat() is called on a string which takes one argument (number of times the string needs to be repeated) and returns a new string , containing the repetitions of the string on which it was called (argument times), concatenated together.

Note - The argument passed must be non-negative and the new string formed must not overflow the maximum string size.

<pre><b>'#'.repeat(3)</b> <i>returns</i> <b>'###'</b></pre>
Are you less likely to open a post from an organisation?
Tags: question, help, dev
Published: 2020-03-12 12:34:57

I've noticed that the posts I make under a Dev organisation usually get lesser views and (consequently) lesser reactions from users here.

I'm not sure if it's the content, but I think I need to test this hypothesis. 

Are you less inclined to open a post of you see an organisation's logo on it in the feed?
Run Cypress automation test with chrome-based browser - Cypress part 2
Tags: cypress, automationtest, chromebasedbrowser
Published: 2020-03-12 12:07:33

---
title: Run Cypress automation test with chrome-based browser - Cypress part 2
published: true
description: 
tags: #cypress #automationtest #chrome-based browser
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/0ptclhp107b4rhegz8y5.png
---


Dear guys and gals, I'm back with another tutorial for cypress.
You can checkout my previous post about cypress from [cypress part 1](https://dev.to/cuongld2/get-started-automation-test-with-robotframework-part-1-ui-test-36l7)

We already know how to do cypress automation test with Chrome, but there are also other browsers, such as browser developed based in chromium.

So how do we do the test with such?

It took me quite a while to investigate how to do that.

You can checkout in details from [this page](https://docs.cypress.io/guides/references/troubleshooting.html#Support-channels)

But in short, you need to do the below things.

1.Put your chrome-based browser into the specific folder (if you're in window)

The folder for cypress can recognize for chromium-based browser will be in : C:\Program Files (x86)\Google\chrome-win32

In that folder, you need to have a chrome.exe file (the executable file of your chromium based browser)

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/gfqaunmiuzwcytkv30rk.PNG)

2.Open cypress from command line:

cypress open --browser chromium

And run your test with chrome-based browser

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/4i96t8q8twanh8vmjnlw.PNG)

That's it.

Happy coding~~
How neuroscience inspires AI: Design AI systems that emulate human intelligence
Tags: machinelearning
Published: 2020-03-12 11:07:55

Recent artificial intelligence advancements are taking the media by storm. They can perform impressive feats such as:

-   [object recognition](https://www.vox.com/future-perfect/2020/2/14/21063487/self-driving-cars-autonomous-vehicles-waymo-cruise-uber) that [enables self-driving cars](http://news.mit.edu/2019/human-reasoning-ai-driverless-car-navigation-0523)
-   [playing video games](https://www.theverge.com/2019/1/24/18196135/google-deepmind-ai-starcraft-2-victory) that [outperform world best players](https://www.nature.com/articles/d41586-019-03298-6)
-   [detecting breast cancer](https://www.theverge.com/2020/1/1/21045635/google-ai-detect-breast-cancer-mammograms-healthcare) [faster and more accurate than doctors](https://www.nature.com/articles/s41586-019-1799-6)

These machines can perform tasks and solve problems better than us, but they are only designed to excel in the intended functions. However impressive these may seem to be, we are still decades away from building artificial human intelligence.

Building machines that have truly human-like learning and cognitive that can learn and think as we do has been an ongoing pursuit. What does it mean for a [machine to learn or think like a person](https://arxiv.org/pdf/1604.00289.pdf)?

-   able to explain and understand problems
-   learning-to-learn to acquire knowledge
-   generalise knowledge to new tasks and situations

Our understanding of our brain has allowed us to design models which emulating the brain. In a [study by KAIST](https://www.sciencedaily.com/releases/2020/01/200130104921.htm), they developed a computational and neural mechanism for human meta reinforcement learning.

As humans, we can adapt to complexity and uncertainty when learning and making decisions. They aim to build models that can make decisions like humans and solves problems in the same way that humans do.

Their discoveries have opened up the possibility that might lead to machines that can take on more human-like intelligence.

![](http://jinglescode.github.io/assets/img/posts/fascinating-relationship-between-ai-neuroscience-02.webp)

Photo by [Toa Heftiba](https://unsplash.com/@heftiba) on [Unsplash](https://unsplash.com)

> Even with our eyes covered, one may still play the guitar well. But for an artificial intelligence system to play the guitar in a new environment (i.e. with eyes covered), it might not do as well.