Instagram social network interface in a responsive built using flutter

Overview

Responsive Instagram 📱

Responsive Instagram foi um projeto realizado com o intuito de aprendizagem e prática da linguagem de programação Dart em conjunto com o kit de desenvolvimento de interfaces Flutter. O projeto consistiu em replicar a interface da rede social Instagram de forma responsiva, capaz de um unico código se apresentar bem em diferentes dispositivos e tamanhos de tela. O mesmo se deu com um acompanhamento de um curso que pode ser acessado através do link: https://www.udemy.com/course/responsividade-flutter/ com este projeto e curso foi possível praticar:

  • Responsive Framework
  • Criação de AppBar responsiva
  • ListView
  • Controle de tela
  • Definições do que aparece e desaparece de acordo com a tela
  • E muitos outros

Um pouco do resultado: 🏆

Gif

Ferramentas 🛠️

  • Visual Studio
  • Google Chrome
  • Android Studio

Tecnologias 🖥️

As tecnologias empregadas foram a linguagem de progrmação Dart em conjunto com o kit de desenvolvimento de interfaces Flutter, junto com o editor de código fonte VisualStudio e o repositório GitHub para armazanamento e compartilhamento da atividade.

Instalação e compilação

Para executar este projeto em seu computador se faz nescessário a clonagem do mesmo e a instalação do Flutter em sua máquina

A instalação pode ser feita através do comando:

sudo snap install flutter --classic

Após a instalação basta executar o projeto através de um editor de código fonte (no visual studio basta precionar a tecla f5).

Links 🔗

Segue aqui alguns links importantes para construção dessa atividade

Plugin README
Site do curso https://www.udemy.com/course/responsividade-flutter/
Repositório GitHub https://github.com/Leonardo1952/instagran_responsive
Visual Studio Code https://code.visualstudio.com/

Contato 📧

Email: [email protected]

You might also like...

Fluid layouts allows you to create responsive layout for mobile, web and desktop from a single codebase.

Fluid layouts allows you to create responsive layout for mobile, web and desktop from a single codebase.

Fluid layout aims to help building a responsive experience through all the different screen sizes. Based in the boostrap approach, FluidLayout calculates a padding content (fluid_padding) that changes depending on the parent size. The Fluid widget uses that padding to set its size

Jan 10, 2022

A Flutter plugin for iOS and Android for generating sign-in buttons for different social media account.

A Flutter plugin for iOS and Android for generating sign-in buttons for different social media account.

A Flutter plugin for iOS and Android for generating sign-in buttons for different social media account.

Nov 6, 2022

An app built using Flutter that holds buttons in form of xylophone which plays as instrument when clicked.

xylophone_flutter A new Flutter application. Getting Started This project is a starting point for a Flutter application. A few resources to get you st

Feb 3, 2022

An Ecommerce application built in Flutter using Firebase.

An Ecommerce application built in Flutter using Firebase.

Flutter-Commerce An Ecommerce application built in Flutter using Firebase. Getting started Project setup instructions are given at Wiki section. Scree

Dec 31, 2022

A complete Flutter E-Commerce Book Store application built using firebase as backend.

A complete Flutter E-Commerce Book Store application built using firebase as backend.

ecommerce A complete Flutter E-Commerce Book Store application built using firebase as backend. Features Add or remove item in cart Search products Ad

Sep 30, 2022

Netflix Clone UI Built Using Flutter

Netflix Clone UI Built Using Flutter

Netflix Clone UI - Flutter Web & Mobile: IOS | Android Web Version with Flutter!

Dec 13, 2022

Movies App UI in Flutter using Simple Widgets without Using API's in Flutter.

Movies App UI in Flutter using Simple Widgets without Using API's in Flutter.

Movies App UI in Flutter using Simple Widgets without Using API's in Flutter.

May 15, 2022

E-Commerce App built in flutter

E-Commerce App built in flutter

flutter_ecommerce_app E-Commerce app is a design implementaion of E-commerce App designed by Imran Download App Android Screenshots HomePage Product D

Jan 3, 2023

A Messenger UI built in Flutter

A Messenger UI built in Flutter

A chat messenger Chat Messenger built in Flutter Getting Started For help getting started with Flutter, view our online documentation. Compatibility A

Mar 31, 2022
Owner
null
Responsive Sizer helps implement are responsive layout by providing helper widgets and extensions

Responsive Sizer Responsive Sizer helps implement a responsive layout by providing helper widgets and extensions Content Installation Parameters Take

CoderUni 71 Jan 3, 2023
Responsive Admin Panel or Dashboard using Flutter

Responsive Admin Panel or Dashboard using Flutter

Abu Anwar 5.5k Dec 29, 2022
A responsive book app UI using flutter

Flutter Book Project I'm design a responsive book app UI using flutter, There is 3 page home page that includes a horizontal category list, then a lis

Mr Kafiri 6 Dec 27, 2022
A small attempt to make an e-commerce user interface in Flutter for Android and iOS.

Flutter ecommerce App A small attempt to make an e-commerce user interface in Flutter for Android and iOS. I developed this application just for learn

Md Tarikul Islam 615 Jan 3, 2023
An user interface sample application of women apparel in flutter

Women Apparel Application An user interface sample application of women apparel in flutter. Project Created & Maintained By MultiQoS Pvt. Ltd. Demo Ap

MultiQoS 13 Sep 16, 2022
Food ordering app UI work - It is the interface work of the food ordering application

Food ordering app UI work - It is the interface work of the food ordering application

İrem Aysel İpek 25 Dec 19, 2022
A simple calculator UI inspired by Daily UI post by @juliejamolo on Instagram.

Calculator UI A simple calculator UI inspired by Daily UI post by @juliejamolo on Instagram. Just thought why not making it into an app? So, just buil

Sreelal TS 4 May 2, 2022
A flutter plugin for Easily make Flutter apps responsive. Automatically adapt UI to different screen sizes. Responsiveness made simple.

A flutter plugin for Easily make Flutter apps responsive. Automatically adapt UI to different screen sizes. Responsiveness made simple.

Urmish Patel 191 Dec 29, 2022
Tour guide App UI in Flutter Consist of Three Pages. First Screen is Splash Screen , Second is welcome screen routing to third Screen and Third screen consist of details , navigation, places, and responsive UI.

Tour Guide // Tourism App Ui in Flutter. Tour Guid App Ui in Flutter. Visit Website Features State Management Navigation Bar Responsive Design Hybrid

Habib ullah 2 Nov 14, 2022
I am trying to teach Responsive Ui design. This video for Web and Mobile. This design is suitable for Desktop, Tab, and Mobile platforms.

before clone the GitHub repository please give a star on the repository. I am trying to teach Responsive Ui design. This video for Web and Mobile. Thi

Blackshadow Software Ltd 22 Sep 1, 2022