title: New to Web development not sure how to fix reactjs errors
body: <p>These is a long page full for error messages and I cannot get hold of the person teaching this class been 2 weeks. I tried redoing it but I still got the same messages I do not know how or what to do in order to fix them.  Here is the git hub link: <a href="https://github.com/SadiaSanam/petshop" rel="nofollow noreferrer">https://github.com/SadiaSanam/petshop</a></p>
  <p>And these are the messages, how to I fix it? Because some of those pages I cannot even find..</p>
  <p>TypeError: path.split is not a function
  get
  C:/Users/sadia/OneDrive/SheCodes/Full stack/app/src/utils/get.ts:6</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>TypeError: path.split is not a function
  get
  C:/Users/sadia/OneDrive/SheCodes/Full stack/app/src/utils/get.ts:6
    3 | import isUndefined from './isUndefined';
    4 | 
    5 | export default (obj: any = {}, path: string, defaultValue?: unknown) =&gt; {
  &gt; 6 |   const result = compact(path.split(/[,[\].]+?/)).reduce(
    7 |     (result, key) =&gt; (isNullOrUndefined(result) ? result : result[key]),
    8 |     obj,
    9 |   );
  View compiled
  (anonymous function)
  C:/Users/sadia/OneDrive/SheCodes/Full stack/app/src/useForm.ts:967
    964 | 
    965 | const register: UseFormRegister&lt;TFieldValues&gt; = React.useCallback(
    966 |   (name, options) =&gt; {
  &gt; 967 |     const isInitialRegister = !get(fieldsRef.current, name);
        | ^  968 | 
    969 |     set(fieldsRef.current, name, {
    970 |       _f: {
  View compiled
  Login
  C:/Users/sadia/OneDrive/SheCodes/Full stack/app/petshop/src/components/Login.js:88
    85 | &lt;div className='form-control'&gt;
    86 |  
    87 |   &lt;label htmlFor='email'&gt;Email&lt;/label&gt;
  &gt; 88 |   &lt;input type='email' name='email' id='email' ref={register( {required:true})  }   /&gt;
       | ^  89 |   { errors.email ? &lt;span className='err'&gt; email is required!&lt;/span&gt; : null } 
    90 | 
    91 |   &lt;label htmlFor='password'&gt;Password&lt;/label&gt;
  View compiled
  renderWithHooks
  C:/Users/sadia/OneDrive/SheCodes/Full stack/app/petshop/node_modules/react-dom/cjs/react-dom.development.js:14985
    14982 |   }
    14983 | }
    14984 | 
  &gt; 14985 | var children = Component(props, secondArg); // Check if there was a render phase update
          | ^  14986 | 
    14987 | if (didScheduleRenderPhaseUpdateDuringThisPass) {
    14988 |   // Keep rendering in a loop for as long as render phase updates continue to
  View compiled
  mountIndeterminateComponent
  C:/Users/sadia/OneDrive/SheCodes/Full stack/app/petshop/node_modules/react-dom/cjs/react-dom.development.js:17811
    17808 | 
    17809 |   setIsRendering(true);
    17810 |   ReactCurrentOwner$1.current = workInProgress;
  &gt; 17811 |   value = renderWithHooks(null, workInProgress, Component, props, context, renderLanes);
          | ^  17812 |   setIsRendering(false);
    17813 | } // React DevTools reads this flag.
    17814 | 
  View compiled
  beginWork
  C:/Users/sadia/OneDrive/SheCodes/Full stack/app/petshop/node_modules/react-dom/cjs/react-dom.development.js:19049
    19046 | switch (workInProgress.tag) {
    19047 |   case IndeterminateComponent:
    19048 |     {
  &gt; 19049 |       return mountIndeterminateComponent(current, workInProgress, workInProgress.type, renderLanes);
          | ^  19050 |     }
    19051 | 
    19052 |   case LazyComponent:
  View compiled
  HTMLUnknownElement.callCallback
  C:/Users/sadia/OneDrive/SheCodes/Full stack/app/petshop/node_modules/react-dom/cjs/react-dom.development.js:3945
    3942 | function callCallback() {
    3943 |   didCall = true;
    3944 |   restoreAfterDispatch();
  &gt; 3945 |   func.apply(context, funcArgs);
         | ^  3946 |   didError = false;
    3947 | } // Create a global error event handler. We use this to capture the value
    3948 | // that was thrown. It's possible that this error handler will fire more
  View compiled
  invokeGuardedCallbackDev
  C:/Users/sadia/OneDrive/SheCodes/Full stack/app/petshop/node_modules/react-dom/cjs/react-dom.development.js:3994
    3991 | // errors, it will trigger our global error handler.
    3992 | 
    3993 | evt.initEvent(evtType, false, false);
  &gt; 3994 | fakeNode.dispatchEvent(evt);
         | ^  3995 | 
    3996 | if (windowEventDescriptor) {
    3997 |   Object.defineProperty(window, 'event', windowEventDescriptor);
  View compiled
  invokeGuardedCallback
  C:/Users/sadia/OneDrive/SheCodes/Full stack/app/petshop/node_modules/react-dom/cjs/react-dom.development.js:4056
    4053 | function invokeGuardedCallback(name, func, context, a, b, c, d, e, f) {
    4054 |   hasError = false;
    4055 |   caughtError = null;
  &gt; 4056 |   invokeGuardedCallbackImpl$1.apply(reporter, arguments);
    4057 | }
    4058 | /**
    4059 |  * Same as invokeGuardedCallback, but instead of returning an error, it stores
  View compiled
  beginWork$1
  C:/Users/sadia/OneDrive/SheCodes/Full stack/app/petshop/node_modules/react-dom/cjs/react-dom.development.js:23964
    23961 | } // Run beginWork again.
    23962 | 
    23963 | 
  &gt; 23964 | invokeGuardedCallback(null, beginWork, null, current, unitOfWork, lanes);
          | ^  23965 | 
    23966 | if (hasCaughtError()) {
    23967 |   var replayError = clearCaughtError(); // `invokeGuardedCallback` sometimes sets an expando `_suppressLogging`.
  View compiled
  performUnitOfWork
  C:/Users/sadia/OneDrive/SheCodes/Full stack/app/petshop/node_modules/react-dom/cjs/react-dom.development.js:22776
    22773 | 
    22774 | if ( (unitOfWork.mode &amp; ProfileMode) !== NoMode) {
    22775 |   startProfilerTimer(unitOfWork);
  &gt; 22776 |   next = beginWork$1(current, unitOfWork, subtreeRenderLanes);
          | ^  22777 |   stopProfilerTimerIfRunningAndRecordDelta(unitOfWork, true);
    22778 | } else {
    22779 |   next = beginWork$1(current, unitOfWork, subtreeRenderLanes);
  View compiled
  workLoopSync
  C:/Users/sadia/OneDrive/SheCodes/Full stack/app/petshop/node_modules/react-dom/cjs/react-dom.development.js:22707
    22704 | function workLoopSync() {
    22705 |   // Already timed out, so perform work without checking if we need to yield.
    22706 |   while (workInProgress !== null) {
  &gt; 22707 |     performUnitOfWork(workInProgress);
    22708 |   }
    22709 | }
    22710 | 
  View compiled
  renderRootSync
  C:/Users/sadia/OneDrive/SheCodes/Full stack/app/petshop/node_modules/react-dom/cjs/react-dom.development.js:22670
    22667 | 
    22668 | do {
    22669 |   try {
  &gt; 22670 |     workLoopSync();
          | ^  22671 |     break;
    22672 |   } catch (thrownValue) {
    22673 |     handleError(root, thrownValue);
  View compiled
  performSyncWorkOnRoot
  C:/Users/sadia/OneDrive/SheCodes/Full stack/app/petshop/node_modules/react-dom/cjs/react-dom.development.js:22293
    22290 |   }
    22291 | } else {
    22292 |   lanes = getNextLanes(root, NoLanes);
  &gt; 22293 |   exitStatus = renderRootSync(root, lanes);
          | ^  22294 | }
    22295 | 
    22296 | if (root.tag !== LegacyRoot &amp;&amp; exitStatus === RootErrored) {
  View compiled
  (anonymous function)
  C:/Users/sadia/OneDrive/SheCodes/Full stack/app/petshop/node_modules/react-dom/cjs/react-dom.development.js:11327
    11324 |     var callback = _queue[i];
    11325 | 
    11326 |     do {
  &gt; 11327 |       callback = callback(_isSync2);
          | ^  11328 |     } while (callback !== null);
    11329 |   }
    11330 | });
  View compiled
  unstable_runWithPriority
  C:/Users/sadia/OneDrive/SheCodes/Full stack/app/petshop/node_modules/scheduler/cjs/scheduler.development.js:468
    465 | currentPriorityLevel = priorityLevel;
    466 | 
    467 | try {
  &gt; 468 |   return eventHandler();
        | ^  469 | } finally {
    470 |   currentPriorityLevel = previousPriorityLevel;
    471 | }
  View compiled
  runWithPriority$1
  C:/Users/sadia/OneDrive/SheCodes/Full stack/app/petshop/node_modules/react-dom/cjs/react-dom.development.js:11276
    11273 | 
    11274 | function runWithPriority$1(reactPriorityLevel, fn) {
    11275 |   var priorityLevel = reactPriorityToSchedulerPriority(reactPriorityLevel);
  &gt; 11276 |   return Scheduler_runWithPriority(priorityLevel, fn);
    11277 | }
    11278 | function scheduleCallback(reactPriorityLevel, callback, options) {
    11279 |   var priorityLevel = reactPriorityToSchedulerPriority(reactPriorityLevel);
  View compiled
  flushSyncCallbackQueueImpl
  C:/Users/sadia/OneDrive/SheCodes/Full stack/app/petshop/node_modules/react-dom/cjs/react-dom.development.js:11322
    11319 | try {
    11320 |   var _isSync2 = true;
    11321 |   var _queue = syncQueue;
  &gt; 11322 |   runWithPriority$1(ImmediatePriority$1, function () {
          | ^  11323 |     for (; i &lt; _queue.length; i++) {
    11324 |       var callback = _queue[i];
    11325 | 
  View compiled
  flushSyncCallbackQueue
  C:/Users/sadia/OneDrive/SheCodes/Full stack/app/petshop/node_modules/react-dom/cjs/react-dom.development.js:11309
    11306 |     Scheduler_cancelCallback(node);
    11307 |   }
    11308 | 
  &gt; 11309 |   flushSyncCallbackQueueImpl();
    11310 | }
    11311 | 
    11312 | function flushSyncCallbackQueueImpl() {
  View compiled
  discreteUpdates$1
  C:/Users/sadia/OneDrive/SheCodes/Full stack/app/petshop/node_modules/react-dom/cjs/react-dom.development.js:22420
    22417 |     if (executionContext === NoContext) {
    22418 |       // Flush the immediate callbacks that were scheduled during this batch
    22419 |       resetRenderTimer();
  &gt; 22420 |       flushSyncCallbackQueue();
          | ^  22421 |     }
    22422 |   }
    22423 | }
  View compiled
  discreteUpdates
  C:/Users/sadia/OneDrive/SheCodes/Full stack/app/petshop/node_modules/react-dom/cjs/react-dom.development.js:3756
    3753 | isInsideEventHandler = true;
    3754 | 
    3755 | try {
  &gt; 3756 |   return discreteUpdatesImpl(fn, a, b, c, d);
         | ^  3757 | } finally {
    3758 |   isInsideEventHandler = prevIsInsideEventHandler;
    3759 | 
  View compiled
  dispatchDiscreteEvent
  C:/Users/sadia/OneDrive/SheCodes/Full stack/app/petshop/node_modules/react-dom/cjs/react-dom.development.js:5889
    5886 |     flushDiscreteUpdatesIfNeeded(nativeEvent.timeStamp);
    5887 |   }
    5888 | 
  &gt; 5889 |   discreteUpdates(dispatchEvent, domEventName, eventSystemFlags, container, nativeEvent);
    5890 | }
    5891 | 
    5892 | function dispatchUserBlockingUpdate(domEventName, eventSystemFlags, container, nativeEvent) {
  View compiled</code></pre>
  </div>
  </div>
  </p>