import 'package:flutter/material.dart';
MaterialApp(
   ThemeData(
        name: "Majid Hajian",
        location: "Oslo, Norway",
        description: '''
                Google Developer Expert
        	Passionate Software engineer, 
	        Community Leader, Author and international Speaker
         ''',
        main: "Flutter/Dart, PWA, Performance",
        homepage: "https://www.majidhajian.com",
        socials: {
          twitter: "https://www.twitter.com/mhadaily",
          github: "https://www.github.com/mhadaily"
          youtube: "https://www.youtube.com/mhadaily"
        },
        author: {
          Pluralsight: "www.pluralsight.com/authors/majid-hajian",
          Apress: "Progressive Web App with Angular, Book",
          PacktPub: "PWA development",
          Udemy: "PWA development",
        }
        founder: "Softiware As (www.Softiware.com)"
        devDependencies: {
          tea: "Ginger", 
          mac: "10.14+",
        },
        community: {
          FlutterVikings: "Orginizer", 
          FlutterDartOslo: "Orginizer",
          GDGOslo: "Co-Orginizer",
          DevFestNorway: "Orginizer",
          ...more
        }));

class User {
  id: number;
	
  constructor(public name: string){id=1};
    
    
   async fetchInfo() {
     return new Promise(
       resolve => setTimeout(resolve, 3*1000);
     );
   }
}


async function main(){

  const user = new User('Majid');
  
  await user.fetchInfo();
  
  console.log(`Hello ${user.id}`)
}
main();

class User {
  final int id;
  final String name;
	
  User(this.name) {id = 1};
    
  fetchInfo() async {
      return Future.delayed(const Duraction(seconds: 2));
   }
}


main() async {

  final user = User('Majid');
  
  await user.fetchInfo();
  
  print('Hello ${user.id}');
}

import 'dart:async';

Stream<int> countStream(int to) async* {
  for (int i = 1; i <= to; i++) {
    yield i;
  }
}

main() async {
  
  final count = await countStream(10).first;
  print('first count $count');
  
  countStream(10).listen((v) {
    print('Listen to count $v');
  });
}

import { fromEvent } from 'rxjs';
import { throttleTime, scan } from 'rxjs/operators';

fromEvent(document, 'click')
  .pipe(
    throttleTime(1000),
    scan(count => count + 1, 0)
  )
  .subscribe(count => console.log(`Clicked ${count} times`));

class HelloWorld extends StatelessWidget {
    @override
    Widget build(BuildContext context){
	    return Text('Hello World');
    }
}

class HelloWorld extends React.Component {
    render() {
    // return '<p>Hello World</p>';
    return <View >
        <Text>Hello world!</Text>
      </View>
    }
}

import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter/my_widgets.dart';

//React Native
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';

void main() {
  runApp(
    Center(
      child: Text(
        'Hello, world!',
        textDirection: TextDirection.ltr,
      ),
    ),
  );
}

const CenterP = ()=>{
// return '<p>Hello World</p>';
     return <View style={styles.container}>
        <Text>Hello world!</Text>
      </View>
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center'
  }
});

void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('Welcome to Flutter'),),
        body: Center(
          child: Text('Hello world'),
        ),
      ),
    );
  }
}

<MyAppHeader>
    <HelloWorld bold></HelloWorld>
</MyAppHeader>

<div style="font-weight:bold; text-align:center;">
	Majid Hajian
</div>

class CustomCard extends StatelessWidget {
  CustomCard({
  required this.index, 
  required this.onPress
  });
  final index;
  final Function onPress;
  @override
  Widget build(BuildContext context) {
    return Card(
      child: Column(
        children: [
          Text('Card $index'),
          TextButton(
            child: const Text('Press'),
            onPressed: this.onPress,
          ),
        ],
      )
    );
  }
}
CustomCard(
  index: index,
  onPress: () { print('Card $index'); },
)

// React Native
class CustomCard extends React.Component {
  render() {
    return (
      <View>
        <Text> 
        Card {this.props.index} 
        </Text>
        <Button
          title="Press"
          onPress={() => this.props.onPress(this.props.index)}
        />
      </View>
    );
  }
}

// Usage
<CustomCard onPress={this.onPress} index={item.key} />

┬
└ projectname
  ┬
  ├ android      - Contains Android-specific files.
  ├ build        - Stores iOS and Android build files.
  ├ ios          - Contains iOS-specific files.
  ├ lib          - Contains externally accessible Dart source files.
    ┬
    └ src        - Contains additional source files.
    └ main.dart  - The Flutter entry point and the start of a new app.
                   This is generated automatically when you create a Flutter
                    project.
                   It's where you start writing your Dart code.
  ├ test         - Contains automated test files.
  └ pubspec.yaml - Contains the metadata for the Flutter app.
                   This is equivalent to the package.json file in React Native.

// pubspec.yaml

flutter:
  assets:
    - assets/my_icon.png
    - assets/background.png


// code 
image: AssetImage('assets/background.png'),

//code 
<Image source={require('./my-icon.png')} />

// Flutter
var data = [ ... ];
ListView.builder(
  itemCount: data.length,
  itemBuilder: (context, int index) {
    return Text(
      data[index],
    );
  },
)

// React Native
<FlatList
  data={[ ... ]}
  renderItem={({ item }) => <Text>{item.key}</Text>}
/>

// Flutter
Center(
  child: Column(
    children: <Widget>[
      Container(
        color: Colors.red,
        width: 100.0,
        height: 100.0,
      ),
      Container(
        color: Colors.blue,
        width: 100.0,
        height: 100.0,
      ),
      Container(
        color: Colors.green,
        width: 100.0,
        height: 100.0,
      ),
    ],
  ),
)

// React Native
<View
  style={{
    flex: 1,
    flexDirection: 'column',
    justifyContent: 'space-between',
    alignItems: 'center'
  }}
>

var container = Container( // grey box
  child: Text(
    "Lorem ipsum",
    textAlign: TextAlign.center,
    style: TextStyle(
      fontSize: 24,
      fontWeight: FontWeight.w900,
      fontFamily: "Georgia",
    ),
  ),
  width: 320,
  height: 240,
  color: Colors.grey[300],
);

<div class="greybox">
    Lorem ipsum
</div>

.greybox {
      background-color: #e0e0e0; /* grey 300 */
      width: 320px;
      height: 240px;
      font: 900 24px Georgia;
      text-align: center;
    }

// Flutter
var textStyle = TextStyle(
    fontSize: 32.0, 
    color: Colors.cyan, 
    fontWeight: FontWeight.w600
   );

///

Center(
  child: Column(
    children: <Widget>[
      Text(
        'Sample text',
        style: textStyle,
      ),
      Padding(
        padding: EdgeInsets.all(20.0),
        child: Icon(Icons.lightbulb_outline,
          size: 48.0, color: Colors.redAccent)
      ),
    ],
  ),
)

// React Native
<View style={styles.container}>
  <Text style={{ fontSize: 32, color: 'cyan', fontWeight: '600' }}>
    This is a sample text
  </Text>
</View>

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center'
  }
});

  Widget build(BuildContext context) {
    return GestureDetector(
        child: AbsorbPointer(child : child),
        onTap: () {
          print('tap');
          onTap();
        },
        onTapCancel: () {
          print('tapCancel');
        }
      );
  }

class MyStatefulWidget extends StatefulWidget {
  MyStatefulWidget({Key key, this.title}) : super(key: key);
  final String title;

  @override
  _MyStatefulWidgetState createState() => _MyStatefulWidgetState();
}

class _MyStatefulWidgetState extends State<MyStatefulWidget> {
	name = 'majid';
    
    changeName(String str){
    	setState((){
        	name = str;
        });
    }
	
  @override
  Widget build(BuildContext context) {
    ...
  }
}

// Flutter
class NavigationApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
            ...
      routes: <String, WidgetBuilder>{
        '/a': (BuildContext context) => usualNavscreen(),
        '/b': (BuildContext context) => drawerNavscreen(),
      }
            ...
  );
  }
}


// usage 
Navigator.of(context).pushNamed('/a');

// React Native
const MyApp = TabNavigator(
  { Home: { screen: HomeScreen }, Notifications: { screen: tabNavScreen } },
  { tabBarOptions: { activeTintColor: '#e91e63' } }
);
const SimpleApp = StackNavigator({
  Home: { screen: MyApp },
  stackScreen: { screen: StackScreen }
});
export default (MyApp1 = DrawerNavigator({
  Home: {
    screen: SimpleApp
  },
  Screen2: {
    screen: drawerScreen
  }
}));