mfrancois3k

// Referencce
https://github.com/manucho007/UltimateCourses/tree/master/react-state-management/course/src

import { atom, useRecoilState } from 'recoil';

// An atom is basically a piece of state
const pageState = atom({
  key: 'pageState',
  default: 'Home',
});

mfrancois3k

Array mutations returning a new array

Adding item to an array (list, item)
return [...list, item];

Remove item from index (list, index)
return list
.slice(0,index).concat(list.slice(index+1));

return [...list.slice(0, index),

mfrancois3k

import React from 'react';
import { BrowserRouter as Router, Switch, Route, Link } from 'react-router-dom';

const Routes = () => {
  return (
    <Router>
      <ul className="router-nav">
        <NavLink to="/">One</NavLink>
        <NavLink to="/two">Two</NavLink>
        <NavLink to="/three">Three</NavLink>

mfrancois3k

MongoDB Cheat Sheet

Show All Databases

show dbs

Show Current Database

mfrancois3k

import React from "react";

const Page1 = React.lazy(() => import("./Page1"));
const Page2 = React.lazy(() => import("./Page2"));
const Page3 = React.lazy(() => import("./Page3"));

const routes = [
    {
        Component: Page1,
        path: "page1",

mfrancois3k

import {
  AnimatePresence,
  m,
  LazyMotion,
  domAnimation,
  domMax
} from "framer-motion";
import type { CSSProperties } from "react";
import { Link, Route, Routes, useLocation } from "react-router-dom";
import "./styles.css";

mfrancois3k

import React, { useState, useEffect } from "react";
import { Dimensions, StyleSheet, Text, View } from "react-native";
import * as Location from "expo-location";
import MapView from "react-native-maps";

export const MyMapComponent = () => {
  const [location, setLocation] = useState(null);
  const [errorMsg, setErrorMsg] = useState(null);

  // Request access for location permissions and store them

mfrancois3k

const validationSchema = Yup.object().shape<IFormValues>({
  name: Yup.string().required("Please enter your name"),
  email: Yup.string()
    .email("Please enter valid email")
    .required("Please enter your email"),
  username: Yup.string()
    .required("Please enter username")
    .min(5, "Your username is too short")
    .max(30, "Your username is too long"),
  password: Yup.string()

mfrancois3k

app.post('/login', function(req,res) {
    console.log('user email: ', req.body.email);

    res.render('index', {title: 'Sent authentication email'});
});

app.get('/verify_email', function(req,res) {
    console.log('verify_email token: ',req.query.token);

    res.render('index', {title: 'Authenticating...'});

mfrancois3k

// /src/App.js

import React, { Component } from 'react';
import { Route, withRouter } from 'react-router-dom';

import logo from './logo.svg';
import './App.css';
import Signin from './auth/Signin';
import Users from './users/Users';