apiKey

Find its value from the `firebase_options.dart` file and paste here.

appId

messagingSenderId

projectId

authDomain

storageBucket

iosClientId

iosBundleId

measurementId

Gain insights into using Flutter and Dart to build visually stunning, high-performance Android and iOS apps. Delve into UI/UX design, networking, state management, Firebase, testing, and deployment.

hello.tar.gz

Flutter_Web

Flutter_Web-copy

Flutter_Web-Firebase

Flutter_Web_build_runner

Flutter_Web_Testing

Flutter_API_Server

Flutter_API_Server-copy

Get ready to unlock the potential of Flutter and Dart as you learn to craft visually stunning and high-performance applications for both Android and iOS.

This course will teach you to plan, build, and deploy interactive Flutter applications. You’ll start by developing user interfaces and handling gestures. Next, you’ll explore navigation and routing to smoothly move around your app. You’ll then dive into networking and HTTP to connect your app to the internet and implement data persistence. You’ll use Firebase services for authentication and storing data. State management comes next, helping you manage the different pieces of your app efficiently. Then, you’ll focus on testing, analytics, and crash reporting. You’ll then explore accessibility and internationalization, making your app usable by everyone and suitable for different languages. Lastly, you’ll learn app deployment.

The course wraps up with a project: you will create an online furniture store, combining all the skills you’ve learned.

The Complete Guide to Flutter

In this challenge, you will fetch a list of crypto data from our mock API. 

# Goal

The goal of this lesson is to put CRUD operation-related concepts into practice.

# Specs
When you run your app, a list of coins should be displayed as shown below:  





# Starter code
Before you begin the challenge, look at the starter code below and run it.
Once done, you can dive into the challenges.

name: bitcoin_app
description: A new Flutter application.

publish_to: 'none' # Remove this line if you wish to publish to pub.dev
version: 1.0.0+1

environment:
  sdk: ">=2.12.0 <3.0.0"

dependencies:
  flutter:
    sdk: flutter
  cupertino_icons: ^1.0.4
  http: ^0.13.4

dev_dependencies:
  build_runner: ^2.1.7
  flutter_test:
    sdk: flutter
  flutter_lints: ^1.0.4

flutter:
  uses-material-design: true
  assets:
    - assets/images/


import React from 'react';
import { shallow, configure } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

configure({ adapter: new Adapter() });

import HelloWorld from './app';

var TestResult = function() {
    this.succeeded = false;
    this.reason = "";
    this.input = "";
    this.expected_output = "";
    this.actual_output = "";
}

export const executeTests = function() {

  var results = [];

  result = new TestResult();
  result.input = 'HelloWorld Component';
  result.expected_output = "span containing text 'Hello World'"

  let wrapper = shallow(<HelloWorld />);

  // Call your Challenge function here.

  let type = wrapper.type();
  let testSuccessful = true;
  let failureReason;

  if (type !== 'span') {
    testSuccessful = false;
    failureReason = "You need to render exactly one span HTML element";
  } else if (wrapper.props().children != "Hello World") {
     testSuccessful = false;
     failureReason = "You have rendered wrong message in your span element";
  }

  result.actual_output = wrapper.html();

  if (testSuccessful) {
    result.succeeded = true;
    result.reason = "Succeeded"
  } else {
    result.succeeded = false;
    result.reason = failureReason;
  }

  results.push(result);

  return results;
}


React

Dart

GoJS React

Typescript React

Vue.js


# Challenges


## Challenge 1: Get API resource

In this challenge, you will make an HTTP GET request to get a list of coins in the market. 

1. Locate `// TODO-1: Add a reference to base URL` (**line 6**) in the `lib/utilities/coins_service.dart` file and add a reference to the mock API URL, `https://44a3d77f-08c1-4a76-8073-52e7d46c888b.mock.pstmn.io`. 
2. Locate `// TODO-2: Add getCoins method` in the `lib/utilities/coins_service.dart` file and add a `getCoins` method. 

The method should make a get resource request to the `/coins/markets` endpoint and return the JSON response body. 

## Challenge 2: Update the app to use the API resource
In this challenge, you will update your app to use the fetched data. 

- Locate `// TODO-3: Update body` (**line 16**) in `lib/presentation/coins_screen.dart`. First, wrap the `ListView` in a `FutureBuilder`, then: 
   - Display a `CircularProgressIndicator` when the data is in a loading state.
   - Display the error when the request returns an error.
   - Display the resource data in `ListView`. 
     - The resource's `image` goes to the `leading` parameter of `ListTile`.
     - The resource's `name` goes to the `title` parameter of `ListTile`.
     - The resource's `total_volume` goes to the `subtitle` parameter of `ListTile`.
     - The resource's `current_price` goes to the `trailing` parameter of `ListTile`.

Run your app and ensure it meets the specs mentioned.





Test your understanding of networking and HTTP.


Introduction

User Interface

Navigation and Routing

Networking and HTTP

Persisting Data

State Management

Firebase for Flutter

Essential Tools to Enhance Your Flutter Workflow

Quality Assurance

Accessibility and Internalization

Deployment

Project: Build an Online Furniture Store

Next Steps

Challenge: Crypto API

Goal