Skip to content

Instantly share code, notes, and snippets.

Working from home

Roberto Oliveira IsTheJack

Working from home
View GitHub Profile
IsTheJack /
Created Feb 6, 2020
How to protect the CSS scope properly using SASS and BEM

How to protect the CSS scope properly using SASS and BEM

Some truths about css:

  • CSS works in cascade
  • CSS works globally

Some Problems with Cascade

  • You could have problems with specificities
View 524_phrasal_verbs.json
"Ache For",
"Act Out",
"Add On",
"Add Up",
"Agree With",
"Aim At",
"Answer Back",
"Apply For/To",
"Ask Around",
View 3000_more_common_english_words.json

Criar Lista de Produtos

Olá! Precisamos criar uma tela de inventário de produtos, mas antes vamos criar um componente de lista. Esse componente tem algumas características.

  • Exibe a foto de um produto
    • A foto pode não existir
  • Divide em meses baseando-se na data de criação de um produto

Imagem do component

IsTheJack / kb_black_friday_dump.json
Created Nov 30, 2019
Real life dump from a huge tech Brazilian E-commerce
View kb_black_friday_dump.json
This file has been truncated, but you can view the full file.
"quant_ofertas": 1086,
"categorias": [
"nome": "Hardware",
"amigavel": "hardware",
"codigo": 1,
"secs": [
View oscar_female.csv
Index Year Age Name Movie
1 1928 22 Janet Gaynor Seventh Heaven, Street Angel and Sunrise: A Song of Two Humans
2 1929 37 Mary Pickford Coquette
3 1930 28 Norma Shearer The Divorcee
4 1931 63 Marie Dressler Min and Bill
5 1932 32 Helen Hayes The Sin of Madelon Claudet
6 1933 26 Katharine Hepburn Morning Glory
7 1934 31 Claudette Colbert It Happened One Night
8 1935 27 Bette Davis Dangerous
9 1936 27 Luise Rainer The Great Ziegfeld
View extanded-selection.json
"name":"Eat In",
"description":"Est alias quam voluptatem illum repellendus id eligendi."
IsTheJack / storybook-example.jsx
Created Apr 18, 2019
Just a simple use of the Storybook
View storybook-example.jsx
import * as React from 'react'
// tslint:disable-next-line: no-implicit-dependencies
import { storiesOf } from '@storybook/react'
import ComponentName from './ComponentName'
storiesOf('ComponentName', module)
.add('some case of use', () => (
<ComponentName>Hello Button!!!</ComponentName>
IsTheJack / simple-test.js
Created Apr 18, 2019
Simple component test using Jest, React DOM and React
View simple-test.js
// This file should be named as Button.spec.tsx
import * as React from 'react'
import * as ReactDOM from 'react-dom'
import Button from './'
describe('component Button', () => {
it('renders without crashing', () => {
const div = document.createElement('div')
ReactDOM.render(<Button />, div)
View Dockerfile
# This Dockerfile is for the development environment
FROM node:latest
# Some dependencies for Cypress
RUN apt-get update
RUN apt-get install xvfb libgtk2.0-0 libnotify-dev libgconf-2-4 libnss3 libxss1 libasound2 -y
# Define folder in container
RUN mkdir -p /app