teleren/devto huggingface dataset:
👨🏻‍💻 Demoing the GraphQL API for WordPress
Tags: graphql, wordpress, php, webdev
Published: 2021-04-22 14:25:39

Several weeks ago I talked about GraphQL on WordPress, for WordCamp India 2021. I explored these topics:

👉🏽 What is GraphQL?
👉🏽 How is it different from REST?
👉🏽 How do we use it with WordPress?

Alongside, I did a demo of the [GraphQL API for WordPress](https://graphql-api.com/) plugin. It's all me showing how to use the plugin in the wp-admin, for some 30 min.

Here is the video:

{% youtube LnyNyT2RwwI %}

The following features were covered:

✅ The GraphiQL and Voyager clients
✅ Persisted queries
✅ Passing parameters by URL to the persisted query
✅ HTTP caching
✅ Access control
✅ Making the API public and private

We also had a Q&A session, which lasted 15 min. Here is the video:

{% youtube -Z6PgfreTxg %}

The Q&A include the following questions, and at what time they appear:

❓ Will the hosting provider support GraphQL, or do we need to manage it on our own? _(1:25)_
❓ How extensible is it, compared to the WP REST API? _(1:55)_
❓ Is multilingual search supported in GraphQL? (answer is not clear, connection problems) _(2:39)_
❓ How do we secure the GraphQL API? _(3:48)_
❓ Why is the GraphQL API for WordPress plugin not officially available in the WordPress plugin repository? _(6:48)_
❓ What is the limit for GraphQL? _(8:08)_
❓ If somebody wants to dive into GraphQL, what's your advice for them? _(10:21)_
❓ What can we expect from you should you present a new talk about GraphQL in another WordCamp? _(12:08)_

As I mentioned at the end of the Q&A, if you like what you see, and you'd like to learn more, or get your hands dirty using it and need help, [send me an email](https://graphql-api.com/contact/) or [DM on Twitter](https://twitter.com/losoviz). I'm generally available, and always thrilled to work on the combination of WordPress and GraphQL 🙏

I hope you enjoy the demo 😀
Our Manifesto. Principles we at HireTester work by.
Published: 2021-04-22 14:25:35

=>Trust comes first. We build our cooperation with partners on trust. There is no place for a single brick of lie in such a foundation.
=>Sense of purpose. We don't work just to check the box. Our purpose is to provide QA services aligned with your business needs.
=>Timely results = Quality results. We don't work from 9 a.m. to 6 p.m. We strive for the best results within the agreed timeline.
=>Client focus and team spirit. We merge with your project as if it's our own and work to never ever fail the team.

https://hire-tester.com/
Full-Stack Web Developer
Tags: beginners, javascript, devjournal
Published: 2021-04-22 14:25:24

This is it. I'm finally a certified Full-Stack Web Developer. My journey started a while ago but I decided to "take it seriously" last year. I enrolled on the program offered by Career Foundry and I'm quite satisfied so far.

It's been hard to find a good balance between studying, working and making music and it was stressful at times. I would like to come back and review the projects I build during the course to get a better grasp, but I think it has been worth it so far.

I'm now looking forward to start my path and I already have some ideas in mind to get started.

Photo from https://unsplash.com/@markusspiske
Levels of functional testing or when to test your software
Tags: testing
Published: 2021-04-22 14:24:31

With the different stages or levels of the software development life-cycle, testing can be performed on unit, integration, system, or acceptance levels.

- Unit testing helps to verify independent system components as for how they cope with the assigned tasks.

- Conducting integration testing, QA specialists focus on the connections between functional blocks, the degree of their interaction with each other, the connection order, fault tolerance, and the impact they have on the system functioning. The key goal here is to verify the components' interaction and the operation of the functional subsystems.

- System testing is run on the system level to check the entire system operation and whether the product fulfills the tasks it was created for.

- Finally, acceptance testing is done to check software for acceptability, define its compliance with the business requirements, and readiness for the final release stage.

https://hire-tester.com/
Customize Laravel Stubs and save a lot of time
Tags: laravel
Published: 2021-04-22 14:23:02

**Did you know that it's possible to customize Laravel stubs, so you can make a new controller, and it will be created in your own way?**

## Video in Spanish 🇪🇸
{% youtube AxbxuV8hMuA %}

## Publish and customize your stubs
The first thing that you have to do to customize your stubs it's publishing the default templates that comes with Laravel. You just need to run this artisan command:

```bash
artisan stub:publish
```

This will generate a new folder in `resoureces/stubs` with all the default templates.

In that folder you can change any of them and it will be used every time you run an artisan make command of any kind.

## How to create your own crontollers?

With each file type we have only one option, buy with controller we can create as much as we want. As you can see we can find a lot of `controller.{type}.php` files in the stub folder. We can customize each of them or create new ones.

For example, if we create a `controller.custom.php` then we can use this stub with:

```bash
artisan make:controller  UserController --type=custom
```
How to generate a random ID in JavaScript without a library
Tags: javascript, quick, tips
Published: 2021-04-22 14:19:22

I'm sure this is posted in a ton of places already but I thought I would share a method I sometimes use to generate random strings of (numbers + letters) with javascript. This function returns the first 6 characters of a randomly generated string. Passing 36 to the toString method tells it to return numbers 0-9 and every letter in the alphabet, you can adjust the 6 in the substr method if you want a longer or shorter ID.

```js
const id = function() {
  return Math.random()
    .toString(36)
    .substr(2, 6);
};
```
Laravel Passport API Authentication Example
Tags: laravel, passport
Published: 2021-04-22 14:15:06

Today, in this tutorial we are share with you hhow to use laravel passport authentication in your laravel application. Laravel already provide simple auth system for web. but what about APIs? APIs basically use token for authentication. when any user login thenn generate one tocken and it is use for authentication purpose. so, laravel provide Passport for APIs authentication.

How to use Passport in laravel for built RESTful APIs and how to configure in laravel application. here we are expain all things in step by step in very easy way and with example.

In this tutorial we are built following APIs service using Passpost

1. Register API
2. Login API
3. Get User Details API

Simply follow this step and you can easyly integrate Passport in your laravel application. [See details](https://www.codecheef.org/article/laravel-6-create-api-authentication-using-laravel-passport
)
Enter date easily with react-native-datefield
Tags: reactnative, react, beginners, typescript
Published: 2021-04-22 13:57:45

![react-native-datefield](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fivbnsqivwqru4ey3kzn.png)
In the course of implementing a few projects, I have found that users who use the selection date function in applications often have difficulty choosing years in the past.

Hence, I developed  the [react-native-datefield](https://github.com/tuantvk/react-native-datefield) library to make it easier for the users to enter date data.
The `react-native-datefield` library has great support in terms of both user interface and functional performance. It validates the entered date data, leap years, allows customization of layout input and returns errors if the user enters incorrect data.

## Components:
- DateMonthYearField
- MonthDateYearField
- YearMonthDateField

## Usage

```js
import DateField from 'react-native-datefield';
```

or

```js
const DateField = require('react-native-datefield');
```

```js
<DateField
  labelDate='Enter date'
  labelMonth='Enter month'
  labelYear='Enter year'
  defaultValue={new Date()}
  styleInput={styles.inputBorder}
  onSubmit={(value) => console.log(value)}
/>

<MonthDateYearField
  styleInput={styles.inputBorder}
  onSubmit={(value) => console.log('MonthDateYearField', value)}
/>

<YearMonthDateField
  styleInput={styles.inputBorder}
  onSubmit={(value) => console.log('YearMonthDateField', value)}
/>

const styles = StyleSheet.create({
  inputBorder: {
    width: '30%',
    borderRadius: 8,
    borderColor: '#cacaca',
    borderWidth: 1,
    marginBottom: 20,
  },
});
```

View more example [App.tsx](https://github.com/tuantvk/react-native-datefield/blob/master/example/src/App.tsx).

My repo on [Github react-native-datefield](https://github.com/tuantvk/react-native-datefield)

Thanks for reading !
How does HTTPs work?
Tags: https
Published: 2021-04-22 13:56:44

Here is the basic algorithm of how HTTPS work:

1.Browser hits website protected by HTTPS
2.Server sends digital certificate
3.Browser extracts public key from certificate
4.Browser creates a session key
5.Browser encrypts the session key using the public key and sends it to server
6.Server decrypts session key using its private key
7.Browser sends requests encrypted with the session key
8.Server sends responses encrypted with the same session key

A detailed explanation:

https://fullstackdeveloper.guru/2021/04/22/how-does-https-work/
Weirdness with TextRange2 objects inside PowerPoint Tables
Tags: vba, powerpoint
Published: 2021-04-22 13:46:21

I was working with `TextRange2.BoundLeft` and `TextRange2.BoundTop` when I noticed the behavior of those 2 properties is different depending on whether the `TextRange2` is in a normal `Shape` object or inside a table. For TR2s inside normal `Shape` objects, `.BoundTop` and `.BoundLeft` give the distance from the top and left sides of the slide, but for TR2s inside tables, they give the distance from the top left corner of the table.

That should be easy to fix, right? All you have to do is get the `Shape` object for the table containing the `TextRange2` in question, then add its `.Top` and `.Left` to the `TextRange2`'s `.BoundTop` and `.BoundLeft`. 

But there's another challenge here. Getting the table `Shape` object containing the `TextRange2` you already have.

Normally, PowerPoint `TextRange2` objects have a property `.Parent` that you can use to go up the presentation DOM to the `TextFrame2` that contains them, and likewise `TextFrame2` objects have a property `Parent` that lets you access the shape that contains them ... except if the `TextRange2` object is inside of a table. Then it has no `Parent` property. Even trying to test if `.Parent is Nothing` triggers an error.

The only workaround I know of is to select the `TextRange2` object in question (using the `.Select` method), then get the `Shape` that contains the `TextRange2` from `ActiveWindow.Selection.ShapeRange(1)`. Unfortunately, that only gets you halfway there, to the cell `Shape` object containing the `TextRange2`. Also, while the cell Shape object's `.Parent` property works, it behaves counterintuitively; it returns the `Shape` object that contains the entire table.

To get to the `Shape` object for the table, you have to use the `.Select` trick again, this time calling it on the `Shape` object for the cell. Then `ActiveWindow.Selection.ShapeRange(1)` gets you to the `Shape` object for the table.

Code looks like something like the following to get the table. In my application I have this split across a couple of functions with error handlers and a selection buffer to restore whatever was originally selected before the function calls.
```
Public Function GetTableShapeAncestorOfTR2(ByRef tr2 As TextRange2) As Shape
    Dim cellShape as Shape
    tr2.Select
    Set cellShape = ActiveWindow.Selection.ShapeRange.Item(1)
    cellShape.Select
    Set GetTableShapeAncestorOfTR2 = ActiveWindow.Selection.ShapeRange.Item(1)
End Function
```
Own your code!
Tags: beginners, career, hiring, showdev
Published: 2021-04-22 13:43:17

Hello,

It all started with this simple post on LinkedIn: https://www.linkedin.com/posts/activity-6788719786659524608-Gww8

Own your code! ✔️
Say what? 🔥

If you are in the middle of interviewing or have been recently and you gave your best and worked extra, and your work wasn't paid, then think about re-using that initial effort and make it public for others to see. If you didn't sign an NDA, didn't get paid for that take-home project, well... firstly, I know the frustration, and secondly, the code is yours. Be blond, share it out and loud for future you and other companies. I don't care if you started coding last month or 20 years ago; share your work. Don't let the take-home tests be forgotten somewhere. A lot of them are quite similar, so maybe next time you can leverage that and say "Hey, I already did one similar, take a look at that, please".


Let's share our take-home projects. 
These are my latest (didn't keep old ones): https://tinyurl.com/kx7b3p5w 
Looking forward to seeing your projects in the comments.
Show tooltip when selecting item on asp:DropDownList
Tags: javascript, html, csharp
Published: 2021-04-22 13:30:17


This is my frontend code. If I select the dropdown list text, I can not show the full text in dropdown. so I need to display a tooltip of the selected value when a dropdown item is being selected (i.e. when the dropdown is shown and an item is being hovered over), preferably only when the text for that item is being truncated.
<!---
<div id="TextBox_Job" runat="server" Visible="False">
                <asp:DropDownList ID="RelatedJob" runat="server" Width="200" Title="Job Titles"/>
</div> --->

How can I handle this Asp/C#/JavaScript/Jquery, Can you please help me to solve this problem.....
How to Deploy Angular application on Heroku hosting with Git repository
Tags: angular, git, heroku, deployment
Published: 2021-04-22 13:29:20

https://grokonez.com/frontend/angular/angular-deployment/how-to-deploy-angular-application-on-heroku-hosting-with-git-repository

How to Deploy Angular application on Heroku hosting with Git repository

In the tutorial, we show you how to automatically deploy Angular application on Heroku hosting with Git repository.

Related post:
– <a href="https://grokonez.com/frontend/angular-6-dynamic-navigation-bar-add-remove-route-dynamically">Angular 6 dynamic Navigation Bar – add/remove Route dynamically</a>

<!--more-->
<h2>Technologies</h2>
- Angular
- Git
- Heroku
<h2>Goal</h2>
We use Heroku Hosting to deploy Angular application ->

<img src="https://grokonez.com/wp-content/uploads/2018/12/deploy-angular-application-on-heroku-hosting-deployment-successfully.png" alt="deploy-angular-application-on-heroku-hosting---deployment-successfully" width="471" height="264" class="alignnone size-full wp-image-15977" />

- Video guide ->

<iframe width="853" height="480" src="https://www.youtube.com/embed/4W0WN39d5YM?rel=0" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<h2>Practice</h2>
<h3>Create Heroku App</h3>
Login to <a href="https://www.heroku.com/">Heroku</a>, and create an app <strong>grokonez-angular-app</strong>:

<img src="https://grokonez.com/wp-content/uploads/2018/12/deploy-angular-application-on-heroku-hosting-create-app.png" alt="deploy-angular-application-on-heroku-hosting-create-app" width="667" height="514" class="alignnone size-full wp-image-15978" />

<img src="https://grokonez.com/wp-content/uploads/2018/12/deploy-angular-application-on-heroku-hosting-create-app-step-2.png" alt="deploy-angular-application-on-heroku-hosting-create-app-step-2" width="657" height="490" class="alignnone size-full wp-image-15979" />
<h3>Commit Angular to Git Repository </h3>
- Create an Git repository: <code>angularheroku</code>.

- Download sourcecode & unzip:

<pre><code class="language-javascript">
wget "https://grokonez.com/wp-content/uploads/2018/12/AngularDynamicRoutes-2.zip"
unzip AngularDynamicRoutes-2.zip
</code></pre>

- Commit Angular application to Git repository:

<pre><code class="language-javascript">
git init
git remote add origin https://github.com/grokonez/angularheroku.git
git add .
git commit -m "initial commit"
git push -u origin master
</code></pre>

<img src="https://grokonez.com/wp-content/uploads/2018/12/deploy-angular-application-on-heroku-hosting-push-sourcecode-to-git.png" alt="deploy-angular-application-on-heroku-hosting---push-sourcecode-to-git" width="652" height="371" class="alignnone size-full wp-image-15980" />

*Note: We don't push the <code>node_modules</code>, in <code>.gitignore</code> we have:

More at:

https://grokonez.com/frontend/angular/angular-deployment/how-to-deploy-angular-application-on-heroku-hosting-with-git-repository

How to Deploy Angular application on Heroku hosting with Git repository
Follow up on "Never leave your email address raw in the mailto link!" 
Tags: angular, webdev, html, security
Published: 2021-04-22 13:26:33

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/w4euk3nkosa8hk305xqr.png)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6vn56onl54he3q2lo71d.gif)

Look carefully at the above *.png and *.gif, they speak for them self. 

Why this post? Accept it as a follow-up on Naseki's one (https://dev.to/naseki/tip-never-leave-your-email-address-raw-in-the-mailto-link-here-s-what-to-do-instead-1c70). Give her a '&#128077;', she deserves it!  

I expect, bots, scrappers or other nasty things, won't going to be too intelligent enough to mimic 'mouse' movements in the nearer future. Eventually, they will! Hopefully, there will be time enough to counteract. Let me know, if my 'grey wig' assumption is already outdated.
Nginx: How to redirect JS/CSS HTTP links to other domain?
Tags: nginx
Published: 2021-04-22 13:16:35



I have few HTTP links to the js/css files. I wanted to redirect it to other location. Example provided below:

Redirection from:

https://ex.example.com/js/file1.js

https://ex.example.com/css/file2.css

https://ex.example.com/css/folder1/file3.css

Redirection to:

https://ex2.example.com/js/file1.js

https://ex2.example.com/css/file2.css

https://ex2.example.com/css/folder1/file3.css

I have tried below settings in nginx.conf. But its not working.

server {
    listen       443 ssl;
    server_name ex.example.com;

    location / {
       return 301 https://ex2.example.com;
    }
    location ~* \.(css)$ {
        root https://ex2.example.com/css;
    }
    location ~* \.(js)$ {
        root https://ex2.example.com/js;
    }
    #location /css/ {
    #   return 301 https://ex2.example.com/css;
    #}
    #location /js/ {
    #   return 301 https://ex2.example.com/js;
    #}

    ssl_certificate      /etc/ssl/ssl-bundle.crt;
    ssl_certificate_key  /etc/ssl/myserver.key;
    client_max_body_size 5M;
    ssl_prefer_server_ciphers   on;

  }
}
Please help me with this.
Front-end Senior Software Engineer
Tags: javascript, typescript, react, offers
Published: 2021-04-22 13:13:12

Hi everyone!
Iaso AI is looking for a Front-end Senior Software Engineer.
Iaso AI, a growing machine learning medical platform.
 
Skills and experience needed: 5+ years of experience - Software development, TypeScript, Javascript and Frontend, 3+ years of experience - React.js.
Language(s) required: English - Conversational.
Location: Remote - USA.
Compensation: USD$120K - 180K/year.
 
You can apply easily using the following link: https://jobs.torre.co/3xpeyOP
If you don't have a Torre account yet, I can help you set it up and then submit the application for you.
Reach out to me with your CV and email if you’d like my help.
Solve the scenario - using Delegates & Interfaces in Dotnet
Tags: dotnet, csharp, delegate, interface
Published: 2021-04-22 13:13:09

# Use Case:

We have this hypothetical reporting system where 2 entities are involved **Report Generator** & **Report**.

**Report Generator**:
1. Report generator would have a single behavior. 
   * It should take 2 inputs as integers.
   * It Returns a string back as an output which is basically the report presentation.

(So, basically above 2 point forms the contract that need to be fulfilled by any report generator)

**Report**:
1. Report should take report generator object or report generation logic in the form of function as an input.
2. Give call to the report generator by passing input1 & input2.
3. Get the string Output back from generator.
4. Will have the functionality to write the Output to console or file system.

Whenever, I introduce a new Report Generator, neither Report entity nor existing Report Generator's, should be modified.

Take a pause

Think about the solution

# ?

Think again

Scroll down for the solution 

...

...

...

...

...

...



                       
# Solution

Run the below code in Linqpad (https://www.linqpad.net/), to see it working.

{% gist https://gist.github.com/debashish2014/7a99aa0bc595ffd4e9b9045cb74e9305 %}

# Motivation

Generally every one understands the theoretical aspect of Delegates and Interfaces, but when it comes to actual use of the same, beginner's lacks the understanding of when such constructs need be used and in which scenario. This problem based illustration might be of some help to understand the concept better.

Happy Coding !!
Top 5 TypeScript meetup videos in March
Tags: typescript
Published: 2021-04-22 13:06:51

Greetings,

After [February’s TypeScript selection](https://blog.meetupfeed.io/typescript-videos-february-2021/), we’re back with more! Check out our [latest roundup](https://blog.meetupfeed.io/typescript-meetup-videos-march-21/) of exciting dev and meetup videos from the TypeScript community from March below!

[TypeScript Dependency Injection with tsyringe](https://meetupfeed.io/talk/typescript-dependency-injection)
Learn how to use dependency injection in a TypeScript application using tsyringe as a dependency injection container.

We will be creating a REST API using NodeJS & Express. We will be doing this using classes in TypeScript. Each of these classes will use dependency injection so we can pass their dependencies into their constructors. We will then use tsyringe as

[TypeScript latest version features](https://meetupfeed.io/talk/typescript-latest-version)
Typescript 4.2 is here already!! WHAT!!! Released on February 23, 2021, it came out with a lot of new features and improvements. Moreover, there are a few breaking changes as well that you need to take care of!


[Learning TypeScript with Vue.js 3](https://meetupfeed.io/talk/typescript-vue-3)
TypeScript with Vue.js 3 can make you a super productive! I this video I discuss how to setup Vue.js 3 with TypeScript, how to create types and interfaces and how to convert from the Options API to the Composition API.


[TypeScript for React and Effector](https://meetupfeed.io/talk/typescript-react)
Continuing on with Typescript we are starting a series on React state management where we take the same To-Do list and implement it using a bunch of different state managers. This time we are looking at MobX!


[GraphQL and TypeScript](https://meetupfeed.io/talk/graphql-and-typescript)
Talks:

Building client applications with GraphQL and Apollo Client by Marlon Rodrigues

Faster, Safer, Cleaner: How TypeScript can help your React applications scale by George Kemp