Flutter course chatapp - A Flutter Course Chat App Starter

Overview

flutter_course_chat_app_starter

Getting Started

Firebase installations

1- Open Firestore
2- Click create database
3- Choose test mode, then click Next
4 - Choose Cloud Firestore location
5 - Click Enable

Setting up Android

1- Click Click Project Overview
2- Then click the Android symbol
3- Add com.cpeskw.chatapp in the package name field and CPES in the App nickname field
4- Then click Register app
5- Then click Download google-services.json
6- Click Next
7- Click Next again and then Continue to console
8- Then move google-services.json from the download location to your project’s android/app folder

9- Open android/build.gradle
10- Then add the classpath 'com.google.gms:google-services:4.3.10' at the end of the list in the dependencies

11- Open android/app/build.gradle
12- add apply plugin: 'com.google.gms.google-services' after the apply from

Setting up iOS

1- Click Click Project Overview
2- Click Add app 3- Then click the iOS symbol
4- Add com.cpeskw.chatapp in the package name field and CPES in the App nickname field
5- Then click Register app
6- Download GoogleService-info.plist
7- Click Next
8- Click Next again and then Continue to console
9- Move the GoogleService-info.plist file to the ios/Runner folder

10- Then open ios/Runner.xcworkspace in Xcode
11- Add GoogleService-info.plist file to the Runner folder (Make sure you have Copy items if needed checked)

Packages

1- Add these packages inside pubspec.yaml file

firebase_core: ^1.10.6
cloud_firestore: ^3.1.5

2- Replace main method with

Future<void> main() async {
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp();

runApp(MyApp());
}

MessageTile widget

import 'package:flutter/material.dart';
import 'package:timeago/timeago.dart' as timeago;

class MessageTile extends StatelessWidget {
final String email;
final String text;
final DateTime date;

MessageTile({
  required this.email,
  required this.text,
  required this.date,
});

@override
Widget build(BuildContext context) {
  return Card(
    elevation: 2,
    child: Column(
      mainAxisAlignment: MainAxisAlignment.start,
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Container(
          padding: EdgeInsets.all(8),
          child: Text(
            '$text',
            style: TextStyle(
              fontSize: 18,
              fontWeight: FontWeight.bold,
            ),
          ),
        ),
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            Container(
              padding: EdgeInsets.all(8),
              child: Text(
                '$email',
                style: TextStyle(
                  fontSize: 10,
                  color: Colors.grey,
                  fontWeight: FontWeight.bold,
                ),
              ),
            ),
            Container(
              padding: EdgeInsets.all(8),
              child: Text(
                timeago.format(date),
                style: TextStyle(
                  fontSize: 10,
                  color: Colors.grey,
                  fontWeight: FontWeight.bold,
                ),
              ),
            ),
          ],
        ),
      ],
    ),
  );
}
}
You might also like...

Hungry is a Free Flutter Recipe App Starter Template that can help you develop a Recipe application much faster.

Hungry is a Free Flutter Recipe App Starter Template that can help you develop a Recipe application much faster.

Hungry is a Free Flutter Recipe App Starter Template that can help you develop a Recipe application much faster. You just need to add some adjustment to the frontend and you can create your own backend.

Dec 20, 2022

This perfect starter kit is an app based on React Native and UI Kitten library with Light and Dark themes support.

This perfect starter kit is an app based on React Native and UI Kitten library with Light and Dark themes support.

Kitten Tricks This perfect starter kit is an app based on React Native and UI Kitten library with Light and Dark themes support. It’s completely free

Dec 30, 2022

Flutter starter - GetX Flutter Firebase Auth Example

Flutter starter - GetX Flutter Firebase Auth Example

GetX Flutter Firebase Auth Example UPDATE: Version 2.0.0 Changed to new language

Jan 5, 2023

Flutter starter template for production applications with a REST backend

Flutter starter template for production applications with a REST backend

Flutter Boilerplate My Flutter starter template for production applications with a REST backend. The main aim of this template is to get you up and ru

Apr 13, 2022

A simple flutter starter with firebase & getX

A simple flutter starter with firebase & getX

Flutter starter GetX simplify & optimise a lot how to use Flutter! You should read a bit about GetX and Firebase. Package used Firebase (firebase_core

Jun 9, 2022

Starter code for the Dicee project in the Complete Flutter Bootcamp

Starter code for the Dicee project in the Complete Flutter Bootcamp

Dicee 🎲 Our Goal The objective of this tutorial is to introduce you to the core programming concepts that will form the foundation of most of the app

Dec 31, 2022

A Flutter e-commerce starter kit built using ScopedModel

Flutter E-Commerce App A Flutter e-commerce starter kit built using ScopedModel for state management that allows you to view a list of paginated produ

Nov 10, 2022

Starter code for the Clima Project from the Complete Flutter Development Bootcamp

Starter code for the Clima Project from the Complete Flutter Development Bootcamp

Clima ☁ Our Goal The objective of this tutorial is to learn about asynchronous programming in Dart. We'll look at how to carry out time consuming task

Dec 10, 2022

Flutter firebase starter project

Flutter Firebase Starter project Made with 💓 from Nepal A project you can clone to build your next project with Flutter with Firebase services. What

Dec 29, 2022
Owner
Dhari
Flutter enthusiast • Flutter & Node.js developer • self-educated • passionate about Startups
Dhari
Starter-Flutter - Starter flutter project for best architecture and seperation of code

Modular-Architecture Codebase CodeBase , Infrastructure and the common Layers (c

Ahmed Tawfiq 13 Feb 16, 2022
Flutter-course - Projects of the course to learn Flutter!

?? Flutter Course Projects of the course to learn Flutter! ?? What is it? Repo with all projects made during the Flutter Course provided by Daniel Cio

Alícia Foureaux 1 Jan 3, 2022
Chat app flutter - A Simple Chat App UI With Flutter

Flutter Chat App UI. Flutter Chat App UI. This is a simple flutter application w

null 1 Mar 5, 2022
flutter chat app with firebase , provider and api with all chat app functions

Full Chat Flutter App In this app we use FireBase Services(firestore - storage - auth - cloud messageing ) Dio for api setiing such as sending remote

Ahmed EL Bagory 35 Dec 14, 2022
Tag chat is a simple and basic chat app created with flutter

TagChat What is TagChat? Tag chat is a simple and basic chat app created with flutter. Description TagChat use firestore as backend Currently it suppo

Mahesh Khatri 2 Jun 22, 2022
Stream Chat official Flutter SDK. Build your own chat experience using Dart and Flutter.

Official Flutter packages for Stream Chat Quick Links Register to get an API key for Stream Chat Flutter Chat SDK Tutorial Chat UI Kit Sample apps Thi

Stream 659 Dec 25, 2022
Simple Chat UI - This template is a simple chat ui build with flutter ui toolkit.

Simple Chat UI This template is a simple chat ui build with flutter ui toolkit. TODO dark mode support image support gif, video, ... web mode desktop

null 2 Apr 24, 2022
Actively maintained, community-driven Firebase BaaS for chat applications with an optional chat UI.

Flutter Firebase Chat Core Actively maintained, community-driven Firebase BaaS for chat applications with an optional chat UI. Flyer Chat is a platfor

Flyer Chat 173 Jan 2, 2023
Starter app for Flutter that includes many different production app features; some not typically included in demo apps.

first_app: Starter app for a Flutter production app Maintainer: Greger Wedel, https://github.com/gregertw Listed on: Latest build and artifacts: ** La

Greger Teigre Wedel 371 Dec 28, 2022
Readky is a Free Flutter News App Starter Template that can help you develop a News application much faster.

Readky. Introduction Readky is a Free Flutter News App Starter Template that can help you develop a News application much faster. You just need to add

Muhammad Rezky Sulihin 54 Nov 26, 2022