teleren/devto huggingface dataset:
Decided to Start Programming
Tags: beginners, ruby
Published: 2020-12-21 01:17:38

I’m pretty new to the blogging world, so you’ll have to give me a little leeway. The reason I’m here is that I recently started a full-time online software engineering bootcamp at Flatiron School, and one of their requirements is to keep track of the journey a bit through blog posts. So since this is the first one, I’ll just give a little introduction and how I got here. 

I studied Spanish in college …and French, and linguistics, and translation, and religious studies, and philosophy, and Latin American history. You might say I was a little all over the place, but I have a wide variety of interests, what can I say? So if I have all these liberal-arts-y social science interests, what am I doing trying to get into programming? Well I’ll spare everyone a sob story about how my first grade teacher told me I was bad at math, but the cliff notes version is that my K-12 education was great for a lot of things (shout out to my first grade teacher), but STEM was not one of them. The emphasis at every school I went to was arts, humanities, writing, social sciences, language, etc. so I thought that’s what I was good at and what I should do. And I actually think it’s a super common thing that doesn’t get that much press: kids grow up thinking they’re bad at math because their math education just wasn’t very good, or being good at it was stigmatized.

Well, turns out my brain’s definitely wired for engineering, and not knowing that at the time, college was a pretty big struggle for me. I ended up dropping out after several years’ worth of valiant attempts to fight my natural brain to help my mom run the family small business (equipment rentals for events). Anyone surprised that most of what I did for the next two years there was a combination of carpentry, electrical repairs, building renovations, accounting, profitability, and financial projections?  …Because I definitely was! Fixing stuff and crunching numbers in excel isn’t exactly what 18 year old me thought would be my favorite part of my future job. And teenage me definitely wouldn’t have thought I’d spend my free time taking apart traffic lights, building giant operation tables, and scrolling through Python tutorials.   

So now here I am, looking to switch careers to a field that aligns better with my natural abilities. And for me, as much as I love to research stuff on my own and go down deep random project rabbit holes in my free time, if I’m going to really commit to something and prioritize it, I need more of an external structure. Huge respect to the people that can learn to program completely on their own (the resources are definitely out there to do it), but that can be a long lonely road. 

We’re just wrapping up the first month of a six-month full-time program and starting to get into some exciting stuff with Ruby. Hopefully future posts will be a little more technical as we dive a little deeper into the code, but since this is just the beginning, that’s about it for now.  

Thanks to anybody that read this far!
Sumário - Padrões de Projeto em Python
Published: 2020-12-21 01:09:46

####Padrões de projeto comportamentais
[Padrão Strategy](https://dev.to/mchlexe/padrao-strategy-em-python-2k8e)
[Padrão State](https://dev.to/mchlexe/padrao-state-1cig)
[Padrão Observer](https://dev.to/mchlexe/padrao-observer-em-python-dbg)
[Padrão Chain of Responsibility](https://dev.to/mchlexe/padrao-chain-of-responsibility-41c2)
[Padrão Command](https://dev.to/mchlexe/padrao-command-em-python-388)
[Padrão Template Method](https://dev.to/mchlexe/padrao-template-method-4dm4)

####Padrões de projeto criacionais
[Padrão Singleton](https://dev.to/mchlexe/padrao-singleton-4oia)
[Padrão Prototype](https://dev.to/mchlexe/padrao-prototype-10m4)
[Padrão Builder](https://dev.to/mchlexe/padrao-builder-em-python-5cbo)
[Padrão Abstract Factory](https://dev.to/mchlexe/padrao-abstract-factory-594c)

####Padrões de projeto estruturais
[Padrão Adapter](https://dev.to/mchlexe/padrao-adapter-em-python-470e)
[Padrão Facade](https://dev.to/mchlexe/padrao-facade-em-python-10if)
[Padrão Decorator](https://dev.to/mchlexe/padrao-decorator-em-python-1pdo)
[Padrão Proxy](https://dev.to/mchlexe/padrao-proxy-em-python-4kch)
[Padrão Bridge](https://dev.to/mchlexe/padrao-bridge-em-python-5d6l)
[Padrão Composite](https://dev.to/mchlexe/padrao-composite-em-python-17b0)
How to Install SynthWave '84 Theme in VScode and Enable Neon Dreams in OSX
Published: 2020-12-21 01:05:46

![SynthWave '84 ](https://dev-to-uploads.s3.amazonaws.com/i/w7qfrignv5dbnjz15y0h.png)


First, Open the next link in your favorite browser: 

https://marketplace.visualstudio.com/items?itemName=RobbOwen.synthwave-vscode

Click on the install button. 

For Select, your theme, go to the menu on the top bar: Code -> Preferences -> Color Theme and click there. In the list, select SynthWave '84. 

Now, in the visual studio code window, press the next shortcode: Shift + CMD + P and write Enable Neon Dreams, and select in the list: SynthWave '84: Enable Neon Dreams.

Excellent, now your favorite code editor uses SynthWave '84 with the feature Neon Dreams Enable. 

![Neon Dreams](https://github.com/robb0wen/synthwave-vscode/raw/master/theme.jpg)
Padrão Composite em Python
Published: 2020-12-21 01:02:00

O Composite é um **padrão de projeto estrutural**, ele permite que objetos sejam compostos em estrutura de árvore, esta podendo ser tratada como se fossem objetos individuais.

####Exemplo de código em Python
```python
class Component(ABC):

    @property
    def parent(self) -> Component:
        return self._parent

    @parent.setter
    def parent(self, parent: Component):

        self._parent = parent

    def add(self, component: Component) -> None:
        pass

    def remove(self, component: Component) -> None:
        pass

    def is_composite(self) -> bool:

        return False

    @abstractmethod
    def operation(self) -> str:

        pass


class Leaf(Component):

    def operation(self) -> str:
        return "Leaf"


class Composite(Component):

    def __init__(self) -> None:
        self._children: List[Component] = []

    def add(self, component: Component) -> None:
        self._children.append(component)
        component.parent = self

    def remove(self, component: Component) -> None:
        self._children.remove(component)
        component.parent = None

    def is_composite(self) -> bool:
        return True

    def operation(self) -> str:

        results = []
        for child in self._children:
            results.append(child.operation())
        return f"Branch({'+'.join(results)})"
```
A classe *Component* descreve as operações que são comuns para todos os elementos. A classe *Leaf* é um elemento básico que constitui a árvore e não pode ter sub-elementos, desta maneira ficam encarregados do trabalho final uma vez que não tem para quem delegá-lo. A classe *Composite* é o objeto que vai ter sub-elementos (folhas ou outros composites).
Quando um pedido é feito ele é repassado pelos objetos Composite, processando resultados intermediário, até concluir a requisição e retornar o resultado final.

A implementação em Python não tem nenhuma particularidade em relação a implementação em Java.

***
**Referências**
[Padrões de Projeto](https://diogomoreira.gitbook.io/padroes-de-projeto/) (Diogo Moreira, 2020)
[Mergulho nos Padrões de Projeto - v2020-1.14](https://refactoring.guru/pt-br/design-patterns/book) (Alexander Shvets, 2020)
*Os códigos usados como exemplo foram retirados do livro Mergulho nos Padrões de Projeto.*
Padrão Command em Python
Published: 2020-12-21 00:53:57

O command é um **padrão de projeto comportamental**, ele consiste em transformar requisições em objetos independentes que contém todas as informações necessárias sobre o pedido. Utilizar este padrão permite a parametrização de métodos com diferentes pedidos, enfileiramento de pedidos e maneiras de lidar com operações não suportadas.

####Exemplo de código em Python
```python
class Command(ABC):

    @abstractmethod
    def execute(self) -> None:
        pass


class SimpleCommand(Command):

    def __init__(self, payload: str) -> None:
        self._payload = payload

    def execute(self) -> None:
        print(f"SimpleCommand: See, I can do simple things like printing"
              f"({self._payload})")


class ComplexCommand(Command):

    def __init__(self, receiver: Receiver, a: str, b: str) -> None:

        self._receiver = receiver
        self._a = a
        self._b = b

    def execute(self) -> None:

        print("ComplexCommand: Complex stuff should be done by a receiver object", end="")
        self._receiver.do_something(self._a)
        self._receiver.do_something_else(self._b)


class Receiver:

    def do_something(self, a: str) -> None:
        print(f"\nReceiver: Working on ({a}.)", end="")

    def do_something_else(self, b: str) -> None:
        print(f"\nReceiver: Also working on ({b}.)", end="")


class Invoker:

    _on_start = None
    _on_finish = None

    def set_on_start(self, command: Command):
        self._on_start = command

    def set_on_finish(self, command: Command):
        self._on_finish = command

    def do_something_important(self) -> None:
        print("Invoker: Does anybody want something done before I begin?")
        if isinstance(self._on_start, Command):
            self._on_start.execute()

        print("Invoker: ...doing something really important...")

        print("Invoker: Does anybody want something done after I finish?")
        if isinstance(self._on_finish, Command):
            self._on_finish.execute()
```
Os pedidos realizados não são enviados diretamente ao destinatário. Todos os detalhes do pedido são implementados numa classe *Command*, esta serve como um link entre vários objetos e lógicas de negócio.


A implementação em Python não tem nenhuma particularidade em relação a implementação em Java.

***
**Referências**
[Padrões de Projeto](https://diogomoreira.gitbook.io/padroes-de-projeto/) (Diogo Moreira, 2020)
[Mergulho nos Padrões de Projeto - v2020-1.14](https://refactoring.guru/pt-br/design-patterns/book) (Alexander Shvets, 2020)
*Os códigos usados como exemplo foram retirados do livro Mergulho nos Padrões de Projeto.*
Video + Solution: Leetcode Increasing Triplet Subsequence
Tags: cpp, algorithms, leetcode, interview
Published: 2020-12-21 00:47:37

{% youtube oUNyC_KvECI %}

## Solution

```cpp
bool IncresingTripletSubsequence (vector<int> &nums) {
  int a = INT_MAX;
  int b = INT_MAX;

  for (int num : nums) {
    if (num <= a) {
      a = num;
    } else if (num <= b) {
      b = num;
    } else {
      return true;
    }
  }

  return false;        
}
```

## Complexity

Runtime: O(n)
Space: O(1)
React + display specific component based browser Size
Tags: react, webdev
Published: 2020-12-21 00:42:00


 In this article you're going to learn about creating a custom WindowResize component and how to use that within your React Project.
   - **Create a custom WindowResize component.**
   - **Using the WindowResize Component to display specific component.**


####First we will start off with creating the custom windowReSize Component.####

If you have an existing react project then create a new folder called utils. Add a file within utils folder with a name WindowResize.js.

Within WindowReSize.js file you will add the following code. To summarize what's going on here in one sentence then it's when a resize event is detected (there is a change in browser size) it will return the new height and width within dimensions. 

![Screen Shot 2020-12-20 at 6.46.26 PM](https://dev-to-uploads.s3.amazonaws.com/i/ppnhmvv8x7rzsk7q5pt7.png)

To Explain what's happening in depth, first we start off by creating an internal state called `dimensions`. which has a `height` and `width` properties. Within the `handleReSize` function when the resize event is detected we set the new state using the `SetDimensions`. At the end we return the `dimension` as mentioned before it will have height and width properties.    

####Now We are ready to use this custom WindowReSize component in our project.####

Here is an example of how I used the WindowReSize component in one of my project.

![Screen Shot 2020-12-20 at 6.22.42 PM](https://dev-to-uploads.s3.amazonaws.com/i/pd15xxy71g7g2le38ath.png)
 

First you have to import the WindowReSize component in a component where you want to use it. Since WindowReSize return a dimension which includes height and width, you can get both height and width properties. In my case I only got the width (`const { width } = useWindowSize();`). Then use a ternary operator where you check if the `width` of the browser is greater than **500** (here you can change the value to whatever you like) then you display `NavBar` else you display `Menu`. NavBar and Menu are two component are created separately. 

This is definitely useful when you want certain component to only show during mobile view.
Just a Single Screenshot
Published: 2020-12-21 00:37:39

---
title: Just a Single Screenshot
published: true
description: One screenshot can sell your app, get investors and change how you market and where you market your app.
tags: 
//cover_image: https://direct_url_to_image.jpg
---

Think about it.

We as developers, we build. And we build some more.

We take all that work and compress it into a few screenshots, maybe a video and a landing page that sells the product.

Imagine if it took you 3 years to build and build.

You launch and it's crickets. Your screenshots, videos and marketing are all missing the mark.

Do you pivot?

Are those three years for nothing? What do you do!

Sure -- nothing in the market happens quick especially out of obscurity. 

Why not, stop building? Start selling. Take a screenshot right now of your product. 

Congratulations - you are done. No more months of work or weeks of tweaking the UI in order to fit a possible problem you've decided you need to solve. Before anyone uses it.

So I say, stop building. Start selling. Show off your work and once you know, really, really know. Continue building.

Don't build in a silo. Find another way to feed the farm by turning that silo into a discotheque that brings people in from far and wide.

That's is all. You got this!

Launch, launch, launch.
Padrão Bridge em Python
Published: 2020-12-21 00:35:47

O Bridge é um **padrão de projeto estrutural**, ele permite a divisão de uma grande classe (ou conjuntos de classes acopladas) em duas hierarquias (abstração e implementação) que podem ser desenvolvidas de maneira independente.

####Exemplo de código em Python
```python
class Abstraction:
    def __init__(self, implementation: Implementation) -> None:
        self.implementation = implementation

    def operation(self) -> str:
        return (f"Abstraction: Base operation with:\n"
                f"{self.implementation.operation_implementation()}")


class ExtendedAbstraction(Abstraction):

    def operation(self) -> str:
        return (f"ExtendedAbstraction: Extended operation with:\n"
                f"{self.implementation.operation_implementation()}")


class Implementation(ABC):

    @abstractmethod
    def operation_implementation(self) -> str:
        pass


class ConcreteImplementationA(Implementation):
    def operation_implementation(self) -> str:
        return "ConcreteImplementationA: Here's the result on the platform A."


class ConcreteImplementationB(Implementation):
    def operation_implementation(self) -> str:
        return "ConcreteImplementationB: Here's the result on the platform B."
```
A classe *Abstraction* define a interface de controle, ela contém uma referência a um objeto *Implementation* e delega todo o trabalho para ele. Com a classe *ExtendedAbstraction* você consegue extender a classe *Abstraction* sem precisar mudar o código das implementações.
A classe *Implementation* vai ser a interface utilizada para criar os objetos onde estará a lógica a ser executada.

A implementação em Python não tem nenhuma particularidade em relação a implementação em Java.

***
**Referências**
[Padrões de Projeto](https://diogomoreira.gitbook.io/padroes-de-projeto/) (Diogo Moreira, 2020)
[Mergulho nos Padrões de Projeto - v2020-1.14](https://refactoring.guru/pt-br/design-patterns/book) (Alexander Shvets, 2020)
*Os códigos usados como exemplo foram retirados do livro Mergulho nos Padrões de Projeto.*
Padrão Observer em Python
Published: 2020-12-21 00:26:24

O Observer é um **padrão comportamental**, o objetivo dele é criar um objeto com a função de notificar múltiplos objetos sobre qualquer mudança que aconteça no objeto que está sendo observado por eles.
O padrão consiste basicamente de um vetor que armazena uma lista de referências aos objetos interessados nos estados e métodos públicos que adicionam e removem objetos dessa lista.

```python
class Subject(ABC):

    @abstractmethod
    def attach(self, observer: Observer) -> None:
        pass

    @abstractmethod
    def detach(self, observer: Observer) -> None:
        pass

    @abstractmethod
    def notify(self) -> None:
        pass

class Observer(ABC):
    @abstractmethod
    def update(self, subject: Subject) -> None:
        pass
```
A classe *Subject* é uma interface que declara os métodos para controlar quem recebe as notificações e notificá-los.
A classe *Observer* implementa o método de atualização, usado pelo *Subject*. Os observadores reagirão as atualizações enviadas pelo objeto monitorado a qual foram acoplados.

A implementação em Python não tem nenhuma particularidade em relação a implementação em Java.

***
**Referências**
[Padrões de Projeto](https://diogomoreira.gitbook.io/padroes-de-projeto/) (Diogo Moreira, 2020)
[Mergulho nos Padrões de Projeto - v2020-1.14](https://refactoring.guru/pt-br/design-patterns/book) (Alexander Shvets, 2020)
*Os códigos usados como exemplo foram retirados do livro Mergulho nos Padrões de Projeto.*
Padrão Proxy em Python
Published: 2020-12-21 00:11:07

O Proxy é um **padrão de projeto estrutural**, este consiste em fornecer um substituto ou espaço reservado para outro objeto. Para chegar até o objeto original a requisição precisa passar por esta barreira criada pelo proxy, a barreira pode servir para controlar acesso a esse método, fazer algo antes ou depois da requisição chegar até ele.

####Exemplo de código em Python
```python
class Subject(ABC):

    @abstractmethod
    def request(self) -> None:
        pass

class RealSubject(Subject):

    def request(self) -> None:
        print("RealSubject: Handling request.")


class Proxy(Subject):

    def __init__(self, real_subject: RealSubject) -> None:
        self._real_subject = real_subject

    def request(self) -> None:

        if self.check_access():
            self._real_subject.request()
            self.log_access()

    def check_access(self) -> bool:
        print("Proxy: Checking access prior to firing a real request.")
        return True

    def log_access(self) -> None:
        print("Proxy: Logging the time of request.", end="")
```
A classe *Subject* é uma interface que declara as operações comuns para as classes *RealSubject* e *Proxy*. Isso torna possível que o cliente consiga acesso aos métodos de *RealSubject* através do *Proxy* deixando aberta a possibilidade de trabalhar essa requisição da maneira que for necessária antes que ela chegue ao destino final.

A implementação em Python não tem nenhuma particularidade em relação a implementação em Java.

***
**Referências**
[Padrões de Projeto](https://diogomoreira.gitbook.io/padroes-de-projeto/) (Diogo Moreira, 2020)
[Mergulho nos Padrões de Projeto - v2020-1.14](https://refactoring.guru/pt-br/design-patterns/book) (Alexander Shvets, 2020)
*Os códigos usados como exemplo foram retirados do livro Mergulho nos Padrões de Projeto.*
Asp.Net Web Servis Giriş Rest-Ful Web Api
Tags: webservices
Published: 2020-12-21 00:11:04

**Web Servislere neden ihtiyaç duyulur ?**

>İnternete erişimi olan cihazların platform bağımlı olmaksızın bu cihazla iletişime geçmek ve http protokolü ile veri iletmek.

* Metotlarımızı http protokolü üzerinden paylaşabiliriz.
* Diğer yazılımcıların sadece arayüze odaklanması sağlanabilir.
* İş bölümü için uygundur


**Rest-Ful (Reperestantional State Transfer)** : Restful Api'ler yukarıdaki 3 özelliğin tamamını sağlar.

>Servislerde genelde ortak format olarak json format seçilir.

* Json format hem hafiftir. (Boyut olarak)
* Okunması diğer formatlara göre (xml vb..) çok daha kolaydır.
* Kabul görmüş bir formattır genelde bu uygulanır.


**Rest-ful Web Api**'ler http protokolü kullanır , yani bir url'e ihtiyacımız var. Kısaca yazacağımız servisi kullanabilmek için server'a atmamız ve internete açmamız gerekir.

* Url (https://api.github.com/users) 
* İnternet Media Type (Json,xml,images vs..)
* Standart HTTP Metodları kullanırız (GET,POST,PUT,DELETE vs..)

>WEB SERVİSLERİNİN AMACI FARKLI PLATFORMLAR  ARASINDA AYNI VERİ PAYLAŞIMINI SAĞLAMAK
O que é Redux?
Published: 2020-12-21 00:10:48


Redux é uma biblioteca para armazenamento de estados. Ele nasceu através de uma implementação do Flux, uma arquitetura criada pelo Facebook para contribuir com as aplicações de User Interface, utilizando o conceito de fluxo de dados unidirecional. Quando desenvolvemos aplicações utilizando Javascript, sempre temos que lidar com o gerenciamento de estado. O Redux veio para suprir essa necessidade de simplificar o controle dos estados de uma aplicação. Compartilhar estados entre vários componentes diferentes se torna uma coisa muito fácil quando o utilizamos.

Ele basicamente tira a responsabilidade de cada um dos componentes de armazenar os estados, deixando tudo isso centralizado, sendo utilizado ao mesmo tempo por todos os componentes de forma compartilhada. Ele também roda em diferentes ambientes como servidor, cliente e nativo.

Fazendo o uso do Redux todos esses estados ficarão armazenados em uma árvore de objetos através do store. Para que isso aconteça, o Redux utiliza 3 recursos:

Store: você pode pensar em store como um container ou um grande centro de informações, que tem disponibilidade para receber e entregar o que o seu componente requisita. A store armazena de forma centralizada todos os estados da aplicação. Vale ressaltar que a store é imutável.
Actions: São ações disparadas da aplicação para o store. Elas são criadas através das action creators. As actions são a única forma de acionar uma mudança de estados no store.
Reducers: Cada dado da store deve ter o seu próprio reducer. Ele é encarregado de lidar com todas as ações e especificam como o estado da aplicação irá mudar de acordo com a action que foi enviada para o store.
O fluxo geralmente funciona da seguinte forma: um componente gera uma interação através de um clique dado pelo usuário na interface – por exemplo, assim, um action creator é acionado e dispara uma ação para o store. Essa ação chega até um reducer que irá processar e fazer a alteração do estado no store. Assim um novo estado será disponibilizado para o componente.

Também é importante saber que o Redux tem 3 princípios, sendo:
– Todos os estados estarão disponíveis exclusivamente através do store: todo o estado da sua aplicação vai estar armazenado nesse store que é único, onde todos os componentes vão consultar nesse store.
– Os estados são somente leitura: os componentes não podem fazer uma manipulação direta nas informações que estão nele.
– As alterações são feitas através de funções puras: o Redux utiliza o conceito de programação funcional, por isso toda alteração no store é feita através de uma função pura, chamada de reducer. O reducer recebe o estado e a ação, onde com essa ação nós visualizamos o que precisa ser alterado no estado e o reduce entrega uma nova store do nosso estado da aplicação.

Bibliografia: https://www.treinaweb.com.br/blog/o-que-e-redux/