MEAN & MERN Stack Assignments

 Design the following layouts using CSS Grid

%3CmxGraphModel%3E Configure git ------------- git config   --global user.name   “your username” git config   --global user.email   “your email” Check config ------------ git config user.name git config user.email Create git local repo ------------------- Folder is already created: git init Folder is not created yet: git init folder-name check status of folder --------------------- git status Asking Git to track files(Staging env) ----------------------------------- git add file-name(single file) git add . (all files) To remove from Staging env --------------------------- git rm --cached file-name Save version to git ------------------- git add . git commit -m 'message' View commits ------------ git log git log --oneline Switch between commits ---------------------- git checkout hash-id To get lost commits ------------------- git reflog git cherry-pick hash-of-previous commit Branches -------- To check branches: git branch To create a n

 Register.js -------------- import { useState } from " react " ; import " ./Register.css " ; import { useForm } from " react-hook-form " ; import axios from " axios " ; import { useNavigate } from " react-router-dom " ; function Register () { //error state let [ error , setError ] = useState ( "" ); let [ selectedFile , setSelectedFile ] = useState ( null ) //navigate const navigate = useNavigate (); //use form hook let { register , handleSubmit , formState : { errors }, } = useForm (); //adding new user let addNewUser = ( newUser ) => { // console.log(newUser); //make HTTP POST req to save newUser to localAPI let fd =new FormData (); //append newUser to form data fd . append ( " user " , JSON . stringify ( newUser )) //append selected file to form data fd . append ( " photo " , selectedFile ) axios

 Implement User registration & Login operations in the app. Here , Iam sharing some sample code for your ref. loginContext.js -------------------- import {createContext} from ' react ' ; export const loginContext = createContext ({}) UserLoginStore.js ----------------------- import React, { useState } from " react " ; import { loginContext } from " ./loginContext " ; import axios from " axios " ; function UserLoginStore ( { children } ) { const [ currentUser , setCurrentUser ] = useState ({}); const [ loginErr , setLoginErr ] = useState ( "" ); const [ userLoginStatus , setUserLoginStatus ] = useState ( false ) //login user const loginUser = ( userCredObj ) => { axios . post ( " http://localhost:3500/user-api/login " , userCredObj ) . then ( ( response ) => { if ( response . data .message === " success " ) { console . lo