teleren/devto huggingface dataset:
Optional Chaining
Tags: javascript
Published: 2020-02-25 18:41:52

An optional chain is a chain of one or more property accesses and function calls, the first of which begins with the token `?.`.

Long chains of property accesses in JavaScript can be error-prone, as any of them might evaluate to `null` or `undefined` (also known as “nullish” values).

Checking for property existence on each step easily turns into a deeply-nested structure of if-statements.

```js
// Error prone-version, could throw.
const nameLength = db.user.name.length;

// Less error-prone, but harder to read.
let nameLength;
if (db && db.user && db.user.name) {
  nameLength = db.user.name.length;
}
```

Using the new optional chaining operator, we can rewrite the above example as follows:

```js
// Still checks for errors and is much more readable.
const nameLength = db?.user?.name?.length;
```

The `?.` operator functions similarly to the `.` chaining operator, except that instead of causing an error if a reference is nullish (`null` or `undefined`), the expression short-circuits with a return value of `undefined`.

When used with function calls, it returns `undefined` if the given function does not exist.

```js
let result = someInterface.customMethod?.();
```

> Note: If there is a property with such a name and which is not a function, using `?.` will still raise a `TypeError` exception (`x.y` is not a function).

## Optional callbacks or event handlers

```js
// Written as of ES2019
function doSomething(onContent, onError) {
  try {
    // ... do something with the data
  } catch (err) {
    if (onError) {
      // Testing if onError really exists
      onError(err.message);
    }
  }
}
```

```js
// Using optional chaining with function calls
function doSomething(onContent, onError) {
  try {
    // ... do something with the data
  } catch (err) {
    // no exception if onError is undefined
    onError?.(err.message);
  }
}
```

## Optional chaining with expressions

```js
let nestedProp = obj?.['prop' + 'Name'];
```

## Optional chaining with an array

```js
let arrayItem = arr?.[42];
```

> Optional chaining is forbidden in write contexts such as `a?.b = c`.
> Optional deletion as in: `delete a ?.b` is supported.

Let's see what babel transpiler does with this Optional chaining syntax

```js
const nameLength = db?.user;
```

It transpile into

```js
var _db;

var nameLength = (_db = db) === null || _db === void 0 ? void 0 : _db.user;
```

If you don't know what `void 0` does, it evaluates the given expression and then returns `undefined`.

## Syntax

```js
obj?.prop; // Object
obj?.[expr]; // Expressions
arr?.[index]; // Array
func?.(args); // Function calls
```

### Resources

1. [V8](https://v8.dev/features/optional-chaining)
2. [tc39](https://tc39.es/proposal-optional-chaining/)
3. [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Optional_chaining)

Thanks for reading!
Journey through my first Conference talk proposal
Tags: techtalks, beginners, markdown
Published: 2020-02-25 18:34:48

This is my very first draft for a conference proposal for [THAT conference](https://www.thatconference.com/wi).

I have never done a conference talk before, and am not very good at writing either. 
My goal though is to become a developer advocate/Evangelist/liaison. :smiley:

So this is the start of my journey.
Thanks so much for letting me share.   
[GittyUp with GIT](https://github.com/Ramona-Saintandre/Gitty-up-with-GIT/blob/master/Gittyup.md)




## GittyUp with GIT
  
> [!TIP]  
> Using Markdown Preview Enhanced extension in VSC for formatting

[Markdown Preview Enhanced](https://shd101wyy.github.io/markdown-preview-enhanced/#/)  
> [!NOTE]   
> need to come up with better sub-titles  
> need to work on better formatting
> need to elaborate more on this


**Why I want to talk about GIT and Github**  

After losing my job that I had for 10 years, I had to up-skill myself to obtain a new job. 
Having been in the IT field for over 15 years already, I really did not want to totally change careers.   
Looking at jobs I also noticed a demand for coding, scripting, application and software development. 
 
This is how my journey into coding and software development began. 

**The problem**  
> [!NOTE]  
> need to cut this down dramatically  


One of the first things that you are introduced to when you start to learn how to code is version control, aka.. Git/Github.  
I am mainly self-taught, FreeCode Camp, Udemy, and even a scholarship from Udacity.  
It was through Udacity that I learned about Git/Github. 
Like many though it was very confusing. 

Repo's, Forks, Cloning, branching, pushing, pulling, merging, and lets not forget pull requests, commiting, readme's, the list goes on. 

After a year of self teaching, and a little knowledge under my belt, I decided to go to a local bootcamp, to solidfy what I have both learned and taught myself over the past year.  

We are in our final month at the bootcamp, and starting to work on group projects, getting ready for our capstone project. 

Even after 5 months of school, my fellow classmates are having a hard time wrapping their head around GIT and GitHub.

I in no way consider myself an expert, but have found myself being the go to person in class in regards to version control. 

I am just a country an old school country girl, trying to learn new school ways. 

**The explaination**

> [!NOTE]  
> need to add more specifics, and examples

If given the opportunity I would love to introduce, explain, and share my experience and journey to both newbies, and novices on Git and Github. 

I will be using a humorous country style explaination to explain GIT and how to use, in the hopes that when I am done, people will be more comfortable with using GIT as their version control system.
8 tips for landing your first Dev Job
Tags: beginners, career, firstyearincode
Published: 2020-02-25 17:35:32

A few years ago I went to a coding bootcamp. Fast-forward to today and I'm an Instructor at a Coding Bootcamp and a Full Stack Developer. Here's my advice for those looking to land their first developer job.

1. Continue learning, coding, building applications that you can showcase. Make sure your have clean code and that it's DRY (don't repeat yourself). Comments, proper indentation, organization, and git commits, are all important as well. Finally, build something you're excited about. 

2. Freelance - Find someone who needs a website built, maybe it needs a store, a scheduling component, etc. Build websites for people, get paid to do it and showcase it on your resume / portfolio.

3. LinkedIn - Create a LinkedIn profile and add all relevant detail about yourself. Add your skills and get recommendations from other developers. You can also take skill quizzes on LinkedIn about a specific topic, like JavaScript. Recruiters can often see these and it could help as well. Additionally, mark yourself as open to new opportunities so you show up in recruiter searches.

4. Go to meet-ups, conferences, hackathons, etc. Network and meet people. A lot of people who attend these events might have a job opening. If not, it's still a great learning opportunity and chance to meet other developers. Don't be shy!

5. Proactively reach out to recruiters in your area and tell them you're in the market for a developer role.

6. Have a good attitude in all aspects. Whether it's coding, job applications, interviews, etc. You need to have a good attitude and a cheerful personality. Everybody wants a developer that's easy to work with. 

7. Demonstrate your passion for learning and growing as a developer. No matter what level you're at, you always can learn something new when it comes to programming. Let them know you enjoy learning and if you don't know something you're happy to research it, read documentation, watch tutorials, etc. to thoroughly understand it.

8. Ask other developers to review your resume, your applications you've built, etc. and get feedback.

If you follow these tips, I see no reason why you can't be successful. Getting your first developer job is always the hardest. After that, it's a lot easier because you have prior professional experience. Continue to have patience and work on improving your skills each day.

P.S. I launched a website with original coding shirts that I designed. Check it out! https://www.scriptkitty.dev
Amazona Part 2 Prerequisites: Build ECommerce Website Like Amazon
Tags: tutorial, livestream, html, css
Published: 2020-02-25 18:18:56

---
title: Amazona Part 2 Prerequisites: Build ECommerce Website Like Amazon
published: true
description: 
tags: tutorial, livestream, html, css
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/t14em6x1c36aqkhqbcbv.png
---

This post is part of a Coding Course by Basir JD to Build An ECommerce Website Like Amazon. If you did not read that, follow this link:

{% link https://dev.to/basir/amazona-part-1-build-ecommerce-website-like-amazon-2heh %}

Please provide the following tools and skills to get the best result in the live stream.

### Tools
* VS Code: The Code Editor. download from [here](https://code.visualstudio.com/download)
* Google Chrome: The Web Browser. download from [here](https://www.google.com/chrome/)

### Skills
* HTML:
  * Basic elements like html, head, body, div
  * Semantic elements like nav, header, main, section, aside, footer
  * Linking to external CSS files
 
* CSS: 
  * whitespaces: margin, padding
  * units: px, em, rem
  * flexbox
  * grid

### Live Stream
I will have a live stream on this Wednesday 26 Feb 2020 at 9:30 pm EST. It is all about designing a web template for Amazona.

[Subscribe to my Youtube channel](https://youtu.be/SooY-zqoLeg) to participate in my live stream. You will be notified when the session starts.
How to backup only original images of your WordPress site using WP-CLI
Tags: wordpress, wpcli, productivity
Published: 2020-02-25 18:17:50

---
title: How to backup only original images of your WordPress site using WP-CLI
published: true
description: In this tutorial you will learn how to create a backup of all original (full) images of a WordPress site using WP-CLI and wget.
tags: wordpress, wp-cli, productivity
---

I'm member of a WordPress community on WhatsApp. Today, one member raised the following question:

> "I need to create a backup of all images of a website, but only the original ones. I don't need the thumbnails. Does anybody know how to do that?"

If you Google about "how to backup full images on WordPress" or something similar, you will find a lot of posts about backing up images, but **not** only the original ones.

Then, I've discovered that it's possible to download multiple files at once using `wget -i filename.txt`. **filename.txt** file should contain a list of URLs, but each one must be in a separate line.

But how could I get a list of ALL full images of a WordPress site?

## WP-CLI to the rescue!

> [WP-CLI](https://wp-cli.org/) is the command-line interface for WordPress. You can update plugins, configure multisite installations and much more, without using a web browser.

For this task, we need to find a way to list the URLs of all original images and save them into a file.

We can do that by running only one command:

```
$ wp post list --post_type=attachment --field=guid > wp-content/uploads/images.txt
```

Let me explain each part of this command:

1. `wp post list` is a command to list all WordPress posts
2. `--post_type=attachment` is an argument to retrieve only images
3. `--field=guid` is an argumento to retrieve the URL of each image
4. ` > wp-content/upload/images.txt` is a command to output the result of `wp post list --post_type=attachment --field=guid` into a file.

## How to download the images (and create a backup)

After running the command above, you should have a file located at `https://yousite.com/wp-content/uploads/images.txt`.

Now, you should go back to your terminal, `cd` to the folder you want to download the files, and type the following command:

```
$ wget -i https://yousite.com/wp-content/uploads/images.txt
```

As soon as you hit Enter/Return, `wget` you start to download all the images contained in **images.txt** file to the computer (or server) you're running this command.

Voila!
A Quick Intro to Using the FireBase key on a custom backend: Part One
Published: 2020-02-25 18:11:24

Firebase is an amazon suite of products aimed at supporting web and mobile applications. The services include various data storage options, as well as authentication services. Since authentication and authorization can be a pain, smaller teams / independent developers might very well want to ‘outsource’ their authentication to the firebase service, rather than handle it themselves.

Firebase offers a javascript SDK that provides the ability authenticate via the tried and true email / password combo, or any one of the third-party supported auth providers (which can be configured in the firebase console). 

After using one of the built-in methods the client javascript SDK provides to send an authentication request to Google. 
 if the credentials are valid, the response the client receives back will include a “fire-token”. It will look something like this:

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



For basic authentication, we're interested in the idToken in the credentials object. This fire-token is a JWT token, encrypted via the RS256 algorithm.

If you have a custom backend you're going to want to save this token to local storage on the client side, and send it along with requests for resources on your backend that require authentication.
 
After sending the fire token to the backend, you're going to want to decode it. There is SDK support for decoding the fire token for some languages. Unfortunately, if your backend is rails, you're going to have to do it yourself.

The decoded token will look something like this:
  
Header Info
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/zam9xwhajuki04fpsvwj.png)



Data Payload

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


To verify the fire token, first decode it using a standard JWT library for your language. Then you will need to perform some validations. Taken directly from the firebase docs: 



![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/8ycwqhtbayazoi2gji7g.png)

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

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/51hzhuco8j3klzr6k8i5.png)


In Part 2, I will go over each of these validations in more detail.

Until Then.
Top 5 DEV Comments from the Past Week
Tags: bestofdev
Published: 2020-02-25 17:55:51

---
title: Top 5 DEV Comments from the Past Week
published: true
description: Highlighting some of the best DEV comments from the past week.
tags: bestofdev
cover_image: https://res.cloudinary.com/practicaldev/image/fetch/s--7VrAA2ln--/c_imagga_scale,f_auto,fl_progressive,h_420,q_auto,w_1000/https://thepracticaldev.s3.amazonaws.com/i/qmb5wkoeywj06pd7p8ku.png
---

This is a weekly roundup of awesome DEV comments that you may have missed.  You are welcome and encouraged to boost posts and comments yourself using the **[#bestofdev](/t/bestofdev)** tag.

@andyrosenberg talks about the important of time-boxing in **[How do you avoid rabbit holes?](https://dev.to/ben/how-do-you-avoid-rabbit-holes-d03)**.  This is something I need to apply to my own workflow:
{% devcomment loc8 %}

At the risk of kicking off a big debate, I wanted to share a comment from the **[Tabs vs Spaces?](https://dev.to/pandiyancool/tabs-vs-spaces-4bem)** conversation where @lionelgaillard shares their take:
{% devcomment lmlc %}

@ahferroin7 offers a wonderful explanation in **[Explain to me git rebase](https://dev.to/dmendoza99/explain-to-me-git-rebase-1fhi)**:
{% devcomment lp6o %}

@syntaxseed shares their set of resources that might be helpful if you're looking for **[Games to teach programming to a 9-year-old?](https://dev.to/michaeltharrington/games-to-teach-programming-to-a-9-year-old-5pb)**:
{% devcomment lo9p %}

Finally, @citizen428 shares a trick for remembering **[The HTTP Status Codes You Need to Know](https://dev.to/bearer/the-http-status-codes-you-need-to-know-1kd)**:
{% devcomment lmjl %}

See you next week for more great comments ✌
Assessing technical tasks
Tags: help
Published: 2020-02-25 17:42:13

I have put myself forward to review a technical task. I am going to just write notes, not be harsh.

But what if I see a nice to have, do I raise it directly. Example the app isn't very accessible, despite this not being such a concern in the scope of what we do (I still push for it), no keyboard usage to me is a tell about UX consideration and my test was accessable. But then again it's not a criteria.

I think I will just stick to the scope, that's fair isn't it?

Have you ever done this before, let me know in the comments what your approach was. What do you care about, and does it even matter what we care about?
Wau Ϝ Wow
Tags: one, wau, math, dihydrogenmonoxide
Published: 2020-02-25 17:29:11

Let me introduce you to Wau,
Your new favorite of all numbers
For many a different reason
But here's only some for now
I could keep going on
But dev.to post limit encumbers

Here's one:
One is wau choose wau
And another:
One is wau factorial
Zero over one's infinite sum tower
Is really just a wau memorial

If I've compounded your interest,
e to the two i pi is wau.
But it gets better,
e to i to the e i o
Finds its shelter in e to the wau 
To the tau wau wau

If you're dumb-founded, just reinvest
First, throw away your calculator,
As a log of a wow base breaks it
Next, buy a fractal exponentiator
And let's say the wau takes a hit
Then it still gives just another wow -

Makes no more sense than Brexit

A wow spiral definitely curls into its lone shelf
Allow trials infinitely, it unfurls its own self
It's not just maths, even physics gets wow help
Einstein's E to the wow over MC squared
Is wow to the two, but this news never aired
Maybe since its a con split personality 0 and 1 shared

Yet it's so uber cool no math lover hates it.



________________________________________________

Vi Hart's con that inspired this wau wau wow poem:

[youtu.be/GFLkou8NvJo](youtu.be/GFLkou8NvJo)
Pre Project: Finalizing the full requirement.
Tags: 100daysofcode, django, docker, github
Published: 2020-02-25 16:39:39



.    To be honest writing in here require some level of getting used to as I am too used to the whole WYSIWYG of wagtail. Anyway I will not let this get in the way of going through with the project.

.    Let see, I think I have properly establish what I wanted to achieve by the time I finish the 100 days challenge but that is kinda an overall goal. To develop a website you need a different goal, and that goal for me is to develop a multi tenant e commerce platform. I know I know, I'm too ambitious but well I follow the saying “Shoot for the moon. Even if you miss, you'll land among the stars.” by Norman Vincent Peale.

.    Honestly I think i will devote about 30 days towards making the backend work properly. This might means that I would spend most of the time working on Django template system first to make sure that it work as per expected, maybe sprinkle a bit of Jinja2 template system. Malaysia being a racially diverse country means that the project itself need to support multi language, while we are at it why not make it work with multiple currency. I need to also consider the need of logging, error handling and also auditing. I think for most part, I will implement an API call so that the front end can communicate with the backend to display. But at the same time I think this is a good opportunity for me to try graphql. I must also be able to add and remove system parameter through the GUI and also from Establishing caching to speed up the loading time, while at the work will ELK STack. Man I just make it harder and harder for myself. Hahaha....

Lets see if I could manage....
Pray for me yeah guys
Job Search Week 1
Tags: makers
Published: 2020-02-24 22:03:41


At the start of this week, I officially started my job search. I was glad to get my final project done and dusted but it does also mean I now have to find a job which nerve wreaking. It's not too bad because Makers have a career team who can help with getting a job so wish me luck.

Day 1

So at the start of the week, we did a morning stand-up and discussed how our first careers fair would go. We got to ask questions to clarify anything that we were unsure of.  We also did a to-do list for getting ready for job hunting things like getting our CV's ready and thinking about future projects etc. So I started on my CV and eventually moved on to looking into some of the companies that would be at the careers fair so that I could ask them relevant questions.

Day 2

Day two was spent similarly to the first day touching up my CV and looking into the hiring partners who'll be at the careers fairs. I mainly looked into testing within Azure and Terraform, which was the most interesting tech stack out of the hiring partners.

Day 3

The careers fair was on the third day it was fun but also a bit weird to line up to talk to someone. There were three companies at the careers fair Anthony Nolan, Clear Bank and Paddle. I was most interested in Clear Bank and Anthony Nolan. They both used a similar stack, Azure and C#. Clear Bank also uses Terraform. I was happy enough because I manage to speak to one of the senior developers at Clear Bank and got to ask him some questions about how they do testing. I also got the chance to talk to the chief information officer of Anthony Nolan and got to see how passionate he was about the work he was doing which was inspiring.

Day 4

After the careers fair, I had to send out applications so we could potentially get shortlisted for an interview. So I spent a little more time looking into Clear Bank and Anthony Nolan so that I could submit a well-informed application. I also thought about making a project using an API after the careers fair.

Day 5

When I was talking to the senior developer at Clear Bank he mentioned that doing something your passionate about while using an API would be a good way to practice for the kind of work they do. So I spent Friday creating an app that uses a Studio Ghibli API that gets all the films and displays them in an order of your choice. I was very happy to get that done on Friday.

Summary

I managed to get mostly set up for the job hunt which means I can spend more time on different projects. I don’t think I'll get shortlisted for Clear Bank or Anthony Nolan because I think some people have had more time to practice the job search so it's likely they get them. But at least I'll learn something and I've got my first careers fair done.
reactjs not submitted the from-data to service
Tags: react
Published: 2020-02-25 16:27:13

We are using react js with springboot. We have written the service and check from postman form-data. It's working but when we use react js it's not working. Rest End point hit but not load the form-data to the service. for React we are using const formData = new FormData() and append all the required input. 

React Code

  var myHeaders = new Headers();
    myHeaders.append(
      "Content-Type",
      "multipart/form-data; boundary=--------------------------547201236987390833862834"
    );

    var formdata = new FormData();
    formdata.append("event", "New");
    formdata.append("maxPrice", "1000");
    formdata.append("startDate", "2020-02-01");
    formdata.append("endDate", "2020-02-20");
    formdata.append("minPrice", "1");
    formdata.append("sourceSystem", "fidessaetp");

    var requestOptions = {
      method: "POST",
      headers: myHeaders,
      body: formdata,
      redirect: "follow"
    };

    fetch("http://localhost:8080/sa/searchData", requestOptions)
      .then(response => response.text())
      .then(result => console.log(result))
      .catch(error => console.log("error", error));



spring boot

@PostMapping(value = "/sa/searchData")
public List<DataResponse> searchData(SearchCriteria searchCriteria) {
    return saService.searchData(searchCriteria);
}