teleren/devto huggingface dataset:
CodeCast for streaming your coding session
Tags: startup, product, software, learning
Published: 2019-11-27 16:44:43

CodeCast allows you to stream and record your coding session. It captures every file save as a change and records it. Every change is captured as if it's a git commit. This was you don't have to make many commits when teaching or showcasing a piece of code.


CodeCast is very effective in teaching coding as students can see every change that happens along with the session and not just the final state of the code. They are able to view the entire project tree and copy code from the web page and they can also see the changes diff.


As many coders can attest, coding is about the process. It's almost never a straight line from the feature description to the finished code. There are usually lots of edits, back-and-forth, different solution attempts...etc Live coding helps less-experienced coders learn about the thinking process of experienced ones.


Give CodeCast a try whether you're teaching online or in a classroom environment. It's fairly simple, download the CodeCast Studio and sign up for an account!

👉[codecast.io](https://www.codecast.io/)
Flutter - Um estudo semanal sobre Widgets
Tags: flutter, widgets, google, mobile
Published: 2019-11-27 16:36:22

## Widget Of The Week - Videos legendados em português, mas a documentação esta em inglês

O canal oficial do flutter no [youtube](https://www.youtube.com/channel/UCwXdFgeE9KYzlDdR7TG9cMw) posta semanalmente um vídeo falando de diferentes Widgets e como eles são usados no desenvolvimento de apps com flutter.

Os videos são curtos e super interessantes, porém no seu formato não passam tantas informações e referenciam a [documentação oficial do flutter](https://flutter.dev/docs) como uma fonte mais aprofundada nos widgets e códigos.

Com legendas em Português e varias outras línguas, esses videos são bem acessíveis, mas a documentação está apenas em inglês. Barrando varias pessoas a procurarem a fundo sobre esses widgets e sobre o Flutter.

## O que nos vamos fazer? Um Artigo por semana sobre um dos Widgets! 

Então nós, pessoas apaixonadas por flutter e com tempo sobrando, decidimos aumentar o alcance de informações sobre o flutter e seus Widgets da semana.

Nós vamos criar um artigo para cada widget da semana lançado e pros que vão lançar. Sabemos que será um desafio, já que até o dia atual já foram lançados 60 videos nesse formato, mas nossa força de vontade nos cega e nos guia.

## Sobre quais Widgets nos vamos escrever?

Segue a lista de Widgets da semana, essa lista será atualizada conforme mais videos e artigos forem lançados:

 * [SafeArea](https://dev.to/flutterfans/um-estudo-sobre-a-safearea-do-flutter-5cg4)
 * [Expanded](https://dev.to/flutterfans/um-estudo-sobre-flutter-expanded-36jc)
 * Wrap
 * AnimatedContainer
 * Opacity
 * [FutureBuilder](https://dev.to/flutterfans/um-estudo-sobre-o-flutter-futurebuilder-4g8n)
 * FadeTransition
 * FloatingActionButton
 * PageView
 * Table
 * SliverAppBar
 * SliverList e SliverGrid
 * FadeInImage
 * StreamBuilder
 * InheritedModel
 * ClipRRect
 * Hero
 * CustomPaint
 * Tooltip
 * FittedBox 
 * LayoutBuilder 
 * AbsorbPointer 
 * Transform
 * BackdropFilter
 * Align
 * Positioned
 * AnimatedBuilder 
 * Dismissible
 * SizedBox
 * ValueListenableBuilder
 * Draggable 
 * Flexible 
 * MediaQuery 
 * Spacer 
 * InheritedWidget 
 * AnimatedIcon
 * AspectRatio 
 * LimitedBox 
 * Placeholder 
 * RichText 
 * ReorderableListView 
 * AnimatedSwitcher
 * AnimatedPositioned 
 * AnimatedPadding
 * IndexedStack 
 * Semantics
 * ConstrainedBox
 * Stack 
 * AnimatedOpacity
 * FractionallySizedBox 
 * ListView 
 * ListTile 
 * Container 
 * SelectableText
 * DataTable
 * Slider, RangeSlider e CupertinoSlider
 * AlertDialog
 * AnimatedCrossFade
 * DraggableScrollableSheet 
 * ColorFiltered

## Sobre Nós

Eu e o pessoal da Flutter Nation estamos em uma [página](https://www.facebook.com/FlutterNationBr/) e um [grupo](https://www.facebook.com/groups/FlutterNation/) no Facebook. 
Também estamos no [Meetup](https://www.meetup.com/pt-BR/FlutterNation/) e no [GitHub](https://github.com/Flutter-Nation)!
Pass data from Rails to JS
Tags: rails
Published: 2019-11-27 16:24:55

---
title: Pass data from Rails to JS
tags: rails
published: true
---

## From Rails
```erb
<%= link_to(
  'like👍',
  '#',
  id: 'like',
  data: {
    userId: current_user.id
  }) 
%>
```

## To JS


```js
$('#like').click(function(event){
 console.log(event.target.dataset.userId)
})
```




---

## 🔗 Parent Note
{% link n350071/my-rails-note-47cj %}
Welcome Thread - v50
Tags: welcome
Published: 2019-11-27 16:21:51

---
title: Welcome Thread - v50
published: true
description: Welcome to DEV! A thread of hellos and intros.
tags: welcome
---

![waving hand](https://media.giphy.com/media/xThuVYH5hW2Bo0khgY/giphy.gif)

### Welcome to DEV!

1. Leave a comment below to introduce yourself! You can talk about what brought you here, what you're learning, or just a fun fact about yourself.

2. Reply to someone's comment, either with a question or just a hello. 👋 

**Great to have you in the community!**
Building REST API in Python with Starlette and Docker
Tags: python, docker, starlette, rest
Published: 2019-11-27 16:21:13

RESTful services are one of the building blocks of modern web. In this article we will build a simple REST app with effective and easy-to-use tools, Starlette and Docker.

## Just give me the code
https://github.com/mdabrowski-eu/starlette-docker-example

## What is Starlette?
Starlette is a relatively new web framework and while it is not as popular as for example Flask, it is still worth attention. It features very competitive performance (check out here [benchmark here](https://www.techempower.com/benchmarks/#section=data-r17&hw=ph&test=fortune&l=zijzen-1)) and support for ASGI - modern, asynchronous successor of WSGI standard.

## What is Docker?
Docker is a light virtualization tool, the most popular of its kind. It enables you to build, distribute and run applications on any system host supporting Docker. While teaching you how to use Docker is not the purpose of this article (assuming that you are not familiar with this tool), I believe it is a good practice to "think in Docker" from the beginning. In my opinion in a lot of cases Docker is (counterintuitively) faster and easier as its existing images take from us some setup and configuration burden.

## Let's build some REST service
Firstly, install Starlette.
```pip install starlette```
Create main.py in app directory in your project and import Starlette there.
 
{% gist https://gist.github.com/mdabrowski-eu/9cca4e02cd255f92c4ff8d92acc30f52 %}
At this point we could skip to the "Run it!" step and our app would work, albeit it would be rather dull. To make it more interesting we need to add an endpoint.
We will do that with a simple GET endpoint responding* with RESTful "Hello World" equivalent.
*If you don’t know what this "GET" means, some [reading about HTTP methods](https://developer.mozilla.org/en-US/docs/Web/HTTP/Methods) should clarify things. 

{% gist https://gist.github.com/mdabrowski-eu/7259080101989752a87a1fdd97796a96 %}

Ok, this is not much but it will let us see if our application is indeed working. 

## Run it!
We will run our app inside a Docker container and for that we need to write a Dockerfile. We are in luck: an image that installs and configures Starlette and uvicorn (ASGI server) is already made. Our job will be limited to copying the correct files.

{% gist https://gist.github.com/mdabrowski-eu/35d73e6358e9d4f0bddea0ce4539bb4a %}
Let’s build the docker image.
```docker build -t starlette-example .```
When it is done, execute it:
```docker run -d --name starlette -p 9999:80 starlette-example```
I mapped 80 port inside container to 9999 to avoid conflicts with httpd service running on my computer but you can choose whichever port you like (unless it is taken or restricted). 
Now we can go to browser and type something like
``` http://localhost:9999/asdf ```
and we should get a nice JSON response as a result:
```{"message":"Hello,asdf"}```

That’s it! Our simple REST API runs inside a Docker container and properly responds on requests!
Overwrite a gem method by inserting a module in your inheritance chain
Tags: rails
Published: 2019-11-27 16:20:38

---
title: Overwrite a gem method by inserting a module in your inheritance chain
tags: rails
published: true
---

### tl;tr;
- create a module and define the method
- include it after the gem
- check it by `self.class.ancestors` to see the inheritance chain (継承チェーン)

### 🤔 Situation
```ruby
class PointsController < ApplicationController
  include MyModule
  include Banken
  
  def index
    banken_user #=> current_user 🤔
  end
end

module MyModule
  def banken_user
    # custom curent_user
  end
end

# gem
module Banken
  def banken_user
    current_user
  end
end
```

### 👍 解決
```git
class PointsController < ApplicationController
+ include Banken
  include MyModule
- include Banken

  def index
    banken_user #=> custome current_user 👍
  end
end
```

---

## 🔗 Parent Note
{% link n350071/my-rails-note-47cj %}
How to write save and save! (bang! in Rails)
Tags: rails
Published: 2019-11-27 16:14:12

---
title: How to write save and save! (bang! in Rails)
tags: rails
published: true
---

I have read [lib/banken/loyalty_finder.rb](https://github.com/kyuden/banken/blob/master/lib/banken/loyalty_finder.rb). It's impressive for me. So, I'd like to leave the snippet.

```ruby
    def loyalty
      loyalty_name.constantize
    rescue NameError
      nil
    end

    def loyalty!
      loyalty || raise(NotDefinedError, "unable to find loyalty `#{loyalty_name}` for `#{controller_name}`")
    end
```


---

## 🔗 Parent Note
{% link n350071/my-rails-note-47cj %}
Curated List of .new domain
Tags: dotnew, new, google, domain
Published: 2019-11-27 16:13:35

I love shortcut. You love shortcut. Everyone loves shortcut. But there is no shortcut to success. 

A year ago Google Suite announced bunch of .new shortcuts for its docs, slides, sheets with docs.new, slides.new, and sheets.new respectively. Google now announced, .new can be registered by public where you can create actionable workflow for your users

TLDR; [Here is the list](https://qainsights.github.io/.new-shortcuts-domain-list/)

# What's .new?

You can head to this [link](https://whats.new) to know more about .new Top Level Domain (TLD).

.new enables your site visitors to take an action or workflow when they visit. E.g. if you want to create a new google document, you can simply visit docs.new where you will see a new google document (default Google account), if you have not already logged in, it will redirect you to Google login page.

# Why .new?
.new link will help your site visitors and customers to remember and comes handy. Instead of typing the full URL or searching, you simply enter the .new shortcut.

By default, .new is secured by default. Because .new TLD is already added to HSTS preload list, making HTTPS required on all connections.

# Price
It is expensive e.g. performance.new domain cost is $452.13/year.

Please feel free to add if you stumble upon a .new domain in my GitHub repo.

![Expensive](https://media.giphy.com/media/l2Je5zEs6dxDjJGfe/giphy.gif)

{% github qainsights/.new-shortcuts-domain-list/ %}
Daily Challenge #126 - The Supermarket Line
Tags: challenge
Published: 2019-11-27 16:11:38

---
title: Daily Challenge #126 - The Supermarket Line
published: true
series: Daily Challenge
description: How long will it take for the customers to checkout?
tags: challenge
---
There is a line for the self-checkout machines at the supermarket. Your challenge is to write a function that calculates the total amount of time required for the rest of the customers to check out!

**input**
`customers` : an array of positive integers representing the line. Each integer represents a customer, and its value is the amount of time they require to check out.
`n` : a positive integer, the number of checkout tills.

**rules**
There is only one line serving many machines, and
The order of the line never changes, and
The front person in the line (i.e. the first element in the array/list) proceeds to a machine as soon as it becomes free.

**output**
The function should return an integer, the total time required.


**examples**
<pre>
queueTime([5,3,4], 1)
// should return 12
// because when there is 1 machine, the total time is just the sum of the times

queueTime([10,2,3,3], 2)
// should return 10
// because here n=2 and the 2nd, 3rd, and 4th people in the 
// queue finish before the 1st person has finished.

queueTime([2,3,10], 2)
// should return 12
</pre>

Good luck, happy coding!

***
_This [challenge](https://www.codewars.com/kata/57b06f90e298a7b53d000a86) comes from mattlub on CodeWars. Thank you to [CodeWars](<https://codewars.com/>), who has licensed redistribution of this challenge under the [2-Clause BSD License](<https://opensource.org/licenses/BSD-2-Clause>)!_

_Want to propose a challenge idea for a future post?  Email **yo+challenge@dev.to** with your suggestions!_
Monitoring Git Leaks in Travis
Published: 2019-11-12 11:10:01

---
title: Monitoring Git Leaks in Travis
published: true
date: 2019-11-08 12:11:00 UTC
tags: 
canonical_url: https://joshghent.com/gitleaks-travis/
---

Recently, we’ve wanted to add Gitleaks scanning into our repos to keep on top of any potential security issues. I checked out a number of tools such as [detect-secrets](https://github.com/Yelp/detect-secrets) and [trufflehog](https://github.com/dxa4481/truffleHog) but eventually I decided to use [Gitleaks](https://github.com/zricethezav/gitleaks) as the format was fairly CI friendly.

There is already a CI version of [Gitleaks](https://github.com/zricethezav/gitleaks-ci) but it uses a stripped down version of [Gitleaks](https://github.com/zricethezav/gitleaks) with basic regex. I wanted to use the fully fledged version that was updated a bit more regularly. Additionally, with the CI version you had to configure a few environment variables which I didn’t want to do with every single repository.

Since there was not much documentation on how to use it in CI, I decided to post this blog.

Simply add this script in `/.ci/leaks.sh`This will only audit the current script in the local repo

```
#!/bin/bash

if [! -z $TRAVIS_PULL_REQUEST]; then
    REPO_SLUG="/${TRAVIS_REPO_SLUG}"

    # Audit the current commit for secrets
    docker run --rm --name=gitleaks -v $PWD:$REPO_SLUG zricethezav/gitleaks -v --repo-path=$REPO_SLUG --commit=$TRAVIS_COMMIT
fi
```

Next, add this into your `.travis.yml`. Alternatively just add an additional “script” if you don’t want to do different stages

```
- stage: Leaks
    language: generic
    script:
    - "./.ci/leaks.sh"
```

Additionally, add `docker` as a new service in the `.travis.yml`

That’s it! Tweet me [@joshghent](https://twitter.com/joshghent) if you have any problems.
[Devise] Arbitrary Routing (任意のルーティング)
Tags: rails
Published: 2019-11-27 16:08:36

---
title: [Devise] Arbitrary Routing (任意のルーティング)
tags: rails
published: true
---

## TL;DR

```ruby
devise_for :users, class_name: 'InviteUser', skip: :all
devise_scope :user do
  post 'user/create', to: 'users#create'
  get 'user/confirm', to: 'users#confirm'
  put 'user/accept', to: 'users#accept'
end
```

- both methods are defined in Devise
- you can SKIP all pre routing (for no conflict routing)
- The point are 
  - `users` for devise_for
  - `user` for devise_scope
- you can read the files by `bundle open devise`


---

## 🔗 Parent Note
{% link n350071/my-rails-note-47cj %}
Let's build Flawk.to - Week 7
Tags: showdev, react, javascript
Published: 2019-11-27 16:08:29

The next few weeks are going to be super busy for me! Got a new position at work that I will have to be ramping up for. Also, tomorrow, my 3rd son will be born! I am so excited for all these changes in my life. [Flawk.to](http://flawk.to/) is also continuing to excite me. This past week I worked on getting all the screens for the MVP version complete. Now that we have the screens we can work on individual pieces of functionality.

This week I will be working on the authentication, again. I have already implemented the authentication a couple of times for [Flawk.to](http://flawk.to/) - in a couple of different ways. This will be the most bare bones approach I have taken so far. I will be looking to integrate three different social sign in methods:

1. Google
2. Github
3. Twitter

For our initial version this will be sufficient. I have never implemented the Twitter OAuth flow before so if we get to that one, it might get messy. Here is what the screen looks like:

![Log In/Sign Up menu](https://thepracticaldev.s3.amazonaws.com/i/5tzqg3vrbehp8gzp9uza.gif)

As for everything else [Flawk.to](http://flawk.to/) I will be using NextJS, NodeJS and React to implement these flows!

Stream starts tonight at [9PM EST](https://in-my-tz.now.sh/t/32312c416d65726963612f546f726f6e746f) (click the link to see the time in your timezone) on [twitch](https://twitch.tv/ericadamski). [Follow me](https://twitch.tv/ericadamski) to stay up to day with [Flawk.to](http://flawk.to/)'s progress!

---

We have a [public roadmap](https://flawk.to/roadmap)! You can vote for features you want to see and submit your own feature requests!
[Ruby] heredocument (ヒアドキュメント)
Tags: rails
Published: 2019-11-27 15:55:56

---
title: [Ruby] heredocument (ヒアドキュメント)
tags: rails
published: true
---

### TL;DR
use `<<~EOS` instead of others, then chomp it.

### code and results
```ruby
class HereDoc
  attr_reader :name

  def initialize
    @name = 'n350071'
  end

  def m1
    <<-'EOS'
      #{name}
    EOS
  end

  def m2
    <<-"EOS"
      #{name}
    EOS
  end

  def m3
    <<-EOS
      #{name}
    EOS
  end

  def m4
    <<~EOS
      #{name}
    EOS
  end
end

hd = HereDoc.new
hd.m1       #=> "      \#{name}\n"
hd.m2       #=> "      n350071\n"
hd.m3       #=> "      n350071\n"
hd.m4       #=> "n350071\n"
hd.m4.chomp #=> "n350071"
```

---

## 🔗 Parent Note
{% link n350071/my-rails-note-47cj %}
[RSpec] for helper
Tags: rails
Published: 2019-11-27 15:47:16

---
title: [RSpec] for helper
tags: rails
published: true
---

## TL;DR
define `let(:helper) { get_helper }` and use it as the receiver.


## 👍 You can write like this
```ruby
describe ApplicationController, type: :controller do
  let(:helper) { get_helper }

  describe '#hello' do
    it { expect(helper.hello).to eq 'hello' }
  end
end
```

---

## 🔗 Parent Note
{% link n350071/my-rspec-note-17ec %}
[RSpec] for ApplicationController
Tags: rails
Published: 2019-11-27 15:43:22

---
title: [RSpec] for ApplicationController
tags: rails
published: true
---

## TL;DR

Use `controller.send(:method_name, arg)`


## 🤔 Situation

```ruby
class ApplicationController < ActionController::Base
  def auto_encode(target)
    UserAgentBrowser.new(request.user_agent).os =~ /Windows/ ? URI.escape(target) : target
  end
end
```

## 👍 You can write like this

```ruby
require 'rails_helper'

describe V3::ApplicationController, type: :controller do
  describe '#auto_encode' do
    let(:text) { 'にほんご' }
    let(:encoded_text) { '%E3%81%AB%E3%81%BB%E3%82%93%E3%81%94' }
    context 'user_agent is chrome' do
      it { expect(controller.send(:auto_encode, text)).to eq text }
    end
    context 'user_agent is not chrome' do
      let(:user_agent) { 'Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.3;)' }
      before { request.user_agent = user_agent }
      it { expect(controller.send(:auto_encode, text)).to eq encoded_text }
    end
  end
end
```

---

## 🔗 Parent Note
{% link n350071/my-rspec-note-17ec %}
What pains you most in a web development project?
Tags: webdev, discuss, motivation
Published: 2019-11-27 15:42:35

---
title: What pains you most in a web development project?
published: true
description: annoying parts of a web development project 
tags: webdev, discuss, motivation
cover_image: https://i.ibb.co/tYH1bJT/download.png
---
:flushed: :flushed: **Which part of a web development project make you feel to escape way?** :flushed: :flushed:

For me, I always get freaked out about media queries. After making the desktop version, I am always at a loss. How to tackle all the tweaks for different screens! Media queries make the CSS sheets dirty for me. 

P.S.: I am curious to know, is it just me who doesn't like media queries a lot :stuck_out_tongue_winking_eye:?

Cover Photo: Escape from Work! by Alfrey Davilla | vaneltia on dribble.com
Day 15 of⚡️ #30DaysOfWebPerf ⚡️: Metrics
Tags: webperf, webdev, performance, devtools
Published: 2019-11-27 15:25:40

{% twitter 1199709731692195840 %}
{% twitter 1199709732497481728 %}
{% twitter 1199709733193736195 %}
{% twitter 1199709734162587649 %}
{% twitter 1199709735244771333 %}
{% twitter 1199709736322699264 %}


---

This article was originally published on [sia.codes](https://sia.codes/). Head over there if you like this post and want to read others like it, or sign up for my [newsletter](https://buttondown.email/sia.codes) to be notified of new posts!
How to Create an Animated Three.JS Landing Page with Counter Tutorial 
Tags: threejs, javascript, webgl
Published: 2019-11-27 15:15:13

This is the 3rd article I have created for online magazine icode, link and more info below;


Three.JS is a widely used JavaScript library for generating and creating impressive 3D graphics in browser using WebGL. In this tutorial written for iC0de magazine I  show you how to create a landing page with a counter. 

Covers creating geometry and adding effects, as well as adding a date counter that counts down to a deadline.

**Link:** 
https://icodemag.com/how-to-create-an-animated-three-js-landing-page-with-counter/
Top 5 DEV Comments from the Past Week
Tags: bestofdev
Published: 2019-11-27 15:06:49

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

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

I love popping into the latest "Welcome" thread as part of my daily DEV routine.  At the top of the recent **[Welcome Thread - v49](https://dev.to/thepracticaldev/welcome-thread-v49-509e)**, @celinemol introduced themselves.  Consider hopping into these threads (you can jump there directly via `dev.to/welcome`) to welcome new members!
{% devcomment i33l %}

Replying to **[What was the funniest thing, a non-tech ever said to you?](https://dev.to/devmount/what-was-the-funniest-thing-a-non-tech-ever-said-to-you-13kk)**, @gmkumar08 shares a truly hilarious misconception:
{% devcomment i3m4 %}

@remibruguier talks about being there for a friend battling imposter syndrome in the **[What was your win this week?](https://dev.to/devteam/what-was-your-win-this-week-bic)** thread.  There are a bunch of great [articles about imposter syndrome](https://dev.to/search?q=imposter%20syndrome) on DEV, be sure to check them out.:
{% devcomment i522 %}

@ahferroin7 answered the following question with a tremendously helpful comment: **[%, px, em, rem, viewport...How to know which one to use in CSS for responsive design?](https://dev.to/jharteaga/px-em-rem-viewport-how-to-know-which-one-to-use-in-css-for-responsive-design-4jbi)**:
{% devcomment i7f9 %}

Finally, @syntaxseed provides great context about the importance of inclusive and welcoming language in response to **[How to remove condescending language from documentation](https://dev.to/meeshkan/how-to-remove-condescending-language-from-documentation-4a5p)**:
{% devcomment i703 %}

See you next week for more great comments ✌