iranjunior

Evite erros em produção com Erro Boundary.

Olá amigos, como meu primeiro post aqui no medium trouxe um assunto que é importante para todos os desenvolvedores: os erros em produção. Todos nós desenvolvedores estamos sujeitos a errar na construção de uma feature ou até tentando corrigir algo que fizemos errado.

Não podemos controlar o que vamos errar e principalmente o que vai passar desapercebido por nós na hora da construção da tela, ou mesmo um cenário específico que pode levar a um erro no front. Coisas que talvez não sejam percebidos por nós no desenvolvimento, ou pelo pessoal de qualidade nos testes.

Porém, podemos controlar como esse erro será renderizado na tela, e para isso vamos contar com a ajuda do conceito batizado pela equipe do React como Erro Boundary .

O que se trata

iranjunior

Dicas e Truques

a idieia eh deixar algums snippets que sao de grande valia para uso futuro.

Array Sem duplicacoes

const noDuplicate = (arr) => [...new Set(arr)]
const a = noDuplicate([1, 3, 5, 1, 4, 6,])

iranjunior

Common Options

-#, --progress-bar Make curl display a simple progress bar instead of the more informational standard meter.

-b, --cookie <name=data> Supply cookie with request. If no =, then specifies the cookie file to use (see -c).

-c, --cookie-jar <file name> File to save response cookies to.

iranjunior

Monolito

• Faz sentido em alguns casos, como o caso do StackOverFlow (representada pela Roberta ArcoVerde), que tem um nivel alto de senioridade na equipe. Uma base de codigo de mais de 10 anos, não tem uma alta rotatividade de funcionarios, e tem uma regra de negocio simples em relação a outras companhias
• Monolito é uma arquitetura, e não é muito convidativo ao desenvolvimento paralelo, e quando há muitas chamadas em paralelo. Mas se for bem construido, obedecendo a um padrão, não seria problemas continuar evoluindo. O monolito é uma arquitetura e só faz sentido seu uso quando houver problemas de arquitetura.

iranjunior

import React from 'react'
import PropTypes from 'prop-types'
import './ProgressiveBar.scss'

function ProgressiveBar({ steps, current }) {
  const RenderLines = () => {
    const classNames = []
    for (let i = 1; i <= steps; i += 1) {
      classNames.push(i < current ? 'actived' : i === current ? 'active' : '')
    }

iranjunior

# Type queries into this side of the screen, and you will 
# see intelligent typeaheads aware of the current GraphQL type schema, 
# live syntax, and validation errors highlighted within the text.

# We'll get you started with a simple query showing your username!
query { 
  user(login: "iranjunior"){
    bio,
    login
    gists(

iranjunior

import React, { useState } from 'react';
import { FixedSizeList as List } from 'react-window';
import { Query } from 'react-apollo';
import { GET_POKEMONS } from './graphql'
import './App.css';


const Item = ({image, name, style}) => (
  <div className="card" style={{backgroundImage: `url(${image})`, ...style}}>
    <div className="card-content">

iranjunior

{
  "estados": [
    {
      "cod": "1",
      "sigla": "AC",
      "nome": "Acre",
      "cidades": [
        {
        "cod": "53",
        "uf": "Acrelândia"

iranjunior

map  $ssl_client_s_dn  $ssl_client_s_dn_cn {
	default "";
	~/CN=(?<CN>[^/]+) $CN;
}

server {
	listen 80;
	listen [::]:80;

	listen 443 ssl;

iranjunior

map  $ssl_client_s_dn  $ssl_client_s_dn_cn {
	default "";
	~/CN=(?<CN>[^/]+) $CN;
}

server {
	listen 80;
	listen [::]:80;

	listen 443 ssl;