Vitest : (A Vite-native testing framework)1. Vitest Scripts in package.json "scripts": { // This script runs Vitest to execute the test suite "test": "vitest", // This script runs Vitest with an additional flag --coverage // The --coverage flag generates a test coverage repo...Oct 22, 2024路1 min read
Axios - Promise-based HTTP clientStep 1: Install Axios npm install axios Step 2: Setting Up Axios Instance (Optional) // 馃搨 /src/utils/axios.jsx import axios from "axios"; const instance = axios.create({ baseURL: "https://jsonplaceholder.typicode.com/", timeout: 10000, // ...Jul 30, 2024路1 min read
useContext() - React Hooks1. Set Up the Context create a file called ThemeContext.js and add the below code // 馃搨 context/ThemeContext.js import React, { useState, createContext } from "react"; // Create context object // const ThemeContext = React.createContext(); const The...Jul 26, 2024路2 min read
01 Introduction to foundational tools and frameworks in web development.Coding : Build your first Hello World program using, Using just HTML <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>01 Inception</title> ...Apr 22, 2024路5 min read
12-13 : React HooksIntroduction to Hooks in React: Definition: Hooks are functions that allow functional components to access React state and lifecycle features. They were introduced in React 16.8 to address the limitations of class components and promote the use of...Mar 24, 2024路3 min read
06 React/Next: 馃敆 Routes, useParams, 馃ЛuseNavigate, Outlet, useLocation()1. React Router Setup npm i react-router-dom or npm install react-router-dom 2. React Router Configuration : 2.1 (a) "Navbar Component with Anchor Tags and React Router Links" FileName: Navbar.js 猬囷笍 // abb: rfc import React from 'react' // react ro...Nov 6, 2023路4 min read