Osinachi Chukwujama vicradon

The BLoC pattern in flutter is a matured way to manage state in a Flutter app. In this tutorial, we'd be building a simple shopping cart app which uses the BLoC pattern. Here's the final app:

Before you proceed

I wrote the code on Flutter version 1.12.13+hotfix.9
I used VsCode for this tutorial. You can use whatever you've been using. I'm certain you'd follow. You can get all the code from my GitHub repo
I don't assume you have in-depth knowledge of Flutter. You can follow along if you are a beginner. Though I assume you have heard of Flutter and what it offers.

	// The main info to grab here is that the function which handles event.target can be placed
	//on multiple elements. The props of that element get combined into an object which can
	//be accessed form event.target. Remember how NetNinja accessed inputs of a form using '[]'?
	//The same logic is applied here. The name is accessed using [] and the value, the normal way
	//The name must reflect the property in state. because name is carried from the JSX element and
	//sent to the state for investigation

	import React from "react"

	class App extends React.Component {

	import React, {useState, useEffect} from "react"
	import randomcolor from "randomcolor"

	function App() {
	const [count, setCount] = useState(0)
	const [color, changeColor] = useState(randomcolor)

	useEffect(() => {
	const intervalId = setInterval(() =>
	setCount(prevCount => prevCount + 1), 1000

	/**
	* This code uses the principle of single return per function.
	* I did not reassign any object.
	* This enables a cleaner experience and a testable code.
	*
	* Also note that I did not use "let" or "var (which is forbidden)".
	* I only used const, to prevent reassignment errors.
	*/

	const data = [

	import 'package:flutter/material.dart';

	void main() => runApp(App());

	class App extends StatelessWidget {
	@override
	Widget build(BuildContext context) {
	return MaterialApp(
	initialRoute: '/',
	routes: {

	class Checkout extends StatelessWidget {
	Widget build(BuildContext context) {
	return Scaffold(
	appBar: AppBar(title: Text('Checkout')),
	body: StreamBuilder(
	stream: bloc.getStream,
	initialData: bloc.allItems,
	builder: (context, snapshot) {
	return snapshot.data['cart items'].length > 0
	? Column(

	def fib(n):
	'''
	This function returns a fibonacci seq assuming the seq starts as [1, 2]
	'''
	try:
	sequence = []
	if n == 1:
	sequence = [1]
	if n >= 2:
	sequence = [1, 2]

	const GitHub = require('github-api');

	// basic auth
	const gh = new GitHub({
	username: __YOUR_USERNAME__,
	password: __YOUR_PASSWORD__
	})

	// get the required user (you)
	const user = gh.getUser(__YOUR_USERNAME__)

	// relative_path is the relative path of the file you want to clean up
	// For some reason, you may have python comments in a js file
	// and your too lazy to clean it up manually, but are eager enough to
	// write code to clean it up

	const fs = require('fs')

	fs.readFile(relative_path, "utf8", (err, data) => {
	if (err) throw err;
	let processedData = ""

	{
	"title":"A post",
	"content":"Some more post"
	}