teleren/devto huggingface dataset:
Import Named Exports
Tags: javascript, webdev, modules
Published: 2021-02-02 21:54:49

---
title: Import Named Exports
published: true
date: 2021-01-26 00:00:00 UTC
tags: ['javascript', 'webdev', 'modules']
canonical_url: https://chan.dev/posts/import-named-exports/
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/uk4uhpazp2sxiecyp7b5.jpg
---

By default, expressions and assignments declared inside a module aren't available outside of that module.

```js
// file: string-utils.mjsfunction hype(message) { return `${message.toUpperCase()}!!!`;}
```

Here, `hype` is only available to other functions inside `string-utils.mjs`.

We can expose `hype` to other modules by prepending the `export` keyword.

```js
// file: string-utils.mjs- function hype(message) {+ export function hype(message) { return `${message.toUpperCase()}!!!`;}
```

`hype` is now a _named export_ from the `string-utils` module.

Keep in mind that `export`-ing something doesn't mean it is automatically available throughout the codebase. Every `export` requires an `import`.

## Import named exports [#](#import-named-exports)

Anything one module exports can be imported and used by another module.

```js
import { hype } from "./string-utils.mjs";console.log(hype("moduuuules"));// => MODUUUULES!!!
```

The syntax we use to access named exports is similar to object destructuring assignment.

```js
let person = { name: "chantastic" };let { name } = person;
```

We can only import what we can access by name.

So, the import statement below would fail (with our current module):

```js
import { hype, chant /* oops. no chant */ } from "./string-utils.mjs";// SyntaxError:// The requested module './string-utils.mjs' does not provide an export named 'chant'
```

## Import multiple named modules [#](#import-multiple-named-modules)

We can import as many named exports as we like!

Let's implement and export a `chant` function:

```js
// file: string-utils.mjsexport function hype(message) { return `${message.toUpperCase()}!!!`;}export function chant(message) { return [...Array(3)].map(() => message).join("! ");}

import { hype, chant } from "./string-utils.mjs";console.log(chant("M"));// => Modules! Modules! Modules!
```

## My take [#](#my-take)

Named exports are the module feature I use most.

The major downside of named exports is naming collisions with other modules.
In future posts I'll share a handful of strategies to compensate for and avoid naming collisions of named exports.

## Go pro [#](#go-pro)

This is part of a course I'm creating on modules at [lunch.dev](https://www.lunch.dev/).  
When live, members get access to this and other courses on React.

<script src="https://cdn.podia.com/embeds.js" async="async"></script>

[Join lunch.dev](https://www.lunch.dev/member)
Cron do not send me empty emails
Published: 2021-05-04 15:21:04

---
title: Cron do not send me empty emails
published: true
date: 2021-01-26 00:00:00 UTC
tags: 
canonical_url: https://foursixnine.io/blog/linux/2021/01/26/Cron-do-not-send-me-empty-emails.html
---

Just in case, if you’ve ever wondered how to stop `cron` from sending empty emails, a quick look at `man mail` will give you the answer you’re looking for (if you know what you’re searching for):

```
    -E

    If an outgoing message does not contain any text in its first or only message part, do not send it but discard it silently,
    effectively setting the skipemptybody variable at program startup. This is useful for sending messages from scripts started 
    by cron(8).

```

I got this after visiting couple of forums, and some threads at stack exchange, however [this one](https://stackoverflow.com/a/14656511) nailed it

So all you need to do is, fire up that `crontab -e` and make your script run every five minutes, without fear of the noise

```
*/5 * * * * /usr/local/bin/only-talk-if-there-are-errors-script |& mail -E -r $(hostname)@opensuse.org -s "[CRON][monitoring] foo bar $(date --iso-8601='minutes')" do-not-spam-me@example.com

```

_Et voilà, ma chérie!_ ![It's alive!](https://media.giphy.com/media/xT5LMDi8H2A1FtLlpC/giphy.gif)
Import Modules for Side Effects
Tags: javascript, webdev, modules
Published: 2021-02-02 21:51:42

---
title: Import Modules for Side Effects
published: true
date: 2021-01-26 00:00:00 UTC
tags: ['javascript', 'webdev', 'modules']
canonical_url: https://chan.dev/posts/import-a-module-for-side-effects/
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/1ps6if90x21odel2c9kl.jpg
---

Modules — in JavaScript — can be imported strictly for their side effects.

```js
import "./string-utils.mjs";
```

Notice.
We're not making any local assignments.
We aren't importing functions or constants for later use.
We're simply importing the global effects of the module, as if the code lived in this file.

On the module side, simply write code with effects.

```js
// file: ./string-utils.mjsconsole.info("string-utils loaded.");
```

## Conditional side effects with dynamic imports [#](#conditional-side-effects-with-dynamic-imports)

We can load modules with side effects conditionally, with an immediately invoked async function.

```js
(async () => { if (true /* maybe some environment var */) { await import("/modules/my-module.js"); }})();
```

Here, you can imagine checking an environment variable before importing side effects.

## Don't mix side effects and exports [#](#don't-mix-side-effects-and-exports)

Modules can contain a mix of exports and effects.  
While there may be a good reason to do this, it also make your imports unpredictable.

Here's why I recommend avoiding the mix:

```js
import hype from "./string-utils.mjs";// loads both exports AND side effectsconsole.log(hype("moduuuuuules"));// => string-utils loaded.// => MODUUUUUULES!!!
```

Module effects _always_ run at import.

In a mixed module, you _can_ import only the effects but you _can not_ import only the exports.

## Side effect imports in the wild… [#](#side-effect-imports-in-the-wild%E2%80%A6)

I see this style of import used with Webpack to import stylesheets.

In this case, Webpack is packaging up CSS as JavaScript and appending it to the browser's [CSSOM](https://developer.mozilla.org/en-US/docs/Web/API/CSS_Object_Model).

## Go pro [#](#go-pro)

This is part of a course I'm build on modules at [lunch.dev](https://www.lunch.dev/).  
When live, members get access to this and other courses on React.

<script src="https://cdn.podia.com/embeds.js" async="async"></script>[Join lunch.dev for videos](https://www.lunch.dev/member)
Intro to Choc UI, a Chakra UI Component library.
Tags: react, chakra, webdev, javascript
Published: 2021-01-25 23:48:38

### Chakra UI
According to the [Chakra UI website](https://chakra-ui.com), 
> Chakra UI is a simple, modular and accessible component library that gives you the building blocks you need to build your React applications.

### Choc UI
According to the [Choc UI website](https://choc-ui.com),
> Choc UI is a set of accessible and reusable components that are commonly used in web applications.

So [Choc UI](https://choc-ui.com) is basically a collection of reusable components, built on the [Chakra UI library](https://chakra-ui.com).

It's safe to say [Choc UI](https://choc-ui.com) is to the [Chakra UI library](https://chakra-ui.com) as [Tailwind UI](https://tailwindui.com) is to [Tailwind CSS](tailwindcss.com/).

It's in active development [on Github](https://github.com/anubra266/choc-ui), built on [NextJS](https://nextjs.org/) and is hosted on [Vercel](https://vercel.com).

It Presently consists a lot of useful and beautiful components. 

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/2v37a2qe5fg86ovog4jp.png)

The Site's sidebar even shows what component are under development.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/t0jrbvieha00gzh9bubt.png)

Oh! and don't worry it also has light mode.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/abbwo7x7iq0mdcnvejlh.png)

So Every Component on the site has 5 options.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/muquaoahhwb42bzac181.png)

#### 1. Show/Hide Code
This toggles the code for the component. **Fun fact** It's editable. And all [Chakra UI](https://chakra-ui.com) Components, Icons are automatically imported behind the scenes. As well as all Icons in the [React Icons](https://react-icons.github.io/react-icons/) Library.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/mbaz9xgj2d683rmmuzwt.png)

#### 2. Copy Code
You know what that means.😉

#### 3. Open Demo in New Tab
It basically gives you a full page preview of the component in a new tab where you can still copy component's code, toggle the theme mode, or just go home.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/41ifvgdy1lgeeagvl4xn.png)

#### 4. Open in Codesandbox
It opens components' code on [Codesandbox](https://codesandbox.com). 

Couldn't I just edit the code in the site's provided code editor? Well not,if you wanted to test the code with some other library, e.g. `react-table`

**NB:** 
- The Codesandbox opened is a completely setup React and Chakra UI environment.
- The sandbox is generated on the fly. They wouldn't prebuild a sandbox for all their components.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/6qwrarcwjxfixfwfopy7.png)


#### 5. Reset Component Code.
Use this if you want the code editor to reset to The original component's code.

Long story short. Save your designs some time, Star and contribute to this project [on Github](https://github.com/anubra266/choc-ui).
BigQuery: date sharded tables vs. native table partitions
Tags: bigquery, gcp, datawarehousing, partitioning
Published: 2021-01-25 23:43:07


I've used BigQuery plenty, and really enjoy working with it. One technique to reduce costs is partitioning, which can be done in a few different ways.
Here's an overview of native table partitioning vs. date sharing in BigQuery
https://mark-mccracken.medium.com/bigquery-date-sharding-vs-date-partitioning-cee3754f7900
มาดูกันว่า ชื่อแปลกๆของ Docker container นั้นสร้างมายังไง
Tags: docker, go, programming
Published: 2021-01-25 23:36:17

ใครที่ใช้ Docker กันอยู่น่าจะรู้ว่าถ้าเราไม่ได้ระบุชื่อ container (--name container_name) ตอนที่เรารัน มันจะสร้างชื่อสุ่มๆมาให้ เช่น

```
$ docker run -d --hostname my-rabbit rabbitmq:3-management
bbf6843f716bb17ba91527b2181a5b363a35004954b0dd19f05c8fb442260bc0

$ docker ps
CONTAINER ID   IMAGE                   COMMAND                  CREATED         STATUS         PORTS                                                                  NAMES
bbf6843f716b   rabbitmq:3-management   "docker-entrypoint.s…"   6 seconds ago   Up 4 seconds   4369/tcp, 5671-5672/tcp, 15671-15672/tcp, 15691-15692/tcp, 25672/tcp   dreamy_booth
```

ได้ชื่อ `dreamy_booth` มา ทีนี้อยากรู้มั้ยว่า ชื่อนี้มันมาได้ยังไง

ผมลองไปค้นดูแล้วก็เจอโค้ดที่ทำหน้าที่สุ่มชื่อนี้อยู่ที่นี่ https://github.com/moby/moby/blob/master/pkg/namesgenerator/names-generator.go

จะเห็นว่ามี array สอง array คือ left กับ right ที่รวมรายชื่อจากไหนก็ไม่รู้มา แต่ว่าตัว array ฝั่ง right เองมี comment บอกไว้ว่า

```go
// Docker, starting from 0.7.x, generates names from notable scientists and hackers.
	// Please, for any amazing man that you add to the list, consider adding an equally amazing woman to it, and vice versa.
```

จะเป็นชื่อของ scientists หรือ hackers ที่มีชื่อเสียงนั่นเอง

เช่น `booth` ที่ผมได้ คนนี้คือ

```go
// Kathleen Booth, she's credited with writing the first assembly language. https://en.wikipedia.org/wiki/Kathleen_Booth
		"booth",

```

คนเริ่มต้นสร้างภาษา Assembly นั่นเอง 😲

ทีนี้มาดูโค้ดที่ใช้สุ่มชื่อจากในลิสต์นี้กัน

```go
// GetRandomName generates a random name from the list of adjectives and surnames in this package
// formatted as "adjective_surname". For example 'focused_turing'. If retry is non-zero, a random
// integer between 0 and 10 will be added to the end of the name, e.g `focused_turing3`
func GetRandomName(retry int) string {
begin:
	name := fmt.Sprintf("%s_%s", left[rand.Intn(len(left))], right[rand.Intn(len(right))])
	if name == "boring_wozniak" /* Steve Wozniak is not boring */ {
		goto begin
	}

	if retry > 0 {
		name = fmt.Sprintf("%s%d", name, rand.Intn(10))
	}
	return name
}
```

จะเห็นว่าจะเอาชื่อจากด้านซ้าย ซึ่งเขาบอกว่าเป็นคำ adjectives และนามสกุลของคนที่มีชื่อเสียงที่อยู่ในลิสต์ด้านขวา เอามาต่อกันโดยคั่นด้วย `_` ก็มีเรื่อง retry ด้วยนิดหน่อยคงเพราะถ้าสุ่มแล้วชื่อไปชนกับที่รันไว้อยู่แล้วก็เอาเลขไปต่อท้ายเพื่อกันชื่อซ้ำนั่นเอง

ที่ตลกคือถ้าสุ่มได้ `"boring_wozniak"` จะกลับไปซุ่มใหม่อีกรอบ 😂

นี่ละก็เป็นที่มาของชื่อที่เราเห็นเวลาเราไม่ได้ระบุชื่อให้กับตอนรัน docker container

<a href="https://www.buymeacoffee.com/weerasak" target="_blank"><img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="Buy Me A Coffee" style="height: 60px !important;width: 217px !important;" ></a>
Types of devs
Tags: humor, watercooler
Published: 2021-01-25 23:20:08

---
title: Types of devs
published: true
description: There are few types of developers I've encountered throughout my programming career.
tags: humor, watercooler
cover_image: https://source.unsplash.com/y421kXlUOQk/1280x720
---

There are few types of developers I've encountered throughout my programming career:

### over-engineering devs

They care only about engineering, system architecture but not really about the business of the created application. They like to talk about using advanced patterns like event sourcing, actor model, using message broker or message queue just to implement a simple to-do list.

### happy path = done devs

They care only about the happy path. Making PM/CEO/client happy, especially if the person they are reporting to has no idea about the technical side of building things. They copy-paste existing code, add new fields to data models, and don't bother thinking twice about the consequences of their changes. What matters is just covering one simple case they have in their task.

### let's try that new shiny OSS library devs aka hype devs

As soon as there is a possibility to add a new dependency or blame slow performance/bugs on not so trendy library the project currently uses you know they will be the first to jump to rewrite existing code and burn old to the ground. Especially if the new library is few days old and just blows up on Twitter gaining few hundred/thousands stars in the first few days.

### so we're creating user-facing application devs

This is a special breed of backend developers that only care about data, security, system architecture, system resilience, fault tolerance, containers, and Kubernetes. Super happy when writing new services to cover business logic (the more complex the better) but they are disgusted when asked to expose API for "frontend" or implementing something even remotely close to user-facing UI.

### let's write that ourselves devs

Screw that OSS library everyone uses. Sure it has hundreds of contributors is used by a lot of companies in their core products but we should write that ourselves to have 100% control. Yeah, sure...

### we should have eslint for that devs

This special kind of developer creates the most impossible eslint rules to fix the JS. Ban half of the language, force conventions, have 10 times more eslint config than actual code.

### endofunctor devs

Freshly after reading about category theory just have to use that Kleisli composition in your codebase. And not forget about using all of the possible custom operators to express even the simplest business logic.

---

We all probably know some of those developers and can recognize our colleagues among them. We can even make fun of them, but the truth is - we all should take the good parts from each one of the above and balance it. This is what makes us better developers.
Do you use SQL to run operations?
Tags: sql, operations, cloud, saas
Published: 2021-01-25 23:12:41

We’ve worked at the largest fintech and data companies. We’ve seen data tools. We’ve seen business tools. We’ve rarely seen them overlap beyond BI. Operations teams execute critical flows with limited data access and automation power, struggling to get their asks prioritized. Engineers want to work on products, not internal tools. The result is higher costs and losses for the company, and errors or delays for customers. We want operations teams to set up and monitor workflows, without engineers. 

We pick up where BI tools leave off. A business user writes a simple rule to manually review or automatically do custom actions on alerts they can set up. e.g. “when transaction amount > $1M and account age < 5 days, block transaction and send to too_large queue” Their manager can approve this rule, view and manage all rules to ensure compliance, and even encourage proactive experimentation. We’re lightweight, enable controlled self-service and prove direct ROI. Here’s LogicLoop in action! https://logic-loop.github.io/ and demo https://www.loom.com/share/57006a1065244589beec80fb890b0dc8

We’ve found a fit from healthcare cos delivering COVID vaccines to larger fintechs fighting fraud. If you’re a company that has a database and run an ops team (support, fraud, even sales), you will find this invaluable to scaling ops. We are looking for more design partners, and would love to chat if you’re interested! The timing is perfect since we’re shaping the MVP around our initial user needs, and are serious about delivering concrete value.

If you’ve faced or solved this problem before, we’d love to talk. Feel free to comment/DM!
How Would You Explain DevRel To Your Grandparents?
Tags: devrel
Published: 2021-02-01 17:48:51

---
title: How Would You Explain DevRel To Your Grandparents?
published: true
date: 2021-01-25 23:11:56 UTC
tags: DevRel
canonical_url: https://maxkatz.org/2021/01/25/how-would-you-explain-devrel-to-your-grandparents/
---

Someone asked me this question recently:

**How would you explain what you do to your grandparents?**

I thought this is a great question. It can also be rephrased as:

**How would you explain DevRel to your grandparents?**

You will find many definitions for Developer Relations. Some of them are long or even full articles. What I like about this question is that the answer needs to be clear and short.

My answer is:

_Our mission is to help developers be successful. We provide developer education, and help developers build solutions with our company’s products (or services)._

What do you think, how would you answer this question?

And here is another version:

_Our mission is to help developers be successful. We provide developer education, and help developers solve problems with our company’s products (or services)._
Hero section with tsParticles and Bulma
Tags: html, javascript, showdev, webdev
Published: 2021-01-25 22:52:00

I made a sample with [tsParticles](https://github.com/matteobruni/tsparticles) in a hero section for a user asking help.

As you can see the tsParticles fits only the hero and not all the page.

You can see the working sample below

{% codepen https://codepen.io/matteobruni/pen/QWKXPRq %}
Day 294 : A Different World
Tags: hiphop, code, coding, lifelongdev
Published: 2021-01-25 22:43:14

_liner notes_:
- Saturday : Worked on my presentation slides. Made a lot of graphics I'll be using. Watched the new episode of "WandaVision" before the radio show. Had a really good time doing the radio show. Kind of went off on a little rant, but I felt better getting it off of my chest! haha The recording of this week's show is at https://kNOwBETTERHIPHOP.com

![Radio show episode image of Hank Aaron holding 2 bats in a stadium with Bernie Sanders sitting in a chair photoshopped into the front row](https://dev-to-uploads.s3.amazonaws.com/i/ite7nyv5k35bfw48vdik.jpg)

- Sunday : Worked on my presentation more. Come to find out that there was a feature I wanted to do on my slides, but needed to upgrade the library I was using. Luckily it wasn't too bad getting it working. Did some post radio show work. Pretty much it. Tried to relax a little.

- Professional : Today is the first day of our team retreat. Due to the pandemic, it's online this year. It's a shame because I think it was supposed to be in Greece or somewhere. Last year, it was in Miami (like 3 hours away from me). I was looking forward to being able to travel somewhere exotic. Hopefully sometime in the future we can all meetup in person. We had some meetings. It was good seeing everyone. Afterwards, I worked more on my presentation. Pretty much done. Just some finishing touches to be made.

- Personal : Got a lot done with my slides. Just a few more things. Just trying to condense all the stuff from my blogs into a few slides. It's been a really refresher of what I wrote.

![Overhead view of a beach in Big Sur, California with a large land mass sticking up out of the water.](https://dev-to-uploads.s3.amazonaws.com/i/mwij6v457gznvo6lk4rb.jpg)

Really going to finish my slides this time. For real. haha The presentation is in a couple of days, so it'll get done one way or another. Once I finish, it'll be like a different world when I look up from my laptop. haha. I've got another presentation set up for next month. We'll start it all over again. haha.

Have a great night!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube dK1M9YMisUI %}
State of Software Architecture Quality
Tags: architecture, security, performance, design
Published: 2021-01-25 22:31:22

Hello World,

An organization that I work with ([AppLand](appland.org)) is conducting an industry survey to learn more about the state of product and software architecture quality. The results of this survey will be publicly published and if we hit our goal of 300+ responses, we will be donating $1,000 to Girls Who Code.

If you work in software architecture or know someone who does, please consider taking our survey, [here](https://www.surveymonkey.com/r/archsurveygeneral).

If you're interested in our open source projects, you can check out or GitHub, [here](https://github.com/applandinc).
Supercharge your Laravel 8 Collections
Published: 2021-01-25 22:28:18

Laravel is amazing when it comes to what it offers right out of the box. It makes our lives as developers just that much easier. Collections are a big part of Laravel. They come with a ton of methods. But sometimes you need a little extra.

I recently came across an amazing package: [spatie/laravel-collection-macros](https://github.com/spatie/laravel-collection-macros).

Getting up and running with it couldn't be any simpler. All it takes is one composer command:
`composer require spatie/laravel-collection-macros`

and the package will automatically register itself!

The package macros in the following methods:

- `after`
- `at`
    - `second`
    - `third`
    - `fourth`
    - `fifth`
    - `sixth`
    - `seventh`
    - `eighth`
    - `ninth`
    - `tenth`
- `before`
- `catch`
- `chunkBy`
- `collectBy`
- `eachCons`
- `extract`
- `filterMap`
- `firstOrFail`
- `fromPairs`
- `glob`
- `groupByModel`
- `head`
- `ifAny`
- `ifEmpty`
- `none`
- `paginate`
- `parallelMap`
- `pluckToArray`
- `prioritize`
- `rotate`
- `sectionBy`
- `simplePaginate`
- `sliceBefore`
- `tail`
- `try`
- `toPairs`
- `transpose`
- `validate`
- `withSize`

I wouldn't be surprised if some of these make their way into upcoming Laravel versions. Having recently used `paginate()` & `simplePaginate()` on collections, all I can say is this works like a charm.

#That's All Folks!
Thanks for reading my article.
Feel free to discuss in the comments below.
☕ [Buy me a Coffee?](https://www.buymeacoffee.com/zaxwebs)