Como acontece a sincronização de dados entre um Website e um App?
Bom dia, sou iniciante em programação e entendo pouco sobre termos técnicos.
Tenho uma dúvida simples, mas que não sei como resolver nem consegui pesquisar sobre ela;
Supondo que uma equipe for desenvolver um App como o iFood via Flutter através do Graphcool,
Quais seriam os caminhos mais fáceis para programar um website em sincronia com o App?
Exatamente como no iFood, você pode fazer pedidos pelo website e eles aparecem instantaneamente no Aplicativo.
Todos os dados entre Website e App sendo compartilhados juntos como uma única plataforma; cadastros, pedidos, pagamentos...
Agradeço
Tenho uma dúvida simples, mas que não sei como resolver nem consegui pesquisar sobre ela;
Supondo que uma equipe for desenvolver um App como o iFood via Flutter através do Graphcool,
Quais seriam os caminhos mais fáceis para programar um website em sincronia com o App?
Exatamente como no iFood, você pode fazer pedidos pelo website e eles aparecem instantaneamente no Aplicativo.
Todos os dados entre Website e App sendo compartilhados juntos como uma única plataforma; cadastros, pedidos, pagamentos...
Agradeço
East
Curtidas 0
Melhor post
Sadasd
01/01/2020
Você cria uma api REST e faz com que o site e o app faça requisições HTTP a essa api, que retornará os dados em formato JSON, você extrai os dados que precisa do JSON e usa, agora vou explicar um pouco cada termo desses e depois você estuda mais a fundo, mas se prepara que o texto vai ser grande:
JSON:
JSON é um formato de arquivo(.json) e é usado na transferência de dados e é universal(não depende de plataforma), é uma sigla que significa JavaScript Object Notation, como você deve imaginar esse formato retorna um objeto JavaScript, mas não é necessário se trabalhar com a linguagem JavaScript para poder trabalhar com JSON, se dermos um console log num objeto javascript com nome = "fulano", idade = 30, pets = ["cao", "gato", "coelho"] o resultado seria esse aqui:
sendo os métodos do objeto omitidos, o formato JSON é exatamente assim, se tiver mais curiosidade pesquise JSON no google images, mas o fato é que tiramos as informações necessárias daí.
api:
Quando você começou em desenvolvimento web provavelmente estudou front end e seu professor te mandou fazer um site apenas com o front-end(HTML, CSS Javascript), ou seja, sem back-end, a api é o contrário, é um site sem front-end, ou melhor dizendo, é um site que te mostra um JSON ao invés de um html, olhe um exemplo de api aqui:
https://www.mercadobitcoin.net/api/BTC/orderbook/
em outras palavras, é o backend da sua aplicação, dessa forma você cria vários front-ends em várias plataformas diferentes e faz esses front-ends pegarem os dados do JSON da sua api, esse "pegar" dados é chamado de consumir, ou seja, você cria um front-end de um website, e de um app de celular, e ambos consomem sua api, se você conhece alguma tecnologia backend pode usá-la pra criar uma api, exemplo:
Rails do ruby
Node.js do Javascript
.NET do c#
laravel do php
spring do java
django do python
requisição HTTP:
Você deve ter dúvidas em relação à segurança disso de deixar os dados abertos assim na internet, e também de como se comunicar com a api mas não precisa se preocupar com isso, pois existe o que chamamos de HTTP request, que nada mais é do que o formulário da api, já que não temos front-end, não temos forms para nos logar/registrar, então as requisições HTTP fazem isso, você diz o que está enviando e o valor do que está enviando e a api averigua, e caso não tenha nada de errado a api te retorna outro JSON que a principio não estava visivel, por exemplo, num form de login você envia um e-mail e senha, e caso tenha algo de errado dá um erro, caso contrário você ganha acesso às informações da sua conta, na requisição HTTP é a mesma coisa, você declara que está enviando um e-mail, o valor(string) email, declara que está enviando uma senha, o valor(string) senha e envia, caso dê algum erro você receberá uma resposta(em formato JSON) informando do erro, caso contrário você recebe uma resposta(em formato JSON) com os dados da sua conta, vale frizar que o JSON com seus dados não está por ai na web em algum lugar ou armazenado, ele é gerado no momento da requisição apenas, utilizando seus dados no banco de dados da api e sendo enviada na forma de resposta.
REST:
Esse não é um conceito muito extenso, basta saber que existem diferentes verbos HTTP, e que api's RESTful(api's que implementam o conceito REST) utilizam quatro verbos HTTP para realizar as operações de um CRUD, aqui estão eles:
POST(Create)
GET(Read)
PUT(Update)
DELETE(Delete)
Há também alguns que separam atualização total de dados(PUT) de atualização parcial dos dados(PATCH), mas é mais raro achar sistemas com essa implementação.
JSON:
JSON é um formato de arquivo(.json) e é usado na transferência de dados e é universal(não depende de plataforma), é uma sigla que significa JavaScript Object Notation, como você deve imaginar esse formato retorna um objeto JavaScript, mas não é necessário se trabalhar com a linguagem JavaScript para poder trabalhar com JSON, se dermos um console log num objeto javascript com nome = "fulano", idade = 30, pets = ["cao", "gato", "coelho"] o resultado seria esse aqui:
{
"nome": "fulano",
"idade": 30,
"pets": [
"cao",
"gato",
"coelho"
]
}
sendo os métodos do objeto omitidos, o formato JSON é exatamente assim, se tiver mais curiosidade pesquise JSON no google images, mas o fato é que tiramos as informações necessárias daí.
api:
Quando você começou em desenvolvimento web provavelmente estudou front end e seu professor te mandou fazer um site apenas com o front-end(HTML, CSS Javascript), ou seja, sem back-end, a api é o contrário, é um site sem front-end, ou melhor dizendo, é um site que te mostra um JSON ao invés de um html, olhe um exemplo de api aqui:
https://www.mercadobitcoin.net/api/BTC/orderbook/
em outras palavras, é o backend da sua aplicação, dessa forma você cria vários front-ends em várias plataformas diferentes e faz esses front-ends pegarem os dados do JSON da sua api, esse "pegar" dados é chamado de consumir, ou seja, você cria um front-end de um website, e de um app de celular, e ambos consomem sua api, se você conhece alguma tecnologia backend pode usá-la pra criar uma api, exemplo:
Rails do ruby
Node.js do Javascript
.NET do c#
laravel do php
spring do java
django do python
requisição HTTP:
Você deve ter dúvidas em relação à segurança disso de deixar os dados abertos assim na internet, e também de como se comunicar com a api mas não precisa se preocupar com isso, pois existe o que chamamos de HTTP request, que nada mais é do que o formulário da api, já que não temos front-end, não temos forms para nos logar/registrar, então as requisições HTTP fazem isso, você diz o que está enviando e o valor do que está enviando e a api averigua, e caso não tenha nada de errado a api te retorna outro JSON que a principio não estava visivel, por exemplo, num form de login você envia um e-mail e senha, e caso tenha algo de errado dá um erro, caso contrário você ganha acesso às informações da sua conta, na requisição HTTP é a mesma coisa, você declara que está enviando um e-mail, o valor(string) email, declara que está enviando uma senha, o valor(string) senha e envia, caso dê algum erro você receberá uma resposta(em formato JSON) informando do erro, caso contrário você recebe uma resposta(em formato JSON) com os dados da sua conta, vale frizar que o JSON com seus dados não está por ai na web em algum lugar ou armazenado, ele é gerado no momento da requisição apenas, utilizando seus dados no banco de dados da api e sendo enviada na forma de resposta.
REST:
Esse não é um conceito muito extenso, basta saber que existem diferentes verbos HTTP, e que api's RESTful(api's que implementam o conceito REST) utilizam quatro verbos HTTP para realizar as operações de um CRUD, aqui estão eles:
POST(Create)
GET(Read)
PUT(Update)
DELETE(Delete)
Há também alguns que separam atualização total de dados(PUT) de atualização parcial dos dados(PATCH), mas é mais raro achar sistemas com essa implementação.
GOSTEI 2
Mais Respostas
East
01/01/2020
Você cria uma api REST e faz com que o site e o app faça requisições HTTP a essa api, que retornará os dados em formato JSON, você extrai os dados que precisa do JSON e usa, agora vou explicar um pouco cada termo desses e depois você estuda mais a fundo, mas se prepara que o texto vai ser grande:
JSON:
JSON é um formato de arquivo(.json) e é usado na transferência de dados e é universal(não depende de plataforma), é uma sigla que significa JavaScript Object Notation, como você deve imaginar esse formato retorna um objeto JavaScript, mas não é necessário se trabalhar com a linguagem JavaScript para poder trabalhar com JSON, se dermos um console log num objeto javascript com nome = "fulano", idade = 30, pets = ["cao", "gato", "coelho"] o resultado seria esse aqui:
sendo os métodos do objeto omitidos, o formato JSON é exatamente assim, se tiver mais curiosidade pesquise JSON no google images, mas o fato é que tiramos as informações necessárias daí.
api:
Quando você começou em desenvolvimento web provavelmente estudou front end e seu professor te mandou fazer um site apenas com o front-end(HTML, CSS Javascript), ou seja, sem back-end, a api é o contrário, é um site sem front-end, ou melhor dizendo, é um site que te mostra um JSON ao invés de um html, olhe um exemplo de api aqui:
https://www.mercadobitcoin.net/api/BTC/orderbook/
em outras palavras, é o backend da sua aplicação, dessa forma você cria vários front-ends em várias plataformas diferentes e faz esses front-ends pegarem os dados do JSON da sua api, esse "pegar" dados é chamado de consumir, ou seja, você cria um front-end de um website, e de um app de celular, e ambos consomem sua api, se você conhece alguma tecnologia backend pode usá-la pra criar uma api, exemplo:
Rails do ruby
Node.js do Javascript
.NET do c#
laravel do php
spring do java
django do python
requisição HTTP:
Você deve ter dúvidas em relação à segurança disso de deixar os dados abertos assim na internet, e também de como se comunicar com a api mas não precisa se preocupar com isso, pois existe o que chamamos de HTTP request, que nada mais é do que o formulário da api, já que não temos front-end, não temos forms para nos logar/registrar, então as requisições HTTP fazem isso, você diz o que está enviando e o valor do que está enviando e a api averigua, e caso não tenha nada de errado a api te retorna outro JSON que a principio não estava visivel, por exemplo, num form de login você envia um e-mail e senha, e caso tenha algo de errado dá um erro, caso contrário você ganha acesso às informações da sua conta, na requisição HTTP é a mesma coisa, você declara que está enviando um e-mail, o valor(string) email, declara que está enviando uma senha, o valor(string) senha e envia, caso dê algum erro você receberá uma resposta(em formato JSON) informando do erro, caso contrário você recebe uma resposta(em formato JSON) com os dados da sua conta, vale frizar que o JSON com seus dados não está por ai na web em algum lugar ou armazenado, ele é gerado no momento da requisição apenas, utilizando seus dados no banco de dados da api e sendo enviada na forma de resposta.
REST:
Esse não é um conceito muito extenso, basta saber que existem diferentes verbos HTTP, e que api's RESTful(api's que implementam o conceito REST) utilizam quatro verbos HTTP para realizar as operações de um CRUD, aqui estão eles:
POST(Create)
GET(Read)
PUT(Update)
DELETE(Delete)
Há também alguns que separam atualização total de dados(PUT) de atualização parcial dos dados(PATCH), mas é mais raro achar sistemas com essa implementação.
JSON:
JSON é um formato de arquivo(.json) e é usado na transferência de dados e é universal(não depende de plataforma), é uma sigla que significa JavaScript Object Notation, como você deve imaginar esse formato retorna um objeto JavaScript, mas não é necessário se trabalhar com a linguagem JavaScript para poder trabalhar com JSON, se dermos um console log num objeto javascript com nome = "fulano", idade = 30, pets = ["cao", "gato", "coelho"] o resultado seria esse aqui:
{
"nome": "fulano",
"idade": 30,
"pets": [
"cao",
"gato",
"coelho"
]
}
sendo os métodos do objeto omitidos, o formato JSON é exatamente assim, se tiver mais curiosidade pesquise JSON no google images, mas o fato é que tiramos as informações necessárias daí.
api:
Quando você começou em desenvolvimento web provavelmente estudou front end e seu professor te mandou fazer um site apenas com o front-end(HTML, CSS Javascript), ou seja, sem back-end, a api é o contrário, é um site sem front-end, ou melhor dizendo, é um site que te mostra um JSON ao invés de um html, olhe um exemplo de api aqui:
https://www.mercadobitcoin.net/api/BTC/orderbook/
em outras palavras, é o backend da sua aplicação, dessa forma você cria vários front-ends em várias plataformas diferentes e faz esses front-ends pegarem os dados do JSON da sua api, esse "pegar" dados é chamado de consumir, ou seja, você cria um front-end de um website, e de um app de celular, e ambos consomem sua api, se você conhece alguma tecnologia backend pode usá-la pra criar uma api, exemplo:
Rails do ruby
Node.js do Javascript
.NET do c#
laravel do php
spring do java
django do python
requisição HTTP:
Você deve ter dúvidas em relação à segurança disso de deixar os dados abertos assim na internet, e também de como se comunicar com a api mas não precisa se preocupar com isso, pois existe o que chamamos de HTTP request, que nada mais é do que o formulário da api, já que não temos front-end, não temos forms para nos logar/registrar, então as requisições HTTP fazem isso, você diz o que está enviando e o valor do que está enviando e a api averigua, e caso não tenha nada de errado a api te retorna outro JSON que a principio não estava visivel, por exemplo, num form de login você envia um e-mail e senha, e caso tenha algo de errado dá um erro, caso contrário você ganha acesso às informações da sua conta, na requisição HTTP é a mesma coisa, você declara que está enviando um e-mail, o valor(string) email, declara que está enviando uma senha, o valor(string) senha e envia, caso dê algum erro você receberá uma resposta(em formato JSON) informando do erro, caso contrário você recebe uma resposta(em formato JSON) com os dados da sua conta, vale frizar que o JSON com seus dados não está por ai na web em algum lugar ou armazenado, ele é gerado no momento da requisição apenas, utilizando seus dados no banco de dados da api e sendo enviada na forma de resposta.
REST:
Esse não é um conceito muito extenso, basta saber que existem diferentes verbos HTTP, e que api's RESTful(api's que implementam o conceito REST) utilizam quatro verbos HTTP para realizar as operações de um CRUD, aqui estão eles:
POST(Create)
GET(Read)
PUT(Update)
DELETE(Delete)
Há também alguns que separam atualização total de dados(PUT) de atualização parcial dos dados(PATCH), mas é mais raro achar sistemas com essa implementação.
Muito Obrigado. Você ajudou muito cara.
Sou autodidata na programação faço tudo na prática na base do erro, pesquisa e acerto. Mas tem coisas que nem sei como pesquisar.
Voltando um pouco, antes de acontecer todas essas transferências de dados entre Web e App, qual seria o método de desenvolvimento ideal de ambos?
Se no caso vier primeiro o App em Flutter no Graphcool a linguagem web seria qual? e o método mais rápido para desenvolver o website? eu posso aproveitar o código do App para o Website, já aproveitando para add todo o esquema de transferência de dados?
tem algum atalho para economizar tempo e não ter que desenvolver o Website do zero?
GOSTEI 0
Sadasd
01/01/2020
Você cria uma api REST e faz com que o site e o app faça requisições HTTP a essa api, que retornará os dados em formato JSON, você extrai os dados que precisa do JSON e usa, agora vou explicar um pouco cada termo desses e depois você estuda mais a fundo, mas se prepara que o texto vai ser grande:
JSON:
JSON é um formato de arquivo(.json) e é usado na transferência de dados e é universal(não depende de plataforma), é uma sigla que significa JavaScript Object Notation, como você deve imaginar esse formato retorna um objeto JavaScript, mas não é necessário se trabalhar com a linguagem JavaScript para poder trabalhar com JSON, se dermos um console log num objeto javascript com nome = "fulano", idade = 30, pets = ["cao", "gato", "coelho"] o resultado seria esse aqui:
sendo os métodos do objeto omitidos, o formato JSON é exatamente assim, se tiver mais curiosidade pesquise JSON no google images, mas o fato é que tiramos as informações necessárias daí.
api:
Quando você começou em desenvolvimento web provavelmente estudou front end e seu professor te mandou fazer um site apenas com o front-end(HTML, CSS Javascript), ou seja, sem back-end, a api é o contrário, é um site sem front-end, ou melhor dizendo, é um site que te mostra um JSON ao invés de um html, olhe um exemplo de api aqui:
https://www.mercadobitcoin.net/api/BTC/orderbook/
em outras palavras, é o backend da sua aplicação, dessa forma você cria vários front-ends em várias plataformas diferentes e faz esses front-ends pegarem os dados do JSON da sua api, esse "pegar" dados é chamado de consumir, ou seja, você cria um front-end de um website, e de um app de celular, e ambos consomem sua api, se você conhece alguma tecnologia backend pode usá-la pra criar uma api, exemplo:
Rails do ruby
Node.js do Javascript
.NET do c#
laravel do php
spring do java
django do python
requisição HTTP:
Você deve ter dúvidas em relação à segurança disso de deixar os dados abertos assim na internet, e também de como se comunicar com a api mas não precisa se preocupar com isso, pois existe o que chamamos de HTTP request, que nada mais é do que o formulário da api, já que não temos front-end, não temos forms para nos logar/registrar, então as requisições HTTP fazem isso, você diz o que está enviando e o valor do que está enviando e a api averigua, e caso não tenha nada de errado a api te retorna outro JSON que a principio não estava visivel, por exemplo, num form de login você envia um e-mail e senha, e caso tenha algo de errado dá um erro, caso contrário você ganha acesso às informações da sua conta, na requisição HTTP é a mesma coisa, você declara que está enviando um e-mail, o valor(string) email, declara que está enviando uma senha, o valor(string) senha e envia, caso dê algum erro você receberá uma resposta(em formato JSON) informando do erro, caso contrário você recebe uma resposta(em formato JSON) com os dados da sua conta, vale frizar que o JSON com seus dados não está por ai na web em algum lugar ou armazenado, ele é gerado no momento da requisição apenas, utilizando seus dados no banco de dados da api e sendo enviada na forma de resposta.
REST:
Esse não é um conceito muito extenso, basta saber que existem diferentes verbos HTTP, e que api's RESTful(api's que implementam o conceito REST) utilizam quatro verbos HTTP para realizar as operações de um CRUD, aqui estão eles:
POST(Create)
GET(Read)
PUT(Update)
DELETE(Delete)
Há também alguns que separam atualização total de dados(PUT) de atualização parcial dos dados(PATCH), mas é mais raro achar sistemas com essa implementação.
JSON:
JSON é um formato de arquivo(.json) e é usado na transferência de dados e é universal(não depende de plataforma), é uma sigla que significa JavaScript Object Notation, como você deve imaginar esse formato retorna um objeto JavaScript, mas não é necessário se trabalhar com a linguagem JavaScript para poder trabalhar com JSON, se dermos um console log num objeto javascript com nome = "fulano", idade = 30, pets = ["cao", "gato", "coelho"] o resultado seria esse aqui:
{
"nome": "fulano",
"idade": 30,
"pets": [
"cao",
"gato",
"coelho"
]
}
sendo os métodos do objeto omitidos, o formato JSON é exatamente assim, se tiver mais curiosidade pesquise JSON no google images, mas o fato é que tiramos as informações necessárias daí.
api:
Quando você começou em desenvolvimento web provavelmente estudou front end e seu professor te mandou fazer um site apenas com o front-end(HTML, CSS Javascript), ou seja, sem back-end, a api é o contrário, é um site sem front-end, ou melhor dizendo, é um site que te mostra um JSON ao invés de um html, olhe um exemplo de api aqui:
https://www.mercadobitcoin.net/api/BTC/orderbook/
em outras palavras, é o backend da sua aplicação, dessa forma você cria vários front-ends em várias plataformas diferentes e faz esses front-ends pegarem os dados do JSON da sua api, esse "pegar" dados é chamado de consumir, ou seja, você cria um front-end de um website, e de um app de celular, e ambos consomem sua api, se você conhece alguma tecnologia backend pode usá-la pra criar uma api, exemplo:
Rails do ruby
Node.js do Javascript
.NET do c#
laravel do php
spring do java
django do python
requisição HTTP:
Você deve ter dúvidas em relação à segurança disso de deixar os dados abertos assim na internet, e também de como se comunicar com a api mas não precisa se preocupar com isso, pois existe o que chamamos de HTTP request, que nada mais é do que o formulário da api, já que não temos front-end, não temos forms para nos logar/registrar, então as requisições HTTP fazem isso, você diz o que está enviando e o valor do que está enviando e a api averigua, e caso não tenha nada de errado a api te retorna outro JSON que a principio não estava visivel, por exemplo, num form de login você envia um e-mail e senha, e caso tenha algo de errado dá um erro, caso contrário você ganha acesso às informações da sua conta, na requisição HTTP é a mesma coisa, você declara que está enviando um e-mail, o valor(string) email, declara que está enviando uma senha, o valor(string) senha e envia, caso dê algum erro você receberá uma resposta(em formato JSON) informando do erro, caso contrário você recebe uma resposta(em formato JSON) com os dados da sua conta, vale frizar que o JSON com seus dados não está por ai na web em algum lugar ou armazenado, ele é gerado no momento da requisição apenas, utilizando seus dados no banco de dados da api e sendo enviada na forma de resposta.
REST:
Esse não é um conceito muito extenso, basta saber que existem diferentes verbos HTTP, e que api's RESTful(api's que implementam o conceito REST) utilizam quatro verbos HTTP para realizar as operações de um CRUD, aqui estão eles:
POST(Create)
GET(Read)
PUT(Update)
DELETE(Delete)
Há também alguns que separam atualização total de dados(PUT) de atualização parcial dos dados(PATCH), mas é mais raro achar sistemas com essa implementação.
Muito Obrigado. Você ajudou muito cara.
Sou autodidata na programação faço tudo na prática na base do erro, pesquisa e acerto. Mas tem coisas que nem sei como pesquisar.
Voltando um pouco, antes de acontecer todas essas transferências de dados entre Web e App, qual seria o método de desenvolvimento ideal de ambos?
Se no caso vier primeiro o App em Flutter no Graphcool a linguagem web seria qual? e o método mais rápido para desenvolver o website? eu posso aproveitar o código do App para o Website, já aproveitando para add todo o esquema de transferência de dados?
tem algum atalho para economizar tempo e não ter que desenvolver o Website do zero?
Uma pergunta de cada vez:
Qual o método ideal de desenvolvimento?
Criar a api primeiro e depois criar o app e o website, lembrando que a api vai ser a parte difícil da coisa, os outros dois vão ser só a parte visual + requisições HTTP
Qual a linguagem web?
Apenas o front-end, HTML, CSS e JavaScript, você só tem que aprender a faze requisições HTTP com a linguagem de programação(no caso JavaScript) e manipular a DOM para exibir esses dados
Método mais rápido para desenvolver website?
Frameworks, eles estão ai pra ajudar, para um iniciante você pode aprender jquery pra fazer as requisições, bootstrap para estilização, e caso julgue necessário um framework javascript(Vue, React, Angular), no caso, se você quer velocidade acho que será melhor o Vue, a sintaxe é muito mais enxuta, ou seja, dá pra aprender mais rápido do que os outros dois.
Posso aproveitar o código do app para o website?
Até certo ponto sim, dart também pode ser utilizado no front-end no lugar de JavaScript, de um jeito ou de outro você vai ter que aprender a fazer as requisições com dart pra fazer o app, então grande parte do código poderá ser aproveitado nesse quesito, mas não vai ser algo do tipo ctrl+c ctrl+v, você ainda vai ter que aprender a utilizar o dart no front-end para manipular o DOM
Existe algum atalho para não ter que criar o site do zero?
Sim, mas não é um atalho assim tão grande, os frameworks JavaScript que eu mencionei acima te dão a opção de criar um projeto com um comando de terminal, então a estrutura já vem pronta e você só cria os templates do site.
GOSTEI 1