teleren/devto huggingface dataset:
Hover scroll portfolio, reCAPTCHA form | Module Monday 64
Tags: showdev, githunt, webdev, javascript
Published: 2019-11-18 23:00:36

---
title: Hover scroll portfolio, reCAPTCHA form | Module Monday 64
published: true
description: Module Monday 64
tags: showdev, githunt, webdev, javascript
cover_image: https://res.cloudinary.com/component/image/upload/b_rgb:ffffff,c_lpad,h_350,w_800/v1573698448/screenshots/slide-cards.gif
canonical_url: https://guide.anymod.com/module-monday/64.html
---

## Open source modules 
These modules can be used on any website, web app, or anywhere else. There are hundreds more like these built & shared on [AnyMod](https://anymod.com).

Click a mod to see it along with its source code.

## Hover scroll portfolio
Cards to display your work.
<a class="btn btn-sm" href="https://anymod.com/mod/portfolio-cards-with-auto-scroll-preview-balmna">View mod</a>
<a href="https://anymod.com/mod/portfolio-cards-with-auto-scroll-preview-balmna">
  <img src="https://res.cloudinary.com/component/image/upload/v1573698448/screenshots/slide-cards.gif"/>
</a>

## Transitive intro
Simple hero unit that fades in on page load.
<a class="btn btn-sm" href="https://anymod.com/mod/hero-raodab?preview=true">View mod</a>
<a href="https://anymod.com/mod/hero-raodab?preview=true">
  <img src="https://res.cloudinary.com/component/image/upload/v1573698447/screenshots/transitive-intro.gif"/>
</a>

## reCAPTCHA form
Contact form that prevents spam with a reCAPTCHA.
<a class="btn btn-sm" href="https://anymod.com/mod/contact-form-with-recaptcha-edlbn">View mod</a>
<a href="https://anymod.com/mod/contact-form-with-recaptcha-edlbn">
  <img src="https://res.cloudinary.com/component/image/upload/v1573698441/screenshots/reCaptcha.gif"/>
</a>

## Image display
Show off your visuals with this responsive mod.
<a class="btn btn-sm" href="https://anymod.com/mod/caminar-image-display-alrrdn?preview=true">View mod</a>
<a href="https://anymod.com/mod/caminar-image-display-alrrdn?preview=true">
  <img src="https://res.cloudinary.com/component/image/upload/v1573698442/screenshots/images.png"/>
</a>

## Footer with links
Reusable footer to add links anywhere you need them.
<a class="btn btn-sm" href="https://anymod.com/mod/footer-with-links-ordnll?preview=true">View mod</a>
<a href="https://anymod.com/mod/footer-with-links-ordnll?preview=true">
  <img src="https://res.cloudinary.com/component/image/upload/v1573698440/screenshots/footer.png"/>
</a>

<hr>

I post new mods from the community [here](https://dev.to/tyrw) every (Module) Monday -- I hope you find them useful!

Happy coding ✌️
Arcology Roguelike Lifestream E1
Tags: unity3d, roguelike, livestream, gamedev
Published: 2019-11-16 21:23:29

# Episode 1: Planning
Here I introduce the game I want to build, the tools I want to use and the process I'm going to follow as well as doing some basic planning. 
{% youtube bdwgC2cEZf0 %}
Multiple Authentication in laravel 6x
Tags: laravel, php
Published: 2019-11-18 07:24:24

i have installed laravel default authentication system (using php artisan ui react --auth) which is best for me but i have created different table for user role and make relationship between user and role table and create new table called role_user but i am unable to redirect a different page based on user role in roles table. So, my question is how to redirect pages for different user based on role? I couldn't change the default /home page, in my condition all user role redirected to same /home page.
Improving our periodic code scheduler
Tags: javascript, scheduler, async
Published: 2019-11-20 16:05:40

[Previously](https://dev.to/lvidakovic/run-code-periodically-using-promises-j09), we constructed a pretty simple and naive system that periodically runs a function. Not great, not terrible. Let's try to make it better one step at a time. Main drawback was that there was no way to stop it, but we'll get there. First, we are going to move some logic to an [async generator](https://dev.to/jfet97/javascript-iterators-and-generators-asynchronous-generators-2n4e). They work great with infinite streams. Our driving logic is basically an infinite stream of events that happen at a specified amount of time. We'll move the part that generates pause events to an async generator, while the loop will slightly change it's face and become a bit slicker to use, even though it might also need a refactor in the future.

From previous code:


```javascript
const pause = time => new Promise(resolve => setTimeout(resolve, time))

async function runPeriodically(callback, time) {
  while (true) {
    await callback()
    await pause(time)
  }
}

```

And it's usage:

```javascript
function logTime() {
    const time = new Date()
    console.log(time.toLocaleTimeString())
}

runPeriodically(logTime, 2000)
```

We move pause generation to an async generator and tweak the iterating loop:

```javascript
async function* cycle(time) {
    while(true) {
        yield pause(time)
    }
}

async function runPeriodically(callback, time) {
    for await (let tick of cycle(time)) {
        await callback()
    }
}
```

*runPeriodically* function can still be used exactly the same and is still with the fundamental problem of not being able stop the loop once it's been started. But the loop now only worries about the actual code that runs on every iteration, while async generator implements rudimental logic to yield pause events. Generators offer some unique set of features that allow them to communicate back and forth with the rest of the code and that's something we'll use to construct a more robust mechanism. Upcoming posts will provide several tweaks and fixes that give greater control over this kind of code runner.
doing more faster...
Published: 2019-11-21 03:18:14

---
title: doing more faster...
published: true
description: 
tags: 
---

What is the best way to run a program in parallel?

Just run two copies of it at the same time. :)

But that works. 

And more often than not it is the easiest and most useful form of doing twice the work for the least cost. If you wrote your program that it takes input from a file or from the command line then running it twice will only cost you the time to write the bash script that runs it that way.
📷 More on Screenshots with JavaScript in Node.js (creating PDFs)
Tags: javascript, webdev, puppeteer
Published: 2019-11-25 07:40:01


In the [previous example](https://dev.to/benjaminmock/how-to-take-a-screenshot-of-a-page-with-javascript-1e7c) we created a png screenshot. But we can also generate PDFs in various formats!

```js
// instead of calling await page.screenshot we now call
await page.pdf({
    path: 'codesnacks.pdf',
    format: 'A4'
})
```

For completeness, here's the full code to generate a PDF of a webpage in the A4 format:

```js
// npm i puppeteer
const puppeteer = require('puppeteer');

// we're using async/await - so we need an async function, that we can run
const run = async () => {
  // open the browser and prepare a page
  const browser = await puppeteer.launch();
  const page = await browser.newPage();

  await page.goto('https://codesnacks.net/');

  await page.pdf({
    path: 'codesnacks.pdf',
    format: 'A4',
  });

  // close the browser
  await browser.close();
};

// run the async function
run();
```
Open / Closed Principle
Tags: solid, java, ocp
Published: 2019-11-26 15:19:36

---
title: Open / Closed Principle
published: true
description: 
tags: solid, Java, ocp 
---

The open closed principle is the **O** in the SOLID principles. It was created by Bertrand Meyer and states: 

> Software entities should be open for extension, but closed for modification

Let's dive deeper with an example. 

We've been tasked with creating a platform that merges all video streaming sites. The platform will be able to add a platform to its list of platforms, search for a video on all platforms and play a video from the search results. The class can look like so: 

{% gist https://gist.github.com/Naomi-Dennis/4be0394ca15f33f4a37c881af0761a2c %}

`CentralVideoStreamingPlatform` covers most mainstream video streaming platforms. However, if we were to add another platform, say `DisneyPlus`, another `#add()` would be created. This directly violates the open for extension aspect of OCP.`CentralVideoStreamingPlatform` must be open to accept different details without needing to change code that's already written. By overloading `#add()` _again_, we are needlessly changing `CentralVideoStreamingPlatform`. Who's to say how many `#add()` `CentralVideoStreamingPlatform` would have as more streaming platforms are added? 

To ensure `CentralVideoStreamingPlatform`'s extensibility, we can refactor the video streaming classes to implement a `VideoStreamingPlatform` interface and use one `#add()`. 

{% gist https://gist.github.com/Naomi-Dennis/aa110c6258887f0209bf9c7ebe250be5 %}

### In Conclusion 

The open closed principle is a great principle to keep in mind when writing classes.
Hyper.js for Windows 10
Tags: webdev, devops, cli
Published: 2019-11-25 23:03:01


Hyper is a HTML/CSS/JS terminal with awesome and extensible interface I like to use.

> _The goal of the project is to create a beautiful and extensible experience for command-line interface users, built on open web standards. In the beginning, our focus will be primarily around speed, stability and the development of the correct API for extension authors._

In this post I will describe how to install Hyper for Windows OS.

### 1 step:

Download Hyper from official [Website](https://hyper.is/)

### 2 step:

Assuming you have [git-bash](https://gitforwindows.org/) installed hit up `ctrl + ,` and you are inside the .hyper.js (probably it is in `C:\Users\YOURUSERNAME`):

### 3 step:

Find these lines:

```
// the shell to run when spawning a new session
// if left empty, your system's login shell will be used by default
shell: '',

// for setting shell arguments
// by default ['--login'] will be used
shellArgs: ['--login'],
```

Then change above code to:

```
// the shell to run when spawning a new session
// if left empty, your system's login shell will be used by default
shell: 'C:\Program Files\Git\usr\bin\bash.exe',

// for setting shell arguments
// by default ['--login'] will be used
shellArgs: ['-i'],
```

### 4 step:

We are still in hyper.js config file and let's add another code (you can add this code just below 3 step):

```
   // for environment variables
   env: { TERM: 'cygwin' },
```

### 5 step:

Add if hyper is in _user variables_:

**Computer -> Properties -> Advanced -> Environment variables**

To add path you need to click on `New...` button. Then in appeared windows set following data:

```
variable name: Path
Variable value: C:\User\your_user_name\AppData\Local\hyper\app-2.1.2\resources\bin
```

### 6 step:

First you need to create a .bashrc file in your user folder.

- First variant: simply type: `cd ~ && touch .bashrc`

- Second variant: you can go to `C:\Users\YOURUSERNAME` and create this file by right click

### 7 step:

Check if version is corresponding in `.bashrc` file (probably it is in `C:\Users\YOURUSERNAME)`.

Should be something like that:

```
export PATH=\$PATH:~/AppData/Local/hyper/app-2.1.2/resources/bin
```

> _Please pay attention to version. You can control version you downloaded in AppData folder. But usually on computer this folder in hidden. So that to open it you can type in folder address bar:_
>
```
C:\Users\YOURUSERNAME\AppData\Local\hyper
```

>

### 8 step:

- Lets install Hyper type plugin (after installing - restart Hyper):
  in Hyper type:

  ```
  hyper install hyperborder
  ```

- Install theme:
  ```
  hyper install hyper-snazzy
  ```

Link to dive deeper:
[Official website of Hyper](https://hyper.is)

That's it!

Congratulations! You have a Hyper CLI on your computer.
Install Vue JS with Laravel 6
Published: 2019-12-02 04:05:01

---
title: Install Vue JS with Laravel 6
published: true
date: 2019-11-26 04:02:18 UTC
tags: 
canonical_url: https://www.itsolutionstuff.com/post/laravel-6-install-vue-js-exampleexample.html
---

HiIf you are dont know how to install vue js in laravel 6 then i will help you to laravel install vue js using laravel ui we will also install vue with laravel and also laravel 6 vue auth using laravel uiIf you are beginner with laravel 6 then i am sure i can help you to install vue in larav
Hacktoberfest - Opensource worldwide and local
Published: 2019-11-26 12:27:46



I am working at KNP Labs as people manager and project facilitator. We create and contribute to several **F**ree and **O**pen **S**ource **S**oftware projects, like [Bundles for Symfony](http://knpbundles.com/) and latest, some js/react libs. 
Even if I do not code anymore, I still care a lot for open source projects and it's a strong value for me, that the company for which I am working, is contributing and sharing with the community. 

This is a translation into English of my blog post of our company website : [KNPLabs.com](https://knplabs.com/en/blog/hacktoberfest-opensource-mondial-et-local)

Here we go ! 

As part of the [TURFU festival](https://turfu-festival.fr/agenda/) at ["Le Dôme"](http://ledome.info/), we organized a Hacktoberfest evening with our local dev association the ["Caen Camps"](https://www.caen.camp/). 

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


## Worldwide 
The [Hacktoberfest](https://hacktoberfest.digitalocean.com/) is a worldwide day to promote open source projects on github. The participation is impressive: 92,132 participants registered, with 482,182 participating in the open source projects. The companies Digtial Ocean and the Dev.to website sponsor worldwide stickers and T-Shirts for all those who make at least 4 PRs [pull request - what is a PR?](https://dev.to/kulkarniankita9/the-art-of-humanizing-pull-requests-prs-2238). 

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

## Local 
KNP Labs already contributes to open source projects and we wanted to introduce the open source community to developers at Caen (Normandy, France) and also propose to make common projects for those who are already experienced contributors. 

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

"Le Dôme" welcomed us during the fabulous TURFU festival and the CaenCamps were co-organizers with us. We were about 20 attendees, with 8 people who never contributed. 

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

KNP Labs sponsored the local brewery La Caenette ;-) and some pizzas were also on hand.  

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


To learn more, [Digital Oceans Hacktoberfest](https://hacktoberfest.digitalocean.com/faq) website is really great ! 

See you next year !

Thanks to all the participants, [Lena](https://github.com/lcouellan), [Antoine](https://github.com/AntoineLelaisant) and [Eve](https://github.com/eveyonline) for co-organizing the event. Want to help with contributions? Send us a [hello on twitter](https://twitter.com/KNPLabs).
Trigger local jobs for testing in Jenkins with github
Tags: local, jenkins, github, automation
Published: 2019-11-26 11:36:41

---
title: Trigger local jobs for testing in Jenkins with github
published: true
description: 
tags: #local #jenkins #github #automation
---

0.Expose local jenkins to the internet by ngrok

Currently in our Jenkins setup, we're deploying and working in local machine and not expose this to the internet.

So in order for github can access to the local Jenkins, we would need some tool to expose Jenkins to the outside world.

Here is how it works with ngrok tool.

You can download ngrok tool from the official site: [ngrok site](https://ngrok.com/download)

After download and install, if you want to expose some local site to the outside, you need to specify the port and run the following command:

As in Windows : ngrok.exe http 8080 (example for port 8080 which is default port of Jenkins)

After that, you can use the following example address for working with github: https://27698b0d.ngrok.io

1.Setup webhooks

In order for Jenkins to know when there is any code change in github, you need to set the webhook.

Following is how to do it with github.

First, go to your dev repository → Choose webhooks
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/fm3ln7mo2to7k3e6wbpl.PNG)

Click on Add webhook button, setup as the following:

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

Then choose Add→ If the icon is set to green, you're good to go (big grin)

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

2.Setup job build in Jenkins

Now it comes to Jenkins part.

First, you need to add Jenkins Job → Choose Configure

Set the source code management for git repository like below:
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/86vy1zo91xn1km5tgnt8.PNG)

In the build trigger, set github poll for activate job when there is code changed in the repository:
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/2egb2i2xrewbe5s2bx0v.PNG)

That's it.
Thanks for reading.
Hope this helps.
Launching - Tech Video Podcast 🎤 🎧 📹 ! Made with ❤️ in Berlin, Germany 🇩🇪
Tags: javascript, react, podcast, csharp
Published: 2019-11-26 14:02:27

Hello world and Hello Everyone :wave:

<h4>Wow, I am super excited to announce this 😱 </h4>

Winter is coming with Darkness and sadness 😰

And in this Winter, I am planning to start a Podcast 🎤 to make the Winter a bit better :heart:

We will go LIVE on Youtube so that every one of you can interact in realtime and ask questions on the go.

[<h3>Please SUBSCRIBE to the Youtube Channel here :point_right:</h3>](https://www.youtube.com/channel/UCy5EgfydCQlVv_AM-FZyYcg)


{% youtube PtaziLK3xZE %}


[<h3>Please also LIKE the Facebook Page here :point_right:</h3>](https://www.facebook.com/the.destro.dev.show/)
On.NET Episode: Exploring the new Azure .NET SDKs for .NET
Tags: dotnet, azure, cloud, programming
Published: 2019-11-26 15:49:10

In this episode, we're joined by Adrian and Alex from the Azure SDK team who have come to talk to us about the new iteration of Azure SDKs they've been working on. They'll discuss things like what's different with this batch of SDKs, support for distributed tracing, and even give us a demo of what the .NET SDK looks like.

{% youtube Hxne-iM1CtI %}

If you liked this video and would like to see some more of our .NET content, please subscribe to our [.NET Developers YouTube Channel](https://www.youtube.com/channel/UCvtT19MZW8dq5Wwfu6B0oxw).


## Useful Links
* [Azure SDK Releases](https://azure.github.io/azure-sdk/index.html?WT.mc_id=ondotnet-c9-cephilli)
* [Previewing Azure SDKs following new Azure SDK API Standards](https://azure.microsoft.com/blog/previewing-azure-sdks-following-new-azure-sdk-api-standards/?WT.mc_id=ondotnet-c9-cephilli)
* [OpenTelemetry](https://opentelemetry.io/)
* [Azure Monitor Docs](https://docs.microsoft.com/azure/azure-monitor/overview?WT.mc_id=ondotnet-c9-cephilli)
My reflections on Andela’s EPIC values
Published: 2019-11-26 21:11:55

For the first time I heard Andela’s EPIC values (Excellence Passion Integrity and Collaboration), I was just understanding them as they are. In the first two weeks of home study, I started to realize how Andela’s EPIC works, and how they should be implemented.  Most of the time many people finish and submit works because it has to be completed. This is also true, but the key points to keep in mind is that what will be the output or result of the work, how long will it be used? 

The way I take Andela excellence in the EPIC values is the mindset of having the big image of the work that you are working on and implement it by thinking about the final result. That time the quality of your work will meet the standards needed for your deliverable. Again this EPIC means that you are identifying the areas that you are good at, which shows you where you could be improved for the next iteration of the work. If you allow yourself to just do what is on your to-do list, it will be harder to find the time to think and have the big picture of your work.

Passion, passion could be defined as sacrificing your time and leave your comfort zone, and do what you are passioning about.  If you are doing that, it’s your real passion, and if not, probably it’s not your real passion. You need to start making changes in your passion. I do believe that you can have passion to do something that you have never tried to do, but that belief will help you to make it the time that you will be having access to materials or resources in those particular areas you are passionate about. And it is normal that someone can fail for the first time while trying to do something, but that will be a part of learning.

Integrity means doing the right things in a good way, not because somebody is watching you, just because it’s how things are supposed to be. It's a personality that needed by everyone to deliver complete work with all requirements for it to be perfect. This is also another important thing that I found at Andela, where they set requirements for you, and then you do your best to include some additional functionality that did not capture on the to-do list. This is the best practice to make culture so that anyone who works with you will wish again to come back. 

Collaboration is another key to deliver a good quality of the work, it is not just a simple work or event that happens and reaches to the end. Collaboration is a process that continues over time. The more team collaborate, the more quality of quality will be increased. A team that works hard it also motivates each member of the team. This helps everyone in a team to learn from each other,  relationships become more comfortable, where everyone will be able to share and discuss ideas. At this point, results will be increasingly successful. 

To sum up, if every person tries to follow the above Andela’s EPIC values, she/he will a better candidate that can work with any kind of diversity and also be productive.
On Substitution
Tags: productivity
Published: 2019-11-27 01:42:24

I just wanted to share with you a cool tip I discovered along my journey to cut meat from my diet.  That tip is called "substitution".  It goes like this:

1. What I *think* I want is X.
2. What I *really* want is Y.
3. Therefore, substitute Z for X.

A few examples:

1. What I *think* I want is meat.
2. What I *really* want is protein.
3. Therefore, substitute Beyond Burgers for meat.

Or:

1. What I *think* I want is soda.
2. What I *really* want is hydration.
3. Therefore, substitute tea for soda.

That's it.  Enjoy!
[Ruby] Awesome methods
Tags: rails
Published: 2019-11-27 15:53:33

---
title: [Ruby] Awesome methods
tags: rails
published: true
---

🚧 in developing
---

### take caller method
```ruby
caller_locations(1)
```

### where is the method defined at?
```ruby
method(:recover).source_location
```

### grep the object has the method
```ruby
methods.grep(/download_files/)
```

---

## 🔗 Parent Note
{% link n350071/my-rails-note-47cj %}
Query PDFs with SQL
Tags: sql, ocr, pdf, saas
Published: 2019-11-27 19:31:05

Hi, everyone!

I made an app that lets you bulk-upload PDFs and then export recognized text as SQL, JSON, or CSVs.

You can see a video demonstration on the front page of the website: https://siftrics.com/

MySQL, PostgreSQL, and Microsoft SQL Server are officially supported.

If you have any questions about the product itself or the engineering that makes it work, please ask!

Discussion on HN: https://news.ycombinator.com/item?id=21649918
Discussion on /r/programming: https://www.reddit.com/r/programming/comments/e2jbhn/query_pdfs_with_sql_i_made_an_app_that_lets_you/