teleren/devto huggingface dataset:
Building a Coronavirus state government website that will hopefully save lives
Tags: wordpress, webdev
Published: 2020-03-25 21:17:16

I didn't know exactly where my web development journey would take me when I quit my job and started freelancing full-time in June 2016.

I had been doing "tech for good" since 2008 as a digital marketing manager and web producer for a nonprofit. I wanted to get more involved in the development side of things, and I wanted to work in WordPress.

I went freelance full-time in hopes of being a WordPress consultant for nonprofits. I got to do a bit of that during seven months of self-employment, and then for 2.5 years as a full-time employee at a local nonprofit.

I am now working for the Delaware state government after having gotten laid off and then taking a temporary contract to tide me over.

I was told we would be building WordPress websites for state government agencies and municipalities. I had never worked in government before, so I took it as an opportunity to learn something new.

One month into my new job, Coronavirus happened.

## Developing a new website for Coronavirus-related information

Delaware Health and Social Services has its own website, and it had information on the Coronavirus along with everything else.

We wanted to build a website that would serve as a central information hub on Coronavirus for all Delaware citizens. This would be a website that's similar to the federal government's coronavirus.gov, but on a state level.

So, my team and I built [https://coronavirus.delaware.gov/](coronavirus.delaware.gov) on WordPress. I had the privilege of designing the initial layout, and we have been building and contributing to it ever since.

The website gives information on what people can do, information about testing, resources for different groups of people, videos from the governor, and other information and resources.

## Web development for good in a time of crisis

I am really proud to be able to contribute to this effort. I hope this website saves lives and gives the message to the citizens of Delaware that their government is here for them and has their back.
React: useEffect
Tags: tutorial, beginners, react
Published: 2020-03-25 20:38:58

With functional components more popular than ever with the introduction of hooks, how do we transfer our life cycles from the Class-based component to a functional one?

Please welcome, `useEffect`. `useEffect` is React's answer to having some sort of lifecycle in functional components.

`useEffect` accepts two arguments -- a callback function, and an optional array of dependencies that determines when the effect callback will re-trigger.

```react
useEffect(() => { ... }, [...])
```

So how does this transfer to the lifecycle of a Class component?

**`componentDidMount`**

Every `useEffect` call will run when the component is considered mounted even if you pass an array of dependencies.

```react
useEffect(callback) // will run on mount
useEffect(callback, []) // will run on mount
useEffect(callback, [item]) // will run on mount
```

**`componentWillUnmount`**

The callback is allowed to return a function that will be triggered whenever the component unmounts or when the effect re-runs again. So it's not a 1-to-1 transfer from `componentWillUnmount` but it does what it needs to.

```react
useEffect(() => {
  const handleEvent = () => { ... }
  document.addEventListener('resize', handleEvent)

  return () => {
    document.removeEventListener('resize', handleEvent)
  }
})
```

**`componentDidUpdate`**

As said before, the effect can re-run based on if the dependencies passed in the array changes. When there's no array passed, the effect will run every single render.

```react
useEffect(() => {
  console.log('The component re-rendered')
})

useEffect(() => {
  console.log('The value of item changed!')
}, [item])
```

So how can we use `useEffect` in a project? One way to use it is to grab data from an api and filter against your local data.

```react
useEffect(() => {
  fetch('https://pokeapi.co/api/v2/pokemon?limit=151')
    .then(res => res.json())
    .then(data => setPokemons(data.results));
}, [])
```

```react
useEffect(() => {
  // filter Pokemon here
}, [query])
```

[Code Sandbox](https://codesandbox.io/s/wizardly-wilbur-hiwfd)
COVID-19 AND BEYOND - THINKING IN NANO SCALE
Tags: covid19, nanotechnology
Published: 2020-03-25 20:25:11

---
title: COVID-19 AND BEYOND - THINKING IN NANO SCALE
published: true
description: Covid 19 call for actions
tags: Covid19, nanotechnology
---

"As the spacecraft Vovager 1 did the final swing to look at the solar system for the last time before it releases itself into the eternity - The Vovager 1 saw, in total darkness, a tiny speckle bright blue marble -  yes that blue marble is our precious planet- The Earth."




"Hello world, my fellow human being, I would rather be spending my time relaxing at the beautiful Bondi beach or walking along the beautiful harbourside in this part of the world in Sydney, Australia.



Yes, we had had the greatest bush fire disaster recently in Australia and it has wiped out billions of plants and many uniques Australian's animal's species and many many acres of our precious land and affected our livelihood. It would not be an under-estimate to say that we are living in very trying times. You only need to look at the google earth to see the effects.



But more than that my fellow human being, now a new enemy is at the gate - COVID-19 - an infectious virus that manages to jump across the species into our very DNA and its already has infected and killed some of our fellow human being of all nations.



I call upon you, globally, that we need to come together as one to fight this infectious enemy -COVID-19. Experts from across the world should come together and help to bring the prototype into reality. We must fight them at their level of nano-scale dimensions and we have to do it fast!



This campaign aims to create an open platform for dialogue so we, as a species, all can contribute to solving this pressing issue before it took over our well being. To achieve the goal, we need to have access to the best and lastest cutting edge technology and techniques across many disciplines. This time we must be in unison doing it for man kinds as a species not as a nation!



if we could be successful in this project, we will be better prepare for the next invasion. We will be ready for the next wave.



I'm so so sorry if my inaction and delayed and it will cause you an infection in future or even death. I think nature has already fought back and the planet needs a breathing space to recover - perhaps this is a sign that the mother's Earth is warning us!



    "Mending your way or face the consequences!" 



Let's make 2020 a year that we all go back to the basic necessity and let freeze the declining economy and let's work together to get the mother Earth back to health. 

"#COVID-19, #virus, #nano"


If I don't see you on this side - maybe we will meet again on the other side - Godspeed my fellow human being!
Environment Variables in Vue
Tags: vue
Published: 2020-03-25 20:14:25

Sometimes you want your app to behave differently in local development and production. Maybe they should point to a different backend or use different API keys. Vue has very good documentation about it, [Modes and Environment Variables](https://cli.vuejs.org/guide/mode-and-env.html#environment-variables). But I will try to keep it shorter, for the use I often need.

You can create differently `.env` files at the root of your project.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/mbx46o2my2hhdf7b10fm.PNG)

Alternatives:
```
.env                    # loaded in all cases
.env.local              # loaded in all cases, ignored by git
.env.development        # for vue-cli-service serve
.env.development.local  # for vue-cli-service serve, ignored by git
.env.test               # for vue-cli-service test:unit
.env.test.local         # for vue-cli-service test:unit, ignored by git
.env.staging            # custom mode, for --mode staging
.env.staging.local      # custom mode, for --mode staging, ignored by git
.env.production         # for vue-cli-service build and vue-cli-service test:e2e
.env.production.local   # for vue-cli-service build and vue-cli-service test:e2e, ignored by git
```

env files with .local are ignored by git, so you can keep keys you don't want to be exposed there.

The format of the environment variables is `key=value`. For variables to be statically embedded into the client bundle, meaning it is available in your JavaScript code, it needs to start with `VUE_APP_` (`NODE_ENV` and `BASE_URL` are also available).

Examples of use cases:
_.env_:
```
VUE_APP_API_URL=https://mycoolapi.com
VUE_APP_API_KEY=[PUBLIC_KEY]
```

_.env.development_:
```
VUE_APP_API_URL=http://localhost:8080
```

_.env.development.local_:
```
VUE_APP_API_KEY=[PRIVATE_KEY]
```

Then you can get the variables from the JavaScript code like this:

```js
const url = process.env.VUE_APP_API_URL;
```

That's it :) 

Remember to avoid exposing private secrets in the bundle. Even though if you have it in .env.local, it will be "somewhere" in the bundle after npm run build, though it is hard to find.
Must try Docker feature
Tags: docker, devops
Published: 2020-03-25 19:08:37

Working on docker can be time and disk consuming process. I discovered this feature recently, I feel like its really underrated.

## Remote host via ssh

`export DOCKER_HOST=ssh://user@123.432.543.234`

setting this `DOCKER_HOST` flag will use your remote machine where docker is installed as the default host. 

## My workflow

I stored the above flag in my shell profile (zsh) and whenever I want to push some code, I update my docker-compose file and simply run respective build and start command and everything is pushed to my remote host automatically and securely using ssh, and without running a single container on my local machine. There's no need for me to have complex github actions and heroku setups etc. It just works!

Its been a real life saver for me, hope someone out there will find it useful as-well.
Creating Modularized Stateless APIs with Laravel 7.x
Tags: php, laravel, api, webdev
Published: 2020-03-25 19:08:15

I work with the Laravel framework since it was on version 4.x and I really love the Framework and the things that it provides. But when I started to work with more complex applications and creating APIs with it, I missed some things. So I saw myself doing the same configurations and changing the default Laravel installation structure quite some times. So I decided to create a Skeleton structure for myself and also to use as the base structure for the new API for my company, that’s when I created LarAPI and made it as an Open Source project this week:

[https://github.com/WendellAdriel/larapi](https://github.com/WendellAdriel/larapi)

This Skeleton has a lot of things already configured out-of-the-box:

- JWT Authentication
- User Roles
- API documentation with Swagger
- Exception Handler configured to return only JSON responses
- Base classes with common features for projects
- Git Hooks to lint the code, run tests and update the API documentation automatically

I’m still planning to add more things, but you can start using it right now!!! Check out the repository for the complete documentation and to know how to use it.
If you want to help, give it a star and share with your friends!
How to Creat Executable Commands in Standard ML
Tags: standardml, functional
Published: 2020-03-25 18:59:52

`Standard ML` programs are often used in interactive shells(?) However, we can not only use it in an interactive shell, but also compile it to create executable commands.

## To get a command name and arguments
In `Standard ML`, `CommandLine` structure provides `name` function and `arguments`. Command names and command line arguments will be obtained by them.

### `name` function

```sml
— CommandLine.name;
val it = fn: unit -> string
```

`CommandLine.name ()` yields the command name as a string.

### `arguments` function

```sml
- CommandLine.arguments;
val it = fn: unit -> string list
```

`CommandLine.arguments ()` gives command line arguments as a list of string types.

## Termination process

To close the program and return to the shell, use the `Process.exit` function of `OS` structure.

```sml
- OS.Process.exit
val it = OS.Process.status -> 'a
```

The argument `OS.Process.status` is an exit status data type to pass to the shell. There are two types:

- `OS.Process.success`: Success (Corresponds to `EXIT_SUCCESS` in C)
- `OS.Process.failure`: Failure (Corresponds to `EXIT_FAILURE` in C)

## To run a program

```sml
val arg = someFunc1
val _ = (someFunc2 arg; ...)
```

You can execute defined functions by evaluating them at the top level. The return value of functions should be discarded using an underscore or serial execution if they only use side effects.

## Example
If you compile it with `mlton`, it becomes an executable.

```sml
(* someCommand.sml *)
val n = ref 0
fun prName () = print ("Name: \n" ^ CommandLine.name () ^ " \n")
fun prArg () = foldl (fn (z, unt) => print ((n := !n + 1; Int.toString (!n)) ^ ":" ^ z ^ " \n")) (print "Arguments: \n") (CommandLine.arguments ())
val _ = (prName (); prArg (); OS.Process.exit (OS.Process.success))
```

```
$ mlton someCommand.sml
$ ./someCommand a b c d
Name:
./someCommand
Arguments:
1: a
2: b
3: c
4: d
```

## Reference
[sml-family.org (Standard ML Main Site)] (http://sml-family.org/Basis/)
Typescript - testando dados internos
Tags: typescript, testing, contributorswanted
Published: 2020-03-25 18:57:40

No post anterior eu disse que abri uma [issue](https://github.com/microsoft/TypeScript/issues/37513) no projeto da linguagem Typescript para permitir a exposição de dados internos e facilitar os testes unitários, mas o time da Microsoft acha que é um recurso fora de escopo por não estar de acordo com as semânticas definidas pelo Javascript. Então, criei um pacote no npm com essas atualizações e dei o nome de [typescript-x](https://www.npmjs.com/package/@filipe.beck/typescript-x) (precisei criar um escopo porque o nome era muito similar a um já existente). Já estou usando ele para testar o pacote [ts-infer](https://www.npmjs.com/package/ts-infer) e [esse commit](https://github.com/FilipeBeck/ts-infer/commit/e7be3238fe5685899bcbe391341b64c5ef2af3ef) mostra como estou fazendo para usá-lo. Quero destacar dois pontos:

### Inferência pelo VSCode

Após instalar o pacote, com `npm install @filipe.beck/typescript-x`, é necessário adicioná-lo em `.vscode/settings.json`:

```json
{
  "typescript.tsdk": "node_modules/@filipe.beck/typescript-x/lib"
}
```

Depois disso, pressione `F1` e selecione a versão adequada:

- ![Selecionar versão da linguagem](https://i.imgur.com/YmTxM80.png)

- ![Selecionar versão da linguagem](https://i.imgur.com/J5Md8U5.png)

### Configuração do projeto

Eu criei uma pasta `test` com um arquivo `tsconfig.json` extendendo a configuração original e adicionando a opção `testEnvironment`. Essa opção vai exportar todos os membros de módulos e publicar todos os membros de classes.

```json
{
  "extends": "../tsconfig",
  "compilerOptions": {
    "testEnvironment": true,
    "outDir": "./js-environment"
  },
  "include": ["./"]
}
```

E é isso. Com essa configuração, posso acessar todos os dados internos dos módulos ao realizar os testes e manter os arquivos de release intactos.
How to Send Email in Laravel 7 with Mailtrap
Tags: laravel, email, example
Published: 2020-03-25 18:56:07

Hey Artisan 

Hope you are doing well. Today i am going to discuss about laravel email. Now i will show you how to send email in laravel 7. Earlier i showed many tutorial about laravel email.

https://www.codechief.org/article/how-to-send-email-in-laravel-7-with-mailtrap
How to Set Limit Login Attempts in Laravel 7
Tags: laravel, auth, login, throttling
Published: 2020-03-25 18:55:07

Hey Artisan

Did you know that you can block user after doing bad attempts to log in. if you don't know then you are a right place. Today i am going to show you how we can block user after doing some bad attempts to log in.

You can change that limit as you want. If you want to do laravel custom login throttling, then do it. It is very simple. You can change limit login attemps from the throttle trait also. 

https://www.codechief.org/article/how-to-set-limit-login-attempts-in-laravel-7
Create Your Own Multilevel Nested Comments System in Laravel
Tags: laravel, comment, reply
Published: 2020-03-25 18:54:22

Hey Artisan

Hope you are doing well in Laravel. Today i am coming with a brand new tutorial. Today i am going to discuss about nested comment and reply system in Laravel 7. Hope you will enjoy it.

https://www.codechief.org/article/create-your-own-multilevel-nested-comments-system-in-laravel
AWS Lambda Abuse
Tags: aws, serverless
Published: 2020-03-25 18:44:33

---
title: AWS Lambda Abuse
published: true
description: 
tags: aws, serverless
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/eot5a00cegl4yxrt2xvr.jpeg
---

[When you deploy an endpoint that is open to the world](https://luminousmen.com/post/how-to-start-your-blog-for-20-cents), you open it not only for use but also for abuse.

AWS provides services to avoid common abuse methods, such as AWS Shield, which mitigates against DDoS. But it doesn't know what is and isn't abusive either.

Of course, if your Lambda feature is private, then you should use one of the API gateway security mechanisms to prevent abuse:

- IAM security
- API key security
- Custom security authorization

If one of them is present, the Lambda function can only be called by authorized users. Cool!

*But what to do when your Lambda is open to the public?*

Not much, unfortunately.

One of the factors that you might want to control is concurrency or the number of simultaneous requests that are supported per account and per function. You are billed for each request plus the total memory allocation per request, so this is the unit that you want to control. [Here](https://itnext.io/the-everything-guide-to-lambda-throttling-reserved-concurrency-and-execution-limits-d64f144129e5) is a pretty cool post about this. By the way, you can control this even at the Zappa settings level(!), check `lambda_concurrency`.

In addition to the limits for each account and for Lambda calls, you can also control Lambda exposure by wrapping up calls to the [API Gateway](https://aws.amazon.com/api-gateway/) and Create and use [API Gateway Usage Plans](https://docs.aws.amazon.com/apigateway/latest/developerguide/api-gateway-api-usage-plans.html). 

Using [API Gateway Limits](https://docs.aws.amazon.com/apigateway/latest/developerguide/api-gateway-api-usage-plans.html) to create usage plans per customer, you can control API and Lambda access to prevent uncontrolled account billing.

------

**Thank you for reading!**

Any questions? Leave your comment below to start fantastic discussions!

Check out [my blog](https://luminousmen.com/) or come to say hi 👋 on [Twitter](https://twitter.com/luminousmen) or subscribe to [my telegram channel](https://t.me/iamluminousmen).
Plan your best!
Laravel 7 | Route Model Binding
Tags: laravel, routemodelbinding
Published: 2020-03-25 18:43:31

Hey Artisan

I think you have already known that route model binding is enhanced by taylor otwell in Laravel 7. Today i will show you how route model binding works in Laravel 7.  

Sometimes you may wish to resolve Eloquent models using a column other than id. To do so, Laravel 7 allows you to specify the column in the route parameter definition

https://www.codechief.org/article/laravel-7-route-model-binding
Laravel Auth| Laravel 7 Authentication Example 
Tags: laravel, auth, laravel7
Published: 2020-03-25 18:42:20

Hey Artisan 

Do you know how to make authentication in Laravel 7 ? If you don't know then you are a right place. I will help you to create auth using laravel ui package in Laravel 7. In this tutorial i will show you simple authentication in laravel 7.

https://www.codechief.org/article/laravel-auth-example-laravel-7-authentication-example
Even though you've been using Emacs for a long time, you usually use arrow keys, you shouldn't edit the file.
Tags: emacs, emacslisp
Published: 2020-03-25 18:42:05

Stupid people who always use arrow keys to control cursors are not entitled to edit the file. (I was inspired by [this article] (https://qiita.com/Sa2Knight/items/b6efbc3f475cc57d228f).)

```elisp:
(global-set-key [up] 'kill-emacs)
(global-set-key [down] 'kill-emacs)
(global-set-key [left] 'kill-emacs)
(global-set-key [right] 'kill-emacs)
```

| Behavior | Key Binding | How to remember |
| :--: | :-- | :-- |
| Move Cursor 1 Line **Up** | C-**p** | **p**reverious |
| Move Cursor 1 Line **Down** | C-**n** | **n**ext |
| Move Cursor 1 Character to **Left** | C-**b** | **b**ackward |
| Move Cursor 1 Character to **Right** | C-**f** | **f**orward |

**Note:** This is a joke. Unlike `save-buffers-kill-terminal `, which is assigned to `C-x C-c`, `kill-emacs` forces Emacs to drop without warning even if it has not been saved. I will not be responsible for the loss of important edited data if automatic backup is turned off.
The Transformative Power of Free
Tags: webdev, showdev, startup
Published: 2020-03-25 18:41:59

About a week ago, I made my website [Rocket Spelling](https://www.rocketspelling.com/) completely free:

{% twitter 1239688897703141376 %}

The response since then has been amazing. **Before making it free, Rocket Spelling had 115 paying customers. In the past week, over 1,500 teachers have joined.** Here's the graph of unique users per day for the last 28 days:

![Usage spiked after making Rocket Spelling free.](https://dev-to-uploads.s3.amazonaws.com/i/bed5ytxfnbrd12pjtrbz.png)

The response took me totally off guard. I wasn't expecting this kind of spike, so I've been trying to decipher what went on.

# What's up with money?
Money clearly acted as a real roadblock to teachers, but it isn't immediately obvious why. Is Rocket Spelling too expensive to afford? This may sometimes be true, but I suspect that most schools with access to computers can afford to pay. If a teacher wants to use the website, all they need to do is ask the district for funding!

So why is money such a hinderance? I suspect that "all they need to do" is the problematic phrase.

# The problem isn't price. It's pain.
Paying money takes effort. To pay for an account, a teacher needs to get other people involved. It's a lot of work, which poses a real barrier to getting started. Every barrier reduces the number of people who will use the service massively.

Before this week, I had read about "sales funnels" and "removing friction from the customer journey" and other business jargon, but it all felt too impersonal to matter. Now I get it. Here's the message:

**If you want people to do something, make it easy. Then make it easier. Then easier again.** Here's how:
1. Make it free
2. Make it fast
3. Make it obvious

# Remove barriers.
The recent spike in traffic has taught me that there are *massive* gains to be made by simply removing barriers to entry. Breaking down walls, even little ones, makes your service much more valuable to potential users.

This is exciting news! It means that improving conversion is simple. Every time there's a button, instruction, or input, ask yourself:
* Is this action 100% necessary?
* Can it happen later?

Does the user really have to make a password, or can they sign in using their favorite social platform like Github, Google, or Twitter? Do they really have to sign in at all? (The answer might be no: Wikipedia lowered the barrier to entry by allowing anyone to edit pages, even without an account.)

Do they really have to pay? If yes, do they have to pay *now*?

Removing barriers is a simple way to massively improve the user experience, and it doesn't take a genius to ask the question "Is this step necessary?"

*Cover photo by [Ali Yahya](https://unsplash.com/@ayahya09?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText) on Unsplash*