Tecnologias usadas na Cubos

Victor

Web dev

@vhfmag

slides.com/
vhfmag/
tecnologias-da-cubos/

live

O que fazemos

Web
Nativos
Totens

Aplicativos

Dashboards

Plataformas

Web

Linguagem

import { observer, action } from "mobx";

export interface Task {
    id: string;
    text: string;
    done: boolean;
}

export class TodoStore {
    @observable
    public tasks: Task[] = [];
    
    @action
    public createTask = (task: Task) => {
        this.tasks.push(task);
    }

    @action
    public editTask = (i: number, task: Task) => {
        this.tasks[i] = task;
    }
    
    @action
    public deleteTask = (i: number) => {
        this.tasks.splice(i, 1);
    }
}

React + MobX

Bundling

Sites estáticos

Folhas de Estilo

Apps Nativos

Android

Linguagem

import kotlinx.android.synthetic.main.activity_main.fab
                
class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        // ...
        fab.setOnClickListener {
            toast("Hello!")
        }
    }
}

class Greeter(val name: String) {
   fun greet() { 
      println("Hello, $name")
   }
}

String Interpolation to cut down ceremony.
fun main(args: Array<String>) {
   Greeter(args[0]).greet()
}

Gerenciamento e persistência de dados

Room

Deploy

Apps Nativos

iOS

Linguagem

let textView = UITextView(frame: CGRect(
    x: 20.0,
    y: 90.0,
    width: 250.0,
    height: 100.0
))
self.automaticallyAdjustsScrollViewInsets = false
    
textView.center = self.view.center
textView.textAlignment = NSTextAlignment.justified
textView.textColor = UIColor.blue
textView.backgroundColor = UIColor.lightGray

Networking

Gerenciamento de dependências

Deploy

Persistência de dados

Back-end

Plataforma

TypeScript + ES6+

import { observer, action } from "mobx";

export interface Task {
    id: string;
    text: string;
    done: boolean;
}

export class TodoStore {
    @observable
    public tasks: Task[] = [];
    
    @action
    public createTask = (task: Task) => {
        this.tasks.push(task);
    }

    @action
    public editTask = (i: number, task: Task) => {
        this.tasks[i] = task;
    }
    
    @action
    public deleteTask = (i: number) => {
        this.tasks.splice(i, 1);
    }
}