fernandatoledo

This task evaluates the candidate's skills in `React`.

# React Notes App Task

Notes application provides a simple list of notes.

## Setup

This app was created with [CRA v3.3.0](https://github.com/facebook/create-react-app).

fernandatoledo

import React from 'react';
import {View, Animated} from 'react-native';
import useAnimate from 'hooks/useAnimate';

const AnimatedView = () => {
    const animatedOpacity = useAnimate({
      // fromValue: 0, (default)
      // toValue: 1,   (default)
      duration: 1000,
    });

fernandatoledo

import React, {useEffect, useRef} from 'react';
import {View, Animated} from 'react-native';

const AnimatedView = () => {
  const animatedOpacity = useRef(new Animated.Value(0)).current;

  useEffect(() => {
    Animated.timing(animatedOpacity, {
      toValue: 1,
      duration: 1000,

fernandatoledo

import React, { useRef, useEffect } from 'react';
import { Animated } from 'react-native';
// Other style and dimension imports

const ParallelAnimatedBox = () => {
  const duration = 1000;
  
  const left = useRef(new Animated.Value(0)).current;
  
  const top = useRef(new Animated.Value(0)).current;

fernandatoledo

import React, {useEffect, useRef} from 'react';
import { Animated } from 'react-native';
// Other style and dimension imports

const SequenceAnimatedBox = () => {

  const left = useRef(new Animated.Value(0)).current;
  
  const top = useRef(new Animated.Value(0)).current;

fernandatoledo

import React from 'react';
import { Animated } from 'react-native';
import {
  useAnimate,
  useAnimateSequence,
} from '@rootstrap/react-native-use-animate';
// Other style and dimension imports

const SequenceAnimatedBox = () => {
  // Be aware: animate should be false for nested animations

fernandatoledo

import React from 'react';
import { Animated } from 'react-native';
import {
  useAnimate,
  useAnimateParallel,
} from '@rootstrap/react-native-use-animate';
// Other style and dimension imports

const ParallelAnimatedBox = () => {
  // Be aware: animate should be false for nested animations

fernandatoledo

import React, {useEffect, useRef} from 'react';
import {View, Animated} from 'react-native';

const AnimatedView = () => {
  const animatedOpacity = useRef(new Animated.Value(0)).current;

  useEffect(() => {
    Animated.timing(animatedOpacity, {
      toValue: 1,
      duration: 1000,