teleren/devto huggingface dataset:
React Devs & Orgs to Follow on Twitter?
Tags: react, discuss, javascript, webdev
Published: 2019-11-22 00:34:37

---
title: React Devs & Orgs to Follow on Twitter?
published: true
description: What developers or organisations do you follow on Twitter?
tags: react, discuss, javascript, webdev
---

Hi all, I've been in the Vue world for a few years now and so React took a bit of a sideline. Now it's time to sharpen my skills in React. 

**What developers or organisations do you follow on Twitter to keep up with the latest React related news, techniques, patterns, etc.?**
Should you run Kafka Connect in Distributed or Standalone mode?
Tags: kafka, kafkaconnect
Published: 2019-12-11 11:51:48

---
title: Should you run Kafka Connect in Distributed or Standalone mode?
published: true
date: 2019-11-22 00:00:00 UTC
tags: kafka,kafkaconnect
---

Kafka Connect can be deployed in two modes: **Standalone** or **Distributed**. 

![connect](https://rmoff.net/images/2019/11/connect.png)

I usually recommend **Distributed** for several reasons:

- You can run just a single node of it if you want

- It can scale

- It is fault-tolerant

- It can be run on a single node sandbox or a multi-node production environment

- It is the same configuration method however you run it

I usually find that **Standalone** is appropriate when:

- You need to guarantee locality of task execution, such as picking up a log file from a folder on a specific machine

- You don’t care about scale or fault-tolerance ;-)

- You like re-learning how to configure something when you realise that you _do_ care about scale or fault-tolerance X-D

My last snarky point on the list is why even if you’re just playing around with Kafka Connect on a laptop, learning it in Distributed mode means you learn it once, and then you’re all set. If you start with Standalone and its `.properties` method of passing configuration files to the worker at startup, and then come to use Distributed you have to re-learn how to use the REST interface etc.


----

* 🗒️ _If you want to learn more about deploying Kafka Connect in distributed mode, go and learn from my list of [common mistakes made when configuring multiple Kafka Connect workers](https://rmoff.net/2019/11/22/common-mistakes-made-when-configuring-multiple-kafka-connect-workers/)_. 
* 🎥 _To learn more about Kafka Connect in general then check out my [Kafka Summit London 2019 talk](http://rmoff.dev/ksldn19-kafka-connect)_.

----

Some follow-ups to this: 

{% twitter 1204791923002740737 %}
#30DayMapChallenge: 30 days building maps (3) - Earth is spherical
Tags: r, rstats, rspatial
Published: 2020-06-09 14:41:44

---
title: #30DayMapChallenge: 30 days building maps (3) - Earth is spherical
published: true
date: 2019-11-22 00:00:00 UTC
tags: r, rstats, rspatial
canonical_url: https://statnmap.com/2019-11-22-30daymapchallenge-building-maps-3-earth-is-sphere/
---

The #30DayMapChallenge was initiated by Topi Tjukanov on Twitter. This is open to anyone who would like to show a map, whatever the software is. In this blog post, I will show maps made with R. I add constraints to myself for fun. This week, I will create maps that remind map makers that Earth is not flat…  
This follows previous weeks blog post:

- #30DayMapChallenge: 30 days building maps (1)- ggplot2 
- #30DayMapChallenge: 30 days building maps (2) - tmap

See more: [#30DayMapChallenge: 30 days building maps (3) - Earth is spherical](https://statnmap.com/2019-11-22-30daymapchallenge-building-maps-3-earth-is-sphere/)
Laravel 6 Angularjs Crud Example
Published: 2019-12-21 12:13:30

---
title: Laravel 6 Angularjs Crud Example
published: true
date: 2019-11-22 00:00:00 UTC
tags: 
canonical_url: 
---

hii guysIn this exampleI will show you how to do angularjs crud in laravel 6 applicationwe will use angularjs to perform CRUDCreate Read Update Delete easily in laravel 6 applicationHere we will make simple crud example of item moduleif you are fresher in angularjs than you dont
Checking for NaN in JavaScript
Tags: javascript
Published: 2020-09-16 05:49:42

---
title: Checking for NaN in JavaScript
published: true
date: 2019-11-22 00:00:00 UTC
tags: JavaScript
canonical_url: https://www.loginradius.com/engineering/blog/checking-for-nan-in-javascript/
---

What is NaN? NaN, in JavaScript, can be many things. In fact, it can be almost anything, so long as it is Not a Number. Its type is technical “number” (when evaluated with “typeof”), although it stands for Not a Number. What causes values to become NaN? Values can become NaN…

   
[Read On](https://www.loginradius.com/engineering/blog/checking-for-nan-in-javascript/)
Day 39 : The Wish
Tags: hiphop, code, coding, lifelongdev
Published: 2019-11-21 23:39:15

_liner notes_:
- Professional : Worked on the prize wheel application and made some pretty good progress. Got a contestant entry page working so that people can add their names to the contest. I'll be adding SMS functionality at a later date. So right now a user can enter the contest and their name will show up in the admin dashboard as a contestant. Next is to actually hook up a page for the prize wheel and connect everything. I've created a prize wheel application last year so I'll be reusing some of that code and refactor it to fit this application. The hope and the wish is that it goes smoothly. We'll see. I'd like to have at least the prize wheel up.

- Personal : Definitely forgot that I had Google Stadia hardware I ordered sent to my parents' place. When I placed the preorder back in June, I figured I would have gotten my van by now. Going to have to wait until later to get my package. Tonight, I want to work more on this week's radio show and on my side project. I'd like to design the details page and get the format finalized.

![Arial shot of the clouds and mountains of Aconcagua, Argentina](https://thepracticaldev.s3.amazonaws.com/i/i1psezgr7oyx09pm3rra.jpg)

Tomorrow I'm hoping to have a rough working version of the application I've been working on so I'll be focusing on that mostly. After work, I want to finish up the pre-show work of the radio show and maybe play some Stadia. Going to see what I can get done with this prize wheel application.

Have a great night!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube tK7NygFA17M %}
Kubernetes Service Catalog 101
Tags: kubernetes, devops, docker
Published: 2019-11-21 23:17:12

What is a Service Catalog and why you may need to use it?
As a Kubernetes user/operator, you’ve dealt with a lot of resources to provision different components of your infrastructure. You’ve used resources like Services, configMaps, Secrets. But sometimes you may need to use an external service like the ones typically offered by the cloud provider. Take AWS for example; they provide the RDS service, which is an abstraction layer that lets you gain access to a relational database (MySQL, Postgres,etc.) as a service. When you want to integrate RDS into your existing Kubernetes cluster, you need to be able to deal with it the same way you deal with any other Kubernetes resource. Take authentication as an example. If you want to give your cluster applications access to the RDS database, you will need to do a lot of manual work (and workarounds) to make things work as expected.

To address this need, Kubernetes was extended to include the Kubernetes Service Catalog.

What is Kubernetes Service Catalog?
In a nutshell, the Kubernetes Service Catalog is an extension API that enables applications running inside the cluster to access applications and services provided by external sources, typically the cloud provider. Prominent examples of this pattern include provisioning databases, message queuing applications, object storage services, among others. Gaining systematic access to external resources is possible when the client consumes service brokers that implement the Open Service Broker API specification.
https://www.magalix.com/blog/kubernetes-service-catalog-101
How to use Custom React Hooks! (React Form Validation made easy, example)
Tags: react, beginners, javascript, codenewbie
Published: 2019-11-21 23:10:00

Forms are notoriously tedious to create, manage, and validate.

With old school React, you'd have to create classes, and it was challenging to re-use stateful logic.

Thankfully, with custom React hooks, you can reuse all your logic and reduce the amount of lines of code by ~50%!

Here's a straightforward example of how to do form validation with custom hooks!

Please consider subscribing by clicking here if you found this information useful!
[YouTube - Matt Upham](https://www.youtube.com/mattupham?sub_confirmation=1)
{% youtube SXIfnNvYrZE %}
[React Hooks Tutorial (Custom Hooks) | Form Validation made easy](https://youtu.be/SXIfnNvYrZE)

React Hooks are a much more concise way of handling stateful logic, and once you'll learn them, you'll be hooked 😜

If you found this video useful, please consider subscribing to my YouTube Channel! I talk about software & tech, life in Silicon Valley, and self-improvement!

**Subscribe Here**
[YouTube - Matt Upham](https://www.youtube.com/mattupham?sub_confirmation=1)

Thanks for reading!
★ My Alfred workflows
Tags: alfred, automation
Published: 2020-01-02 23:42:40

---
title: ★ My Alfred workflows
published: true
date: 2019-11-21 23:03:33 UTC
tags: alfred, automation
canonical_url: https://freek.dev/1506-my-alfred-workflows
---

[Alfred](https://www.alfredapp.com/) is a fantastic tool for macOS that allows you to be more productive. The app allows you to install workflows to make it more powerful. In this short blog post, I'd like to share the workflows that I have installed.

## Open a PhpStorm project #

[The alfred-jetbrains workflow](https://github.com/bchatard/alfred-jetbrains) allows you to quickly open projects in JetBrains products. To open a project in PhpStorm, type "phpstorm" and select the project you wish to open from the list.

![screenshot](https://freek.dev/uploads/media/alfred-workflows/phpstorm.png)

## Laravel docs #

[The laravel docs workflow](https://github.com/tillkruss/alfred-laravel-docs) by Till Krüss can save you a lot of time. Just type "ld," followed by a query to search the laravel docs.

![screenshot](https://freek.dev/uploads/media/alfred-workflows/laravel-docs.png)

## PHP Docs #

Bill Clark made [a workflow to search the PHP docs](https://github.com/billrobclark/alfred-phpdoc-search).

![screenshot](https://freek.dev/uploads/media/alfred-workflows/php-docs.png)

## Open a TablePlus database #

I use TablePlus to administer databases. To quickly open up a database [the TablePlus workflow](https://github.com/chrisrenga/alfred-tableplus) by Chris Renga can be used.

![screenshot](https://freek.dev/uploads/media/alfred-workflows/tableplus.png)

## Naming things #

Naming things is a fantastic workflow by my colleague Sebastian De Deyne to quickly search synonyms on [thesaurus.com](https://www.thesaurus.com/). Read more about it in [this blog post](https://sebastiandedeyne.com/a-pair-of-helping-hands-when-naming-things/) by Seb.

## Quit others #

I often work on the road. To save battery, I usually quit all applications except the one that is on the foreground. Instead of closing each app manually, you can use [the "quit others" workflow](https://app.box.com/s/om92n0a99mnlqksnxt9gd9ecj7r5cpu2) by Lu Nelson.

## Trash downloads #

After a while, the downloads folder will contain a lot of files. I have a workflow to immediately move the entire contents of the download folder to trash.

I found the workflow on [this forum post](https://www.alfredforum.com/topic/1844-empty-downloads-folder-workflow/), and you can download the workflow directly by clicking [here](https://www.dropbox.com/s/tnc3uyldzko3785/Trash%20Downloads.alfredworkflow).
First Look at ReactJS Suspense For Data Fetching
Tags: react
Published: 2019-11-21 22:54:09

---
title: First Look at ReactJS Suspense For Data Fetching
published: true
description: First look at React Suspense for data fetching. New reactjs api that will simplify how you handle loading states in React.
tags: react
---

{% youtube bEp_Sr_g9Qg %}

First look at React Suspense for data fetching.

New reactjs api that will simplify how you handle loading states in React.

Code example: https://github.com/satansdeer/data-suspense
Gotta GSD, Don't Wanna Buy Windows, Here's Some Options!
Tags: windows, virtualmachines, microsoft, linux
Published: 2019-11-21 22:19:14

---
title: Gotta GSD, Don't Wanna Buy Windows, Here's Some Options!
published: true
description: Virtual Machines for dev and test that Microsoft makes available. Time limited, but great to get a short phase of work done without needing to purchase into the entire ecosystem.
tags: windows, virtual machines, microsoft, linux
---
Ok, again, I've sat down to get some shit done and I immediately stumble into this one strange scenario where I need a Windows machine. I don't want to buy Windows. I rarely use it. I just need to do this one thing. I don't want to use Windows on a regular basis. I'm happy with Linux, and a little MacOS usage here and there. But here is this brick wall roadblock for this one task I need to do on Windows.

What a bummer! But there's an easy way Microsoft has setup to help us out with these scenarios!

Thank goodness.

If you want to test out a development environment, there's a location <a href="https://developer.microsoft.com/en-us/windows/downloads/virtual-machines" target="_blank" rel="noopener">here</a> where you can go download a time limited VM of your choice. This machine image is great because they've already got things setup with;

<ul>
    <li>Visual Studio 2019</li>
    <li>Visual Studio Code</li>
    <li>Windows 10 SDK</li>
    <li>UWP</li>
    <li>.NET Desktop</li>
    <li>Azure workflows enabled</li>
    <li>Windows Subsystem for Linux w/ Ubuntu. Not that I'd need this, but ya know, it's hugely useful on Windows.</li>
    <li>Dev mode & bash enabled.</li>
</ul>

That image is all groovy. No Java pun intended. But if you want a slightly slimmer image for just testing out Microsoft browser stuff, like MS Edge or older Internet Explorer versions, check out <a href="https://developer.microsoft.com/en-us/microsoft-edge/tools/vms/" target="_blank" rel="noopener">these images</a>.

With both of these options the versions are time limited, to something like 90 days. The cool thing is though, that'll give you enough time to test out most things or troubleshoot any .NET Windows proprietary code bits!

The other great thing is they offer the images in multiple different formats too; Virtual Box, VMware, and others.

Hope these are helpful to ya, enjoy!  👍

My Blog! I have a personal blog at [https://compositecode.blog/](https://compositecode.blog/) that you can also subscribe to where I post additional collected material, thoughts, music, meetups, conferences, videos (like [Twitch](https://twitch.tv/adronhall/)), open source projects, database work, data science, and much more.
Mutable or immutable global state pattern in React with hooks?
Tags: react, discuss
Published: 2019-11-21 21:51:02

I want to create a global state pattern for my next app. But I don't know if I should go for the mutable approach or the immutable one. Let me show examples illustrating my two options with pseudo-react.


##Immutable

```js
let globalState = { name: 'Enzo' }
function setGlobalName(name) {
    globalState = { ...globalState, name }
    notifySubscriber1(name)
    notifySubscriber2(name)
    // ... and so on
}

function Component() {
    const [state, setState] = useState(getGlobalState())

    function notifySubscriber1(name) {
        setState({ ...state, name })
    }

    return <Text onClick={setGlobalName('John')}>{state.name}</Text>
}
```


##Mutable

```js
const globalState = { name: 'Enzo' }
function setGlobalName(name) {
    globalState.name = name
    notifySubscriber1()
    notifySubscriber2()
    // ... and so on
}

function Component() {
    const state = getGlobalState()
    const [n, forceUpdate] = useState(0)

    function notifySubscriber1() {
        forceUpdate(n + 1)
    }

    return <Text onClick={setGlobalName('John')}>{state.name}</Text>
}
```
The mutable version could look dirty but let's assume that I'm going to wrap everything into a fancy API. The idea of forceUpdate comes from the MobX pattern that I once studied at that time. The pattern is pretty much the same with the difference that MobX uses Proxies to notify the component to forceUpdate.
https://github.com/mobxjs/mobx-react/issues/55#issuecomment-219536973


The thing is that I don't know what approach to take. Clearly, the mutable is much better in terms of performance because the immutable one makes a copy of the state every time we make a mutation, and this would be a problem if the store/state is a huge object.

But on the other hand, I don't know how problematic it would be the mutable way.

We can compare more or less both patterns with MobX and Redux. I know is a difficult topic because both have pros and cons. But I'm here to hear all the opinions that help me decide.
jQuery + Github
Published: 2019-11-21 20:40:54

Many many moons ago, right at the beginning in this thread, you cited the example of GitHub ditching jQuery.

Hurrah!

In 2012 when, as a fairly experienced amateur coder, I first started helping out with the website of an NGO, I was told about jQuery. I'd never heard of it although I had started to dabble with JS, concerned only with how it worked on FireFox.

jQuery existed/exists primarily because of a deeply evil and chronically incompetent company headquartered in Seattle. At the time (2012) it was a question of either 1) learn and use jQuery or 2) accept the stench of excrement and humiliation that comes with having to familiarise yourself with what passes for M$'s implementation of JS. This, given that there are people on this planet who, offered the choice of using other free browsers, nevertheless, of their own free will and knowingly, *choose* to use M$ "products".

That's one end of the spectrum. When frameworks are good, or as close as possible to necessary.

Have you ever heard of/seen these US TV series called "When X go bad"... e.g. "When cops/helicopters/moms/serial killers, etc. go bad..."?

Good frameworks are a bit like that, IHMO: in Panglossian fashion, they start off with the best of intentions, in the Best of All Possible Worlds... but then they go bad (usually).

jQuery never went bad. It will never grow old. In the morning, and in the evening, we shall salute it. But it is the exception, not the rule.
Pure CSS solution for detecting presence of child selector?
Tags: css, flexbox, layout, variables
Published: 2019-11-21 20:33:57



Hello dev.to community! 

Thankful for you! Articles are very helpful. Learning so much! 

Trying to leverage CSS's "live-ness" (rather than JS poling) to detect the presence of a dynamically loaded child selector to change it's parent's sibling's width per the below scenario and CSS.

Problem is that the CSS relational pseudo-class ":has" is [not supported by any browsers](https://caniuse.com/#search=%3Ahas) yet. 

Would CSS variables or a pre-processor be able to handle the below scenario? Not used them yet.

Probably making this too complicated. Open to more efficient ways/techniques.

Any assistance is much appreciated. 

Thanks again for all that you do for our community!

---

Scenario : :  
Classic left to right master-detail, holy grail layout, using Bootstrap/Flexbox.
1. End-user clicks a list item in `.results`.
2. Dynamic content is loaded into `.details`.
3. `.loaded` class is loaded LAST into `.details`.
4. The "Open State" CSS rule becomes TRUE.
5. `.details` slides in from the right.
6. End-user clicks "X" to close `.details`.
7. `.loaded` is removed from `.details`.
8. The "Open State" CSS rule becomes FALSE.
9. `.details` reverts to it's "Closed State" (default).
10. `.details` slides out to the right.

Hope that makes sense...

---

CSS : :
```
/* Closed State (default) */
.results {
     flex: 0 0 auto;
     width: 0;
     transition: width 550ms ease;
}
/* Open State */
.details .loaded {     
     .results {          
          width: 25%;
     }
}
```
HTML : :
```
<div class="results">
     <div class="list-of-results"></div>
</div>

<div class="details">
     <div class="dynamically-loaded-content **loaded**">

     </div>
</div>
```
```
                               '
             ( ON SCRN )       ' ( OFF SCRN )
                               '             _[ close btn ]
 _____ ________.results________'__.details__/
|     |                        |           x| 
|     |                        |            | When the child class
|     |                        | + .loaded  | '.loaded' is present in
|     |                      <-|---         | '.details', '.details' slides
|     |                        |            | on screen from right
|     |                        |            | 
|     |                        |            |
|     |                        | - .loaded  | When '.loaded' disappears
|     |                      --|-->         | '.details' slides off screen
|     |                        |            |
 ----- ------------------------ ------------

```
Procable Classes
Tags: ruby
Published: 2019-11-21 20:31:08

This is I think a good combination of cheap and simple for use in a more functional style of ruby.

# Very simple cases

``` ruby
class AddOne
  singleton_class.attr_accessor :to_proc
  self.to_proc = ->(x) { x + 1 }
  define_singleton_method(:call, to_proc)
end

1.then(&AddOne) #=> 2
AddOne.call(1) #=> 2
```

# More complex cases

Most times you will want to use Object instances as they make refactoring easier.

``` ruby
class AddTwo
  singleton_class.attr_accessor :to_proc
  self.to_proc = ->(x) { new(x).call }
  define_singleton_method(:call, to_proc)
  
  def initialize(x)
    @x = x
  end
  def call
    @x + 2
  end
end

1.then(&AddTwo) #=> 3
AddTwo.call(1) #=> 3
```

*edit: changed class << self to singleton_class*
Should I stop doubting PHP
Published: 2019-11-21 20:30:36

I am very open minded about languages apart from one, honestly I don't know why, PHP has a reputation mostly due to security and the reason for that is it was used alot! And the biggest fish are the best targets. The other thing that bugs me is that I don't see it like C or Java or Rust or what have you, it's home turf is on the server, that's not the case for more general purpose lower level languages. The other thing that bothers me is that PHP exolved from a templating language, it's like seeing pug or ejs or other becoming a fully fledged language way out of the scope of it's original purposes.

I do like the branding and Laravel thought, I must be very shallow 🤣