arnoldc

outerCircle: {
    backgroundColor: 'blue',
    width: 100,
    height: 100,
    borderRadius: 100/2,
    justifyContent: 'center',
    alignItems: 'center'
  },

arnoldc

// Noted the empty array. useEffect will then only run once on initial render
useEffect(() => {
    document.title = `New value: ${value}` 
}, [])


// Will run each time 'value' state change.
useEffect(() => {
    document.title = `New value: ${value}` 

arnoldc

const UseRefBasics = () => {
    const refContainer = useRef(null)
    const handleSubmit = (e) => {
      e.preventDefault()
      console.log(refContainer.current.value)
    }
  

arnoldc

// our wrappper

import { NavigationContainer } from '@react-navigation/native';
 
const App = () => (
  <NavigationContainer>
    { /* Insert your navigators and content here */ }
  </NavigationContainer>

arnoldc

// ways
<Text style={styles.paragraph} />
<Text style={{ fontSize: 16 }} />
<Text style={[styles.paragraph, { color: 'red' }]} />

// dynamic
// Applies the `selected` style on top of the `paragraph` style if props.isActive is truthy
 
function Item(props) {

arnoldc

<Image source={require('./local/asset.jpg')} />
               
<Image source={{ uri: 'https://docs.expo.io/static/images/header/sdk.svg' }} />
 
<Image source={{ uri: 'data:image/png;base64,<base64-string>=' }} />

arnoldc

const [input, setInput] = useState('');  
 
// example use of input
console.log(input);  
 
return (
  <TextInput   
    placeholder="What is your name?"   
    onChangeText={setInput}  
  />

arnoldc

import React, { useState, useEffect } from 'react';
import {
  SafeAreaView,
  StyleSheet,
  ActivityIndicator,
  FlatList,
  Text,
  View,
  RefreshControl,
} from 'react-native';

arnoldc

// bottom navigator
// https://reactnavigation.org/docs/bottom-tab-navigator

import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';

const Tab = createBottomTabNavigator();

arnoldc

// make sure access modifier are stated (e.g public , private)
// adding readonly for not needed to be modified

export class User {
    public readonly id: number;
    public firstName: string;
    public lastName: string;
    public email: string;
    protected dob: Date;