teleren/devto huggingface dataset:
Add react to laravel
Tags: laravel, react, javascript, php
Published: 2019-11-19 16:41:51

If you need add react in your projects of laravel this is very easy and simple.

1.- Create your app of laravel.
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/s11a7xkuc4eptrb6v2ro.png)

2.- Run this command in your path of project.
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/uibhmumeh028jbxdts5t.png)

This command create configuration and base files of the first component **resources/js/** & **resources/js/components/Example.js**, you need update Example.js

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/qhjvkk3cm76ym13g9g0s.png)


After this you need install all dependences for react 
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/1080ip8x32gqfg8ydd65.png)

The next step is configure wildcard in your file of routes **routes/web.php**
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/djxpbkephxu3qpg26emy.png)


And then you need create view with name **app.blade.php** on **resources/views/** and add this configuration
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/602sn8vxsz6vqektjjsr.png)

This configuration will be enough to test our application.

For development mode you can run this commands in differents terminals:

**npm run watch**
**php artisan serve**

Build for production:

**npm run prod**

Source code: https://github.com/abelhOrihuela/test-laravel-react

Thanks for reading...
Encrypted Alternative to Google Photo
Tags: photos, encryption, blockchain
Published: 2019-10-29 19:55:37


PhotoVault promises secure photo storage and sharing with extremely low risk of site being compromised

 PhotoVault launches as a secure online site to host, edit, and share photos. It is poised as a safer alternative to the popular Google Photo application.

The strong sense of security we all felt with the internet is largely a thing of the past as many of the largest and most active sites has been the victim of hacking breaches. When these sites are compromised, our data and often our privacy is compromised as well, and the consequences can be felt long term. Even the search giant Google has been plagued by hacking incidents and the claims of others hacking into and sharing private photos have been numerous. A new photo storage and sharing site hopes to make such incidents a thing of the past.

PhotoVault (http://photovault.online) is the creation of Vinicius and he is committed to offering a platform that will ensure 100% security for every image that is uploaded to the site.

"It Does not matter whether it is the private footage of a celebrity or pictures of your family, all private images should be securely encrypted so they may never fall into the wrong hands."  Vinicius Melo, creator of PhotoVault
The site was created using BLOCKSTACK, a decentralized computing platform that puts users in control of their data and identity. This means that not even the admins of PhotoVault can access a user’s photos. In addition to the security protocols, PhotoVault is a free site and allows users the ability to edit photos right from the platform as well.  
Those interested are encouraged to visit the free platform at http://photovault.online
A strange Square
Tags: c
Published: 2019-10-29 20:46:21

Hi everybody!

In the [last post](https://dev.to/mrsoundso/my-first-adventure-4hh0) I showed you the the way I approached the "Print a rectangle test".
The next test I'll have to tackle is: 

#### Print a crossed square to the console

So I started with the nearly the same code I used in my last project, but I quickly realized that the three for loops I used made everything way harder than it should be.

So I switched over to two nested for loops:


    for (int i = 0; i < x; i++) {
        for(int b = 0; b < x; b++) {
          printf(%c,c);
        }
        printf("\n");
    }


This resulted in a completely filled rectangle, just as I intended.
So I once again added a if check to make sure only the parts I wanted to be char where chars.

I started with the walls: the top line should be filled if <code>i == 0</code>, and the bottom if <code>i = x - 1</code>. The walls worked after a similar principle, just replace the <code>i</code> with a <code>b</code>. It's also important to add a <code>else</code> statement to print a space if none of the conditions on top are met.

The cross part was harder than I initially thought. While the line going from the top left corner to the bottom right one was simple as it simply follows the <code>i == b</code> condition, the one going the other way made me scratch my head a lot more.
The thing I came up with was this formula: <code>(i + b) == x - 1</code>
This condition is meet for every point on the line between the bottom left corner and the top right one.

In the end my complete code looked like this: 

    for (int i = 0; i < x; i++) {
      for(int b = 0; b < x; b++) {
        if(i == 0 || i == x -1 || b == 0 || b == x - 1 || i == b || i + b == x - 1) {
           printf("%c",c );
        } else {
          printf(" ");
        }
      }
    printf("\n");
   }


If you would try the same thing with 3 individual loops instead of 2 nested ones, you would run into really really unfunny issues with these simple if checks. For example, I had issues with the lines not meeting in the middle or having spaces everywhere but not where I wanted to have them. 


Have a nice day!


P.S: I'm sorry for the strange formating. If you know how to fix it please leave me a comment!

P.P.S: Thanks to {% user katnel20 %} for telling me how to fix my issues!
A simple tip to improve your code maintainability - Decompose IF statements into methods
Tags: beginners, programming, csharp, dotnet
Published: 2019-10-29 22:34:54

---
title: A simple tip to improve your code maintainability - Decompose IF statements into methods
published: true
date: 2019-10-23 23:00:00 UTC
tags: 
canonical_url: http://gsferreira.com/archive/2019/10/a-simple-tip-to-improve-your-code-maintainability-decompose-if-statements-into-methods/
---

![Extract method](http://gsferreira.com/images/a-simple-tip-to-improve-your-code-maintainability-decompose-if-statements-into-methods.png)

How many times have you been in a situation where you can’t understand a small piece of code?

Readability has a huge impact on code maintenance because reading other’s people code (and sometimes even our code) can be challenging.

As developers, **we tend to ignore the UX (user experience) of our code**. Every single line of code that we do, will eventually be used by others. Is important to be sure that we do the best possible job for our teammates and to future self.

**The worst code blocks in terms of UX are the ones that require a huge cognitive load.** It’s our job to ask our selves what we can do to reduce it and improve readability. 

Usually when I’m in a situation that requires high cognitive load to understand a piece of code, is because I face a huge and complex IF statement condition and I need to figure out what the hell it’s supposed to do. Do you know the feeling? Having to sketch a decision tree trying to figure out what is happening?


## How to avoid it?


This is one of the most simple tricks that I do every day and I tend to advise everyone to do.

My rule of thumb is simple: **In case of a multi-part condition, extract it to a method and name it accordingly.** 

Let’s see it in practice.

Imagine that you have the following expression, that wants to validate if the customer can pay the Order with Credit Card. To do that, the customer should have an active Credit Card.


```c#
if (order.PayWithCreditCard && (order.Customer.CreditCard == null || order.Customer.CreditCard.ExpirationDate < DateTime.Today))
    throw new CreditCardPaymentException("Customer doesn't have a valid Credit Card");
```


To improve it, you can extract the boolean logic related to the credit card validation to a static method, and name it with something easy to understand.


```c#
public static void ProcessOrder(Order order)
{
    if (order.PayWithCreditCard && IsCustomerCreditCardInvalid(order.Customer))
        throw new CreditCardPaymentException("Customer doesn't have a valid Credit Card");
            
    (...)
              
}
    
private static bool IsCustomerCreditCardInvalid(Customer customer)
    => customer.CreditCard == null || customer.CreditCard.ExpirationDate < DateTime.Today;
```


By doing this you are abstracting the reader’s mind from details. In case the reader needs to know the details, he can drill down to the details.
blog-pwa Moves to GAE Python 3.7 Runtime and Other Updates
Published: 2019-10-30 00:20:47

---
title: blog-pwa Moves to GAE Python 3.7 Runtime and Other Updates
published: true
date: 2019-09-19 23:11:06 UTC
tags: 
canonical_url: https://justinribeiro.com/chronicle/2019/09/19/blog-pwa-moves-to-gae-python-3.7-runtime-and-other-updates/
---

`blog-pwa` has been my trusty site-runner for quite a while at this point. We’ve seen the frontend transformed a few times, from Polymer 2 to Polymer 3 and finally today’s build of LitElement. What doesn’t get a lot of fanfare is the backend that powers it, Google App Engine.

I’ve been a huge fan of Python 2.7 on App Engine for a long time. Stability-wise GAE hasn’t ever hiccuped, hasn’t ever given me so much as a mild headache. That said, as we all know, Python 2.7 is coming to it’s end of life this year and I’ve been a bit behind the ball in doing the 2-to-3 conversion. Alas, no more!

As of [PR #64](https://github.com/justinribeiro/blog-pwa/pull/64), I’ve converted the base libs and the project to use GAE’s Python 3.7 runtime. This includes some additional rework to the old http2push lib, which I gutted and revised to handle a problem I noticed a few months ago: that preload’ed resources were being dup’ed at the fetch layer in Chrome and Firefox.

Note, this wasn’t actually an issue with the browsers. Alas, I failed to revise the lib some time ago and forgot to add `crossorigin` to the header definition. This is now resolved, resulting in a faster load time experience.

```
# Justin says: This is specific to the content path json file; it is # used by fetch() on the client, but we push the resource early so it # doesn't have to wait. Said resource must use as=fetch and have the # crossorigin set otherwise it'll dup in the browser json\_target = '%s%s' % (host, str(self.name)) preload\_links.append( '; rel=preload; as=fetch; crossorigin=anonymous;' % json\_target) for url, v in urls.items(): # Construct absolute URLs per spec. url = '%s%s' % (host, str(url)) t = str(v.get('type', '')) if len(t): # if you don't crossorigin these, they will not work preload\_links.append( '; rel=preload; as=%s; crossorigin=anonymous;' % (url, t)) else: preload\_links.append('; rel=preload' % url)
```

Speaking of which, the `app.yaml` has been axed and chopped to meet the new definition for the Python 3.7 runtime. If you haven’t looked at the change, it might come as a shock, but for the most part it is very similar and easier to handle.

Finally, I added a few revisions to some of the loading libs within `index.html`, notably that the web components polyfill loader no longer loads every time. Unless you’re on something rather old at this point, it’s just not needed in most cases, so now it checks before loading.

I suspect that I’ll be making some additions as the year comes to a close to blog-pwa. I’d like to revise the rollup configuration (which is a little thin if I’m being honest) and add some additional features that I’ve had in my notebook for a while. In the mean time, happy times with a little Python 3.7 Google App Engine update.
Why Typescript?
Tags: typescript, javascript
Published: 2021-01-09 13:53:11

## Why Typescript

Typescript extends JavaScript by adding types at build time.

Benefits

- ✅ Encode constraints and assumptions, as part of developer intent. Defensive programming: Don't trust any of your inputs. Causes cognitive and performance overhead

- ✅ Speeds up your development experience by catching errors and providing fixes even
before you run your code. Some 15% of JavaScript detectable bugs could be prevented according to a [research](http://earlbarr.com/publications/typestudy.pdf)

- ✅ Easier to refactor code without breaking it significantly. Gives you the confidence to refactor without fear of breaking assumed, implicit contracts.

- ✅ Improved Developer experience: Navigating, understanding complex large size code is easier. Don't need to drill into source files and read all code implementation. You can go one level higher abstraction: rather than how you look at what the code does

- ✅ Helps with documentation. Automated API docs generation. More formalized and stable contracts

## Cons

- ❌ Not true static typing, only checks the shape of the object, not its true type.
- ❌ Paradigm shift for developers coming from non statically typed languages, the learning curve
- ❌ Adding extra step — transpiling from .ts files to .js / so many options to consider.


## App vs Library concerns
App perspective
- More richness when you work with data. You can discover enumerations you can use, overloads of methods you can call.
- Better encapsulation tools. Private, protected, public, read-only. Unintended code is hidden away from end-user
- Improved "major version upgrade" experience, ie. upgrade from Lodash 3 to 4, you get immediate todo list with all those broken code showing typescript checks.

Library perspective
- Create and maintain public API surface, helps with semantic version guarantees
- Use enums to allow the only type encoded list of values and support for future compatibility, reserve values for future
- SemVer (deprecations, breakage)
- API Docs


## Show me some code examples

* casing/typing errors

plain old .js
```
let toothBrush = { name:'OracleB', price: 2.99 }

function getProductName(product) {
    console.log(product.Name); //simple case error
}

getProductName(toothBrush)  //undefined

```
type checking .ts

```
type Product= { name:string, price: number}; //type is defined here..

let toothBrush = { name:'OracleB', price: 2.99 }

function getProductName(product: Product) {
    console.log(product.Name); // !! will fail at development time
}

getProductName(toothBrush)


```


* undefined is not a function
```

let myFunction;

myFunction('hello'); //Uncaught type error, not defined..

myFunction = (message)=> console.log(message);

```

* Accidental type coercion

```
function addFive(num) {
    return num + 5;
}

let result = addFive('hello') // result = hello5

```

```
function addFive(num:number) { ... } // would have fixed this problem in advance.

```

### Myths

It is not going to fix everything, won't fix bad code smells.

❌ No more runtime errors
❌ Code will run faster
JavaScript Ternary Operator
Tags: javascript, codenewbie
Published: 2019-10-30 03:00:34

In my learning of 'Control Flow' in JavaScript I ran into the Ternary Operator (or Condtional Operator). I find these to be just to cool not to write a little about them. 

The Ternary Operator is a real short way to choose between two things instead of using `if/else`. They a basically structured as: 

`condition ? if true : if false;`  The ? is your operator. 
So lets do an example. 

```
if (cheese === 'Yellow') {
 console.log("Got me some yellow cheese!");
 } else {
 console.log("Got me some moldy cheese!");
 } 
```

So doing the above if/else the "Ternary way" would look more like this. 

`cheese === "Yellow" ? console.log("Got me some yellow cheese!") : console.log("Got me some moldy cheese!");`

* So we have our condition - `cheese === "Yellow"`
* Our True - `console.log("Got me some yellow cheese!")`
* And our False = `console.log("Got me some moldy cheese!")`


I don't know why I love this so much. Well I do, it just makes things a bit simpler in my eyes. So give them a go if you haven't before. They are pretty fun. 

Cheers!
REACTIVE CONFERENCE 2019 LIVE STREAM DAY 1 🎥
Tags: webdev, react, graphql, javascript
Published: 2019-10-30 09:35:18

---
title: REACTIVE CONFERENCE 2019 LIVE STREAM DAY 1 🎥
published: true
description: 3-day functional programming conference based in the Central Europe with top-notch speakers & 1300+ attendees.
tags: webdev, react, graphql, JAVASCRIPT
cover_image: https://thepracticaldev.s3.amazonaws.com/i/ny0dsxn4eez3kcjggupq.jpeg
---

3-day functional programming conference based in the Central Europe with top-notch speakers & 1300+ attendees. Check out the Reactive Conference 2019 Live stream DAY 1.


{% youtube RSmo4KQhIgI %}

Follow me on [Instagram](https://www.instagram.com/panayiotisgeorgiou/)

That’s it for now. 

If you liked this article, then please subscribe to my YouTube Channel for video tutorials.

You can also find me on Twitter and Facebook.
riboSlim - Fett natürlich und gesund verbrennen
Published: 2019-10-30 10:50:19

Riboslim - Lassen Sie das Frühstück nie aus. Als sie euch sagten, dass es die wichtigste lebenswichtige Mahlzeit des Tages war, hatten sie mehr Recht, als sie erkannten. Nicht nur bietet es Ihnen die Energie, die Sie in Bezug auf Ihren Tag gehen möchten, ohne hungern ein paar Stunden in - oft zu einer Zeit und Ort, wo Sie finden sich snacking, anstatt eine Sache gesund und nahrhaft zu essen. 

Aber ein intelligentes (und vernünftiges) Frühstück hat sich als eines der wichtigsten effektiven Werkzeuge zur Gewichtsreduktion erwiesen. Sie verstehen nicht einmal alle Erklärungen, warum trotzdem. Einer der Gründe - ich vermute - ist das Ergebnis des Willens, dass Energie Energie nimmt. Und wenn Sie hungrig und kurios sind, dass Donut oder Cookie oder Stück Kuchen wird nur so viel attraktiver scheinen.


https://www.healthnutra.org/de/riboslim-rezension/

https://www.healthnutra.org/de/himbeer-ketone/
What is a Tech Lead Anyway?
Tags: leadership, team, career, mentorship
Published: 2019-11-19 11:32:14

It's quite hard to define the tech lead role in a short post. But, here it goes.

**Tech lead is a role, not a title.** Any software engineer can become the tech lead. And with the part, others will look up to this leader.

**The lead is the team liaison. The role shepherds change.** They focus on the future state. The rapid response. The pivots from management.

**Tech leads play the role of mentor and sponsor to others.** They setup code reviews in a collaborative way. They handle [discourse](https://uvwx.github.io/hierarchy.html). They partner with the product on feasibility, on a roadmap, priority, and estimations.

**They are accountable for the developer's experience**. The technical debt and engineering velocity. The tooling and onboarding friction. The testing, product domain, and holding philosophies to approaches.

**They write down the philosophies so that decisions are apparent.** They are the guide with respect — a leader who delegates as well as leads by example.

**Being a tech lead can be a challenge.** Managers pressure them to do the impossible. Priorities come to them in all directions. Their impact is good or bad, whether the team is [pathological or generative](https://changelog.com/posts/how-to-build-a-generative-engineering-culture).

**The lead is there to see the team succeed, to deliver.** Without internal injuries, with an orchestra of collaborative engineers rising.

**The brutality of being a tech lead is the demand for the individual's technical and management capability.** Even though companies have split these into two ladders, the role of tech lead has intractable attributes of both. It is impossible to separate.

**The team can blaze a path in the lead's absence.** Whereas the real drama happens in one's head, the pure emotion of the group occurs in front of the tech leads eyes. The lead follows through it and guides.

**They lead with a myriad of soft skills jujitsu**. With the technical tact unmatched. And if it all goes wrong, no worries. There are [marketing opportunities](https://www.youtube.com/channel/UC4xKdmAXFh4ACyhpiQ_3qBw).
Checking for vulnerabilities on your Java projects
Tags: java, security
Published: 2019-10-31 15:41:26

---
title: Checking for vulnerabilities on your Java projects
published: true
description: 
tags: [java, security]
---

A lot of developers I talk to, seem to think that security is someone else responsibility. The network guy, the security guy, someone that is not him or her.
I am no expert in security, but when I work on project, I like to believe that security is my responsibility too. And one small thing I can do, is to check the libraries I am using on my project against known vulnerabilities. I one is found, I try to upgrade it right away. If it is not possible for some reason, I am at least aware of the problem.


In a java project, you can add an owasp plugin, to your maven pom.xml:

```
<plugin>
	<groupId>org.owasp</groupId>
	<artifactId>dependency-check-maven</artifactId>
	<version>4.0.2</version>
	<configuration>
		<cveValidForHours>12</cveValidForHours>
	</configuration>
	<executions>
		<execution>
			<goals>
				<goal>check</goal>
			</goals>
		</execution>
	</executions>
</plugin>
```

That will show you an output like this:

```
One or more dependencies were identified with known vulnerabilities in test-project:

microprofile-rest-client-api-1.0.jar (org.eclipse.microprofile.rest.client:microprofile-rest-client-api:1.0, cpe:/a:rest-client_project:rest-client:1.0) : CVE-2015-1820, CVE-2015-3448
deltaspike-core-api-1.8.0.jar (cpe:/a:apache:deltaspike:1.8.0, org.apache.deltaspike.core:deltaspike-core-api:1.8.0) : CVE-2017-17837
libthrift-0.9.2.jar (cpe:/a:apache:thrift:0.9.2, org.apache.thrift:libthrift:0.9.2) : CVE-2015-3254
stagemonitor-tracing-elasticsearch-0.87.6.jar (org.stagemonitor:stagemonitor-tracing-elasticsearch:0.87.6, cpe:/a:elasticsearch:elasticsearch:0.87.6) : CVE-2014-3120, CVE-2015-1427, CVE-2015-5531, CVE-2014-6439, CVE-2015-3337
jaeger-core-0.22.0-RC1-okhttp381.jar/META-INF/maven/org.apache.httpcomponents/httpclient/pom.xml (cpe:/a:apache:httpclient:4.2.5, org.apache.httpcomponents:httpclient:4.2.5) : CVE-2015-5262, CVE-2014-3577
```

And that’s it.
Tech blog questions
Tags: discuss
Published: 2019-10-31 17:41:55

---
title: Tech blog questions
published: true
description: What makes a great tech blog?
tags: discuss
---

Hello! I hope you're having a great day! 😃

I'm currently working on redesigning / recreating my [tech blog](https://florin-pop.com) as I want to make it as perfect as possible for the readers and for that I need your help!

I have a couple of questions:
1. What do you like the most about a tech blog?
2. Which functionalities are "required" to have?
3. Do you have any examples of blogs you like? Why do you like them?
4. Any other "gotchas" I should be aware of?

Thank you for your time to read and answer this! 😊