• Forum Registration System Currently Closed, It Will Open Again Next Month.

Learnreact Design - Prototyping With React + Framer

Learnreact Design - Prototyping With React + Framer

Register & Get access to index
7uc4Zh6.jpg

An accelerated ride to a new galaxy of creativity. Are you familiar with HTML / CSS but new to JavaScript or React? This course is especially for you! Save time! Study only what is important.


12 modules, 18 selected examples

  • Javascript : ES6
  • React : Components, Hooks, State, Props
  • Framer : Framer Motion, Overrides, Workflow
1. Getting started

  • basics of programming
  • JSX vs HTML
2. Toggle

  • objects, functions, variables, arrays, array destructuring
  • styling components
  • animation, transition, options
3. Slider

  • objects, scope, conditions
  • component composition
  • drag, animate, transform
4. Parallax with mouse

  • expressions, data types
  • onMouseMove, hooks, the true face of JSX
  • useMotionValue, useTransform
5. Tinder Swipe

  • Arrow functions, trinary operator, array.map
  • onMouseMove, Hooks
  • useMotionValue, useTransform, useSpring
6. Radio Group

  • object destructuring
  • state, debug, components - printers, custom hooks
  • the true face of useCycle
7. Animation

  • async / await, promise
  • step animation, keyframes
8. Parallax scrolling

  • custom hooks
  • useParallax hooks, useMotionValue
9. Framer X

  • overrides, property management, design and code components
10. Stock schedule

  • JSON import, data fetch, object iteration, array functions, error handling
  • useEffect, conditional rendering
11. Framer Motion

  • mount and unmount, "key" prop
  • motion tags, AnimatePresence, positionTransition
12. SVG animation

  • Math functions
  • motion.path, pathLength, pathOffset, onPan
Author
TUTProfessor
Downloads
144
Views
1,533
First release
Last update
Rating
0.00 star(s) 0 ratings

More resources from TUTProfessor