GSAP’s Post

I'm trying to learn frontend development. So naturally, I made a Yugioh card deck entirely in CSS, tailwind (and React!) You can accomplish a pretty amazing 3D rotational effect through very simple CSS effects: in this case CSS's rotational and animate properties. Check out the full video below! Here's the source code: https://lnkd.in/gG7vrtDC

Hello Friends , as for practice i have created a new React Project called Password Generator using which we can generate a random password containing Numbers , special characters , and Alphabets . I have used React Hooks to create this project like useEffect , useCallback , useRef and useState. useEffect : runs the function inside it whenever pages renders first time and dependencies are changed. useCallback : used for optimization here whenever dependencies are changed and returns a memorized function. useRef : used to take the reference of the selected components. useState: used to add state to the component. Check it out here : https://lnkd.in/gq5cqXfr

My entire frontend's stack tools changed in just span of 7 to 12 months. I have to re-learn new things again for the projects. Here are the some of the list. CRA -> Vite Chakra/Material -> Shadcn/ Tailwind Formik/Custom -> React Hook Form Yup -> Zod/Class Validator React Router Dom -> TanStack Router Table -> TanStack Table Custom Axios -> TanStack Query Custom Context -> TanStack Context (builtin of Tanstack Router) Custom made Axios/Request/Response Type -> Generated Swagger Types (for TanStack router) Custom Scripts -> Husky (pre-commit, post-commit, pre-push, and other) Lengthy imports -> Vite-tsconfig-paths (alias based imports) #reactjs #javascript

I am sharing on CodePen my 'confirm' custom React hook 😀 This hook can be used to confirm deletion, display modal form... and is fully customizable usage : const result = await requestConfirm(<DeleteForm/>);

I am thrilled to share that I have successfully completed my second project using React Js. Project - Calculator. GitHub: github.com/SumitKumarsk001 And during this project I learn this topics - 1. map.method(). 2. Hooks - useState hooks. 3. Conditional Rendering. 4. Passing data via Props 5. Event handling. And this react js and redux course of #KgcodingbyPrashantsir it help me to developed my frontend development skills.

Did you know JSX is actually syntactic sugar for vanilla JS functions? React.createElement achieves the same effect. Sometimes the function syntax is more ergonomic, for example when rendering a component with a variable tag type. Additionally, you can use React.cloneElement to modify an existing element's props and children. --- 🔔 Follow me for more web development insights, tips, and tricks. #webdevelopment #softwaredevelopment #softwareengineering

Hi there Frontend Engineers! Good news for Next.js & React.js developers Yesterday ,Vercel has announced the latest version of Next.js, the Next 15 ‘RC’ , built on the latest great version of React.js , React 19. Headlines of the announcement: React: Support for the React 19 RC, React Compiler (Experimental), and hydration error improvements. -Caching: fetch requests, GET Route Handlers, and client navigations are no longer cached by default. -Partial Prerendering (Experimental): New Layout and Page config option for incremental adoption. -next/after (Experimental): New API to execute code after a response has finished streaming. -create-next-app: Updated design and a new flag to enable Turbopack in local development. -Bundling external packages (Stable): New config options for App and Pages Router. Here’s a video with more details about that event, hosted by the great content creator JavaScript Mastery : https://lnkd.in/gmRQdBeU #next #react

Vue 3 allows you to store the handlers in an object called 'methods' and bind them in the HTML using directive. React 18 (No-JSX) on the other hand, it will handle the event in a function and then call a render function to "re-paint" your UI with the new changes. https://lnkd.in/d_k8zFdN React 18 https://lnkd.in/da4XfhGa Vue 3 https://lnkd.in/deEVTsd7 Personal notes https://lnkd.in/dgdbE5y7 . . . . . #vue #react #difference #benefits #web #business #development #tradeoffs

Let's learn about conditional rendering in react js