Useful Commands & Techniques
How to get the number of DOM elements used in a web page? document.getElementsByTagName('*').length
React.js Video Game Discovery App Project (Part 2)
Install React Query npm i @tanstack/react-query@4.28 Edit main.tsx import "bootstrap/dist/css/bootstrap.css"; import React from "react"; import ReactDOM from "react-dom/client"; import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; import App from "./App"; import…
HTML Canvas
The Canvas Element <canvas id="cv1" width="300" height="150"> Fallback content here </canvas> widthThe width of the canvas element(default is 300)heightThe height of the canvas element(default is 150)toDataURL(type)Convert content into a data…
WordPress Elementor Page Builder
Removing Default Bottom Margins from Elementor Paragraphs Elementor's paragraph elements come with a default bottom margin, which often results in excessive spacing between designed elements on the page. To remove…
Next.js 14 SAAS Automation Builder
Table of Contents Setup the Next.js project (shadcn/ui)https://ui.shadcn.com/docs/installation/next bunx --bun create-next-app@latest . --typescript --tailwind --eslint ✔ Would you like to use `src/` directory? … No / Yes ✔ Would you…
Next.js
Table of Contents Useful VS Code extensions ES7+ React/Redux/React-Native snippetsId: dsznajder.es7-react-js-snippetsDescription: Extensions for React, React-Native and Redux in JS/TS with ES7+ syntax. Customizable. Built-in integration with prettier.Version: 4.4.3Publisher: dsznajderVS Marketplace…
PHP for WordPress
Table of Contents PHP Coding Conventions All PHP files must end in .phpStatements (or commands) in PHP end with a semicolon (;)If you want to include comments, which are nonfunctional…
Node.js
Table of Contents NPM initialization npm init This utility will walk you through creating a package.json file. It only covers the most common items, and tries to guess sensible defaults.…
React.js Video Game Discovery App Project
Table of Contents Setting up the project npm create vite@4.1.0 ✔ Project name: … game-hub ✔ Select a framework: › React ✔ Select a variant: › TypeScript Scaffolding project in…
Underscores + Bootstrap
Setup Underscores website: https://underscores.me/ Name your theme and download the underscores theme boilerplate, then install it in your WordPress website. Bootstrap Website: https://getbootstrap.com/docs/5.3/getting-started/download/ Download the bootstrap CSS compressed file, unzip…