Category Archives

6 Articles

Um clone do Instagram usando SwiftUI e GraphQL

Um clone do Instagram usando SwiftUI e GraphQL

Hoje estamos iniciando uma série de postagens no blog que ensinarão você a usar muitas ferramentas interessantes para criar sua própria rede social: um aplicativo que se assemelha ao Instagram.

Não economizaremos tecnologia e usaremos o melhor e o mais recente: Parse, GraphQL, um pouco de NodeJS e especialmente o framework SwiftUI da Apple (ainda a ser lançado). 

Isso levará algumas postagens para ser totalmente funcional, mas quando chegarmos lá, você perceberá como pode ser simples colocar suas ideias em funcionamento com muito pouco esforço aqui no Back4App.

Então, parece que é hora de…

Uma breve introdução

Bem, você provavelmente já conhece os enormes benefícios que o Parse traz para o seu processo de desenvolvimento, especialmente se hospedado no Back4App, pois nosso conjunto de ferramentas aumenta a produtividade em grandes quantidades.

E nossas publicações mais recentes sobre o  GraphQL  mostraram como é fácil manter o desenvolvimento de APIs ao longo do tempo, se você o usar. Se você perdeu essas postagens, sugiro fortemente que você reserve um tempo e as leia, pois elas melhorarão muito seu entendimento à medida que avançamos.

Você pode ler mais sobre o GraphQL  neste tutorial  e também temos um post completo sobre como usá-lo  neste artigo .

Você também pode ver alguma integração com o NodeJS em Cloud Code Functions  neste artigo .

Isso nos deixa com SwiftUI.

O SwiftUI é, de acordo com a Apple, “uma maneira inovadora e excepcionalmente simples de criar interfaces de usuário em todas as plataformas da Apple com o poder do Swift”.

Eu próprio gosto de pensar que o SwiftUI é mais do que isso.

Se você, como eu, está desenvolvendo software há algum tempo, provavelmente sabe que a comunidade de desenvolvedores sempre esteve dividida entre a conveniência de usar Storyboards, a interface de criação de UI de arrastar e soltar da Apple ou o poder da interface de usuário programática.

O SwiftUI vem para trazer o melhor dos dois mundos: é fácil o suficiente para os iniciantes aprenderem, enquanto mantém a capacidade de manutenção de uma interface do usuário codificada.

Combine isso com a renderização em tempo real, para que os desenvolvedores possam ver facilmente a saída visual do que eles estão codificando, e o façam de duas maneiras. Se você alterar o código, ele refletirá na interface do usuário e alterará graficamente a interface do usuário. no código, e o que você obtém é uma das maneiras mais poderosas e fáceis de fornecer interfaces de usuário com design bonito e manutenção ao longo do tempo.


Instagram Clone App using SwiftUI and GraphQL – HomeView

Instagram Clone App using SwiftUI and GraphQL – HomeView

Today in part 4 of our Instagram clone App with GraphQL we will continue learning some SwiftUI, building our Home view.

In our previous articles, we learned how to sign up a user and how to log in a user and created the Profile view with the respective UIs in our Instagram clone App. Today we will reuse some of that code and create something similar to a UIScrollView with lots of content.

Fast your seat belts and let’s get it going!

For better learning, download the iOS Instagram Clone project with source code.


An Instagram clone using SwiftUI and GraphQL – ProfileView

An Instagram clone using SwiftUI and GraphQL – ProfileView

Today in part 3 of our Instagram clone App with GraphQL we will get deeper into SwiftUI, building our Profile view.

We will learn to reuse structs in SwiftUI and discuss a few controls: VStack, HStack, GeometryReader, Text, Button, Spacer, Image, Divider among others.

In our previous articles, we learned how to sign up a user and how to log in a user, with the respective UIs in our Instagram clone App. Today we will make it much nicer.

Fast your seat belts and let’s get it going!

For better learning, download the iOS Instagram Clone project with source code.


An Instagram clone using SwiftUI and GraphQL – Login

An Instagram clone using SwiftUI and GraphQL – Login

In our previous post about how to create an Instagram clone app, you learned how to configure everything to have SwiftUI up and running in XCode 11, and created a fully working Sing Up view with GraphQL.

Today we will learn how to create a login view and have the user log out.

We will be needing the project from the previous post, so if you didn’t follow that one, I strongly suggest that you do.

Buckle your seat belts and let’s go!

For better learning, download the iOS Instagram Clone project with source code.


An Instagram clone using SwiftUI and GraphQL

An Instagram clone using SwiftUI and GraphQL

Today we are starting a series of blog posts that will teach you how to use a lot of cool tools to build your own Social Network: an application that resembles Instagram.

We won’t save up on tech and will be using the latest and greatest: Parse, GraphQL, some NodeJS and especially the (yet to be released) latest Apple’s framework SwiftUI. 

This will take a few posts in order to be fully functional, but when we get there, you will realize how simple it can be to get your ideas up and running with very little effort here at Back4app.

For better learning, download the iOS Instagram Clone project with source code.

So, it seems it is time for…

 


GraphQL iOS: Using Cloud Functions in a Swift App

GraphQL iOS: Using Cloud Functions in a Swift App

On this article, I showed you how to use GraphQL with NodeJS Cloud Code in Back4app.

And on this guide, I showed you how to use Apollo GraphQL iOS Client with Swift.

Now let’s bring it all together and make lots of complicated operations by producing really easy code. And let’s also have XCode to automatically generate any API code for us even when we change Classes.

Sounds good? So get some coffee and get along!


open
Build, deploy and scale your app with Back4App Containers

open
Build, deploy and scale your app with Back4App Containers. Start today!