teleren/devto huggingface dataset:
[ESLint] Parsing error: unexpected token =>
Tags: eslint, javascript
Published: 2021-01-06 00:48:21

Hi there!

I'm Arisa, a freelance Full Stack Developer.

I'm developing [Lilac](https://note.com/frontendlifeinde/m/m9b8feda1d547), an online school with hands-on Frontend e-books and tutoring👩‍💻

# What is this article about?

This is a solution when I saw these errors.

```
Parsing error: unexpected token =>
```

```
Warning: React version not specified in eslint-plugin-react settings. See https://github.com/yannickcr/eslint-plugin-react#configuration .
```

# Project environment & full configuration

- macOS: Catalina 10.15.7
- VS Code

- ESLint Version: ^7.15.0
- Node Version: v12.18.2
- npm Version: 6.14.5

```
"babel-eslint": "^10.1.0",
"babel-jest": "^22.4.1",
"babel-preset-env": "^1.6.1",
"concurrently": "^3.6.0",
"eslint": "^7.15.0",
"eslint-plugin-react": "^7.22.0",
"jest": "^22.4.2",
"webpack": "^3.10.0",
"webpack-dev-middleware": "^2.0.4",
"webpack-dev-server": "^2.11.1",
"webpack-hot-middleware": "^2.21.0"
```

A very simple project with JS(EcmaScript2016) with webpack, babel, jest and ESLint.

# When did this error appear?

While I was running ESLint on my JS files.

# How did it solve?

### Reason

Lacking out of a package, `babel-eslint` to install.

### Solution steps

1. Install `babel-eslint` locally

```
$ yarn add --dev babel-eslint
``` 

> Source: [https://github.com/babel/babel-eslint](https://github.com/babel/babel-eslint)

2. Add `"parser"` config in .eslintrc.js

```
"parser": "babel-eslint"
```

> Source: [https://github.com/eslint/eslint/issues/10137](https://github.com/eslint/eslint/issues/10137)

3. Remove unnecessary config for non-React project

```
// "extends": [
//     "eslint:recommended",
//     "plugin:react/recommended"
// ],
```

> Source: [https://github.com/yannickcr/eslint-plugin-react#configuration](https://github.com/yannickcr/eslint-plugin-react#configuration)

No errors✨

# Summary

The biggest mistake I had was the React config in a JS project.

Normally, I use React and didn't realize the wrong config for JS project🤦‍♀️

Hope this article was relevant for what you were looking for!

Happy new year & happy coding🎍
How to start your Front-End developer journey as a beginner?
Published: 2021-01-06 00:47:08

Anyone can become a Web Developer if you put consistent hard work. I would recommend if you are new to coding, explore all coding languages so you will get to know which you are good at.

Use [Repl.it](https://repl.it/), [codepen](https://codepen.io/) free online code editors to test your codes and there are many free courses, videos available where you can learn basics of coding languages. 

If you start to like a specific language, then go for paid Bootcamp, Online courses or [Freecodecamp](https://www.freecodecamp.org/) a non-profit which offers free courses.
How to become a self-taught developer?
 * Try to spend 1 hour regularly for studying on your own
 * Create a study group for motivation
 * Set a goal 

If you completed the basics, then start doing small projects. You can also start doing Volunteering.
Some of the websites where you can look for Volunteering:
 * [Taproot Foundation](https://taprootfoundation.org/)
 * [Volunteermatch](https://www.volunteermatch.org/)
 * [Catchafire](https://www.catchafire.org/)
 * [AllForGood](https://www.allforgood.org/)
 * [GirlsWhoCode](https://girlswhocode.com/)
 * [Nubay](https://nubay.org/)
 * [FastForward](https://www.ffwd.org/)
 * [furloghed.life](https://furloughed.life/)

Volunteering as a developer is a great way to a beginner. Most of the Volunteering works will be developing in WordPress. Even though, you will get to know about websites.

You can also start contributing to opensource projects. 
 * [How to start contributing to open source]( https://opensource.guide/how-to-contribute/)
 * [How to get started in open source in 5 steps]( https://medium.com/@caroso1222/how-to-get-started-into-open-source-in-5-steps-378ef06b7526)
 * [6 starting points for open source beginners](https://opensource.com/life/16/1/6-beginner-open-source)
 * [How to make your first open source contribution in just 5 minutes]( https://medium.freecodecamp.org/how-to-make-your-first-open-source-contribution-in-just-5-minutes-aaad1fc59c9a)

These won't happen in small time. If you put some inputs regularly, then you can enjoy the compounded output.
Regex..why can’t you just be normal? 🤯
Tags: regex, javascript, discuss
Published: 2021-01-06 00:37:24

The problem with regular expressions is that they are too powerful, hence often mistaken for a Parser + Lexer and therefore lead to code which is VERY HARD TO MAINTAIN.

Please devs, when you need to match a c struct - use ANTLR or whatever and avoid what I did back in the day:

/((\w+\s*(,\w+\s*)*)(\n|\s)*)?\{([^\}]*)\}(\n|\s)*(\w+\s*(,\s*\w+\s*)*)?;/g 🤪

(ps: it’s only one of many, yes it might have bugs, no I did not find them yet, no it’s not in production anymore..)
Hack the Chrome Dino Game
Tags: javascript, hack, fun
Published: 2021-01-06 00:35:19

How to 'hack' the Google Chrome Dino Game 🦖

Step 1:
Open the game (type chrome://dino in your Chrome Browser)

Step 2:
Open the Developer Mode (Ctrl + Shift + I or option + command + I)

Step 3:
Type this code in the console
Runner.prototype.gameOver = ()=>{};

Step 4:
Close the Developer Mode and start the game

Step 5:
BOOM! The dino goes past all cactus and birds 🤪

➡️ Webdevelopment is a superpower 🦹‍♀️

Comment hack below if you want more hacks!
Do programmers memorize code?
Tags: codenewbie, beginners
Published: 2021-01-06 00:33:11

Sometimes. Most engineers can't remember what they wrote yesterday but can write an algorithm by hand if asked.

Contributing to a shared codebase is like writing an endless novel with many writers, revisions, and a long history of changing based on the problem a particular piece aims to solve.

It's almost impossible to remember everything you or someone else wrote. 

There is; however, some recall involved when programming. You've already memorized many words and phrases in the English language, and that's a great start since programming languages are in English. 

Each language has its vocabulary and rules that need to be respected for things to work. You will want to memorize these. For example, JavaScript has some of the following keywords that you'll need to understand and remember to use the language to it's fullest capability: 

- variable declaration: `let`, `var` `const`
- loops: `for`, `while`, `in`, etc

You will find these basic concepts in all programming languages, sometimes with the same syntax.

Memory works like a muscle. The more you practice something, the better you get at it. When engaging in deliberate practice of a skill, your nervous system sends electrical impulses to new areas of your brain. This action insulates the axons with a myelin sheath that strengthens the signal over time. 

With enough repetition, your understanding of new concepts will be embedded in your long-term memory, making your recall faster than it was before.
We have a problem..
Tags: discuss, kubernetes, helm
Published: 2021-01-06 00:28:47

It's a familiar one to most of us who work in #tech.

We spend more time setting up and managing #infrastructure than we do writing code for it.

Sometimes there are not even entries on #Google for that, and the only thing you can do is try it out.

For Codesphere Inc., Jonas Zipprick, Roman Frolov and me wrote many thousands of lines of ansible scripts, helm charts and code - for setup, not features.

While in the last weeks we tried out different tweaks to improve our huge kubernetes cluster, I am now proud to say we are building something from scratch so developers won't have to.

(For everyone interested: multi master, multi load balancer, external etcd and more...).
Help me pick the right path
Tags: career, webdev, codenewbie, help
Published: 2021-01-06 00:25:55

Hello all. I hope everyone doing so great. I'm an Engineering graduate passed out in 2019. But I changed my career to become a web developer. In the meantime 2020 played so well (Lockdown). During the pandemic, I taught myself to code and I got a job less than a week ago. Currently, I'm confused that should I continue this low paying job to get experience!? Or need to wait for some more months to get some decent-paying job. Need some advice.
Documents Spring Boot actuator endpoint with OpenApi
Tags: springboot, actuator, openapi
Published: 2021-01-06 00:20:41

In my previous post, I shown how to create a custom Spring Boot actuator endpoint. It could be useful to have pretty web interface to document these endpoints and allow other people to easily access your api in a pretty way. You know, I'm a girl, I like pretty things ;)

So, I chosen to use OpenApi which is usually easy to use, usually... In fact, by default, actuator endpoint are not shown with OpenApi, and it was hard to find how to do. That's why I decide to write this small post.

First of all, you'll need this dependencies :
```gradle
    implementation group: 'org.springdoc', name: 'springdoc-openapi-ui', version: '1.5.0'
    implementation group: 'org.springdoc', name: 'springdoc-openapi-data-rest', version: '1.5.0'
```
Then, you just need to add these properties...
```yaml
springdoc:
  show-actuator: true
```

... And you got your actuator endpoint documentation ! 

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

... And you can test your endpoints 

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/7ll4jm8pcip6zmfbxt7i.png)
Animated Gooey CTA Codepen Demo Pure CSS No JS
Tags: css, codepen, codenewbie, html
Published: 2021-01-06 00:06:07

Animated Gooey CTA Codepen Demo Pure CSS No JS

{% codepen https://codepen.io/livewordpresshelp/pen/XWjVmgQ %}

#codepen #css #html #nojs #demo #gooey #cta #mobile #menu #animated #animation #code #learncode #fork #free #dribbble #rebound #pink #svg

Original Dribbble shot I rebounded to piece together the demo from: https://dribbble.com/shots/14879175-Animated-Codepen-Demo-Link-In-Description-No-JS-Pure-CSS-Gooey
Umbraco "hidden" properties - umbracoUrlName and umbracoUrlAlias
Tags: umbraco
Published: 2021-01-11 12:28:35

---
title: Umbraco "hidden" properties - umbracoUrlName and umbracoUrlAlias
published: true
date: 06 January 2021
tags: umbraco
canonical_url: https://www.owain.codes/blogs/2021/january/umbracourlname-and-umbracourlalias/
---

While working on a project I came across an issue where having the ability to give a different url for a page within the CMS would be beneficial. 

In the past, I've always just used `umbracoUrlAlias` but it was suggested that `umbracoUrlName` might be a better option. This short blog will hopefully bring these properties to light for some of you. 

##How do you use them?

Both properties can be use on any document type that is accessible via the front end of your site e.g. http://www.owain.codes/about

Add a text string to your document type and make sure that the alias is `umbracoUrlAlias` or `umbracoUrlName`.

An example is below for `umbracoUrlName`

![enter image description here][1]

Of course, you can change the Name from `umbracoUrlName` but make sure the alias, the bit  next to the padlock, remains `umbracoUrlName`.

## What's the difference between the two?

I'll use the description that is used within the [Umbraco Documentation][2], 

### umbracoUrlAlias
> This property when created as a text string lets you provide a comma separated list of alternate full URL paths for the node. For example, if your URL was /some-category/some-page/content-node, by adding an umbracoUrlAlias of "flowers", a user can navigate to the node by going to /flowers. The URL alias remains in the browser address bar as a 'mask' over the real URL. You can also specify paths like "flowers/roses/red".

One thing to note is that the original URL is also still accessible. To help understand this, if you think about this property as a url shorterner then it will hopefully make it a bit clearer. 

### umbracoUrlName

> This property when created as a text string lets you provide a different URL name to what is created by default by the name of the node. If you enter a value for this property and save/publish the content node, you will see that its main URL is updated with a new path suffix.

If we use the example that was used above and use the path `/some-category/some-page/content-node`, if we use `umbracoUrlName` property and use the word `flowers`as the value, the url for this page / node is now `/flowers`. 

The longer path name now doesn't exist and the only way to access this node is via `/flowers`

### Other routing options

There are two other options built in to Umbraco that you can use when handling routing. 
`umbracoRedirect` and `umbracoRedirectId`

In short, `umbracoRedirect` performs a 302 redirect by using a Content Picker and `umbracoRedirectId` does a url rewrite. 

For more info, check out the [Umbraco Documentation][2]


  [1]: https://owain.codes/media/8d8b27e1a7c69f0/propertyeditor.jpg
  [2]: https://our.umbraco.com/Documentation/Reference/Routing/routing-properties
How to encode and decode a full URL using JavaScript?
Tags: javascript
Published: 2021-01-06 00:00:00

---
  title: How to encode and decode a full URL using JavaScript?
  published: true
  tags: JavaScript
  date: Wed Jan 06 2021 05:30:00 GMT+0530 (India Standard Time)
  canonical_url: https://melvingeorge.me/blog/encode-decode-full-url-javascript
  cover_image: https://melvingeorge.me/_next/static/images/main-1a4e2608eb8d5a2d5975806f2ea883f7.jpg
  ---
  [Originally posted here!](https://melvingeorge.me/blog/encode-decode-full-url-javascript)
  
To encode and decode a full URL in JavaScript, you can use the `encodeURI()` and `decodeURI()` functions respectively available in the global `window` object.

Consider this URL,

`https://www.google.com/search?q=Hello world`

If you notice the above URL, you can see the space between the word `Hello` and `World`. This URL cannot be sent over the internet safely and needs to be UTF-8 encoded.

## Encode URL

This can be done using the `encodeURI()` function by passing the string into the function like this,

```js
encodeURI("https://www.google.com/search?q=Hello world");

//Output: https://www.google.com/search?q=Hello%20world
```

If you see the output above, you can see the space between the two words is now converted to `%20`, which means we have successfully encoded the URL. Now, this URL can be safely sent over the internet.

## Decode URL

To decode the encoded URL, you can use the `decodeURI()` function like this,

```js
decodeURI("https://www.google.com/search?q=Hello%20world");

// Output: https://www.google.com/search?q=Hello world
```

### Feel free to share if you found this useful 😃.

---
Day 1/365. What is this about?
Tags: devjournal
Published: 2021-01-05 23:35:06

👋🏻 Hey! Today is the day when I start my shift from being a developer (for about 20 years for now) to being an entrepreneur.  

📅 I'm giving myself exactly **1 year or 365 days** to start making **at least $5000/month** on average or having a strong reason to believe I'm on the path to that and more. If I fail - I will join the workforce again, which is fine, but not the thing that makes me happiest.

📝 On this path ahead of me, I want to post to this blog regularly, to hold myself accountable (daily standup-ish like?) and provide some useful insight, inspiration, and information for the people who read it.  Let's see how it goes!

So, here are some details on what are my current situation and my plans. 

**Currently**

- I know how to write almost anything with TypeScript and I have about 10 years of c# development in past. Have some technical management experience too.
- I have a comfortable rainy-day fund that will last me more than a year, although thoughts about employment income that I will be missing next year make me not so comfortable.
- I taught myself how to safely trade the stock market in the last 2 years, have been actually quite profitable and consistent for the last year, but I don't count on it continuing to be amazing all the time. First of all, full-time trading is hard and not exactly what I would like to do, second - there is risk attached to it and while I learned how not to blow up my account, I still can't be sure I can always make living trading stocks. One project that is attached to trading though is algo-trading, and I will be exploring that for sure.

**This year I want to**

- Be fast, lean, and bootstrapped.

- Open my ideas list and build a bunch of SAAS services and tools under my new brand "Soulful Robot", see what works and focus my efforts on that.

- Collaborate with other people on shared projects/startups. 

- Release at least one game for mobile platforms and see if I like it or if I can make any income with game development. This will probably be hard because I'm not fond of the modern "slot-machine" game development style.

- Learn and use TensorFlow in at least one project.

- Learn how to make music, I have some experience playing instruments and working with DAWs, but most are forgotten or never properly learned. This is more of a hobby goal, but it has the potential to be commercial, you never fully know what to expect from yourself 😊

- Give back, meet new people, share my knowledge, become a part of a bigger professional community than working for small to medium companies usually lets you.

- Get fit! 

Alright, this turned out much longer than I anticipated, see you next time! 
Feel free to share your thoughts, ask questions, or be critical, I'd love to talk.
Lighter LoDash Builds for Laravel
Tags: laravel, lodash, performance
Published: 2021-01-05 23:18:56

---
title: Lighter LoDash Builds for Laravel
published: true
description: customize the default LoDash bundle to load only what you need
tags: laravel,lodash,performance
//cover_image: https://direct_url_to_image.jpg
---

Laravel projects often include the [LoDash JavaScript utility library](https://lodash.com). It contains handy utilities, however if you don't need its entire suite you may be serving unnecessary JS to your users that you never run.

LoDash supports [custom builds](https://lodash.com/custom-builds) to avoid this problem, and it's fairly easy to modify your Laravel's bootstrap.js file trim down the features you're loading.

## Default resources/js/bootstrap.js
```
window._ = require('lodash'); // 71.1K (gzipped: 24.6K)
```

## Customizing the build
In my case I was only using the throttle and debounce helpers from LoDash. This can be mapped to the window lodash object (typically _) like so:
```
window._ = require('lodash/core')  // 14K (gzipped: 5.3K)
window._.debounce = require('lodash/debounce')  // 3.5K (gzipped: 1.4K)
window._.throttle = require('lodash/throttle') // 3.7K (gzipped: 1.4K)
```

My application JS can then call `_.debounce()` and `_.throttle()` for those functions with a significant saving to my JS bundle size.
Como baixar todas suas fotos marcadas no Facebook
Tags: tecnologia, download, facebook, python
Published: 2022-03-31 20:57:54

---
title: Como baixar todas suas fotos marcadas no Facebook
published: true
date: 2021-01-05 23:06:13 UTC
tags: Tecnologia,download,facebook,python
canonical_url: https://marquesfernandes.com/tecnologia/como-baixar-todas-suas-fotos-marcadas-no-facebook/
---

 ![](https://marquesfernandes.com/wp-content/uploads/2021/01/wp2638362-fb-wallpaper-150x150.jpg)

O Facebook vem caindo em desuso há um tempo. Então recentemente pensei em fazer um backup de todas minhas fotos, até que me deparei com um problema: como baixar as fotos em que eu fui marcado? 

O Facebook agora permite que você baixe todos os dados fornecidos a ele, fotos, curtidas, publicações, contatos e muito mais, mas ele não oferece a opção de baixar suas fotos marcadas/tagged por amigos.

Eu encontrei uma solução, relativamente simples, mas você vai precisar ter o Python 2 instalado para rodar um script:

1. Baixe o script em Python: [https://github.com/mgjohnston/fmpd](https://github.com/mgjohnston/fmpd)

2. Acessa a página “Fotos com você” e role até o final dela-  [https://www.facebook.com/me/photos](https://www.facebook.com/me/photos)

3. Abra o Inspecionar do Google Chrome (`ctrl + shift + i`), ignore o aviso de segurança e executa o seguinte código:

```

for (link of document.getElementsByTagName('a')) { 
  if (!link.href.includes("?fbid=")) continue; 
  console.log(new URL(link.href).searchParams.get("fbid")); 
}

```

Agora você precisa copiar todas as URLs geradas e salvar em um arquivo chamado list.txt. Não esqueça de limpar o arquivo e deixar apenas os FBIDs das fotos.

4. Vamos precisar agora dos cookies do Facebook para o script conseguir funcionar e acessar as fotos para baixar em seu computador. Eu recomendo que você use a extensão [cookies.txt para o Chrome](https://chrome.google.com/webstore/detail/cookiestxt/njabckikapfpffapmjgojcnbfjonfjfg) e salve o arquivo como “cookies.txt” na mesma pasta em que você baixou o script.

5. Use o Python 2 para rodar o script e baixar as fotos.

```

python download.py

```

O post [Como baixar todas suas fotos marcadas no Facebook](https://marquesfernandes.com/tecnologia/como-baixar-todas-suas-fotos-marcadas-no-facebook/) apareceu primeiro em [Henrique Marques Fernandes](https://marquesfernandes.com).
SetInterval and EmberJs
Tags: ember, codenewbie, todayilearned
Published: 2021-01-05 23:03:31

![Screenshot of Snake game](https://dev-to-uploads.s3.amazonaws.com/i/8p13nhc5brk9sfptf29w.png)

### Context
I was working on rewriting a vanilla JS snake game in Ember JS. One of the basic features of the game is that the snake moves continuously even if the user is not pushing any button.

In vanilla JS the solution to this is straightforward
`interval = setInterval(`gameMoves, 1000)`
and at the end of the game you just do `clearInterval(interval)`

My assumption was that Ember would not be much different, and would look like this:
`this.interval =setInterval(this.gameMoves, 1000);`
This did nothing.

Assuming the syntax was off somewhere (I am dyslexic so commas and brackets are my mortal enemies), I tried this:
`this.interval = setInterval(this.gameMoves(), 1000);` 
`this.gameMoves()` ran once and stopped. 

### Problem
Digging in I discovered that when I console.log `this' in `this.moveOutcomes` after running `this.interval =setInterval(this.moveOutcomes, 1000);` I  don't actually get `this` but `window`.

![Screenshot of what happens when this is console logged in a function that was called by setInterval](https://dev-to-uploads.s3.amazonaws.com/i/hdn6zo9prpgp7n7cwkax.png)

After an evening of googling, asking twitter, assuming that I am losing my sanity, and reminding myself that if I can write something in vanilla JS then it surely can be done in Ember. My colleague had the answer to my conundrum `this` needed binding.

### Solution
`this.interval = setInterval(this.moveOutcomes.bind(this), 1000);`

### Alternative solution

Someone on twitter suggested to use `later` which worked quite well but I felt it was a bit of an overkill. 

Here is a [twiddle](https://ember-twiddle.com/b6230aab046ec37e43b15334930f0427?numColumns=2&openFiles=components.my-component%5C.js%2Ctemplates.components.my-component%5C.hbs) if you are interested.

### Why am I sharing this?
Because Ember is awesome, and Ember newbies should be able to google for answers.

But if googling fails [Ember Discord channel](https://discord.com/channels/480462759797063690/483601670685720591) is amazing.