I built a very simple react pagination library with TypeScript. react-awesome-paginate React awesome paginate is a modern, lightweight, typescript based pagination component. You can use it in your project very easily. There are some predefined theme you can use it, in your component. Installation Install react-awesome-paginate with npm : npm i react-awesome-paginate --save Props & Theme demo: Codesandbox API demo: Codesandbox Preview Default theme Circular theme Classic theme Compact theme Import and Usage rule in your component import Pagination from 'react-awesome-paginate'; // Import npm module import 'react-awesome-paginate/dist/index.css'; // Import CSS (You can override css styling easily.) // In your page <Pagination currentPage=1 totalPages=20 onPageChange={(pageNo: number) => console.log(pageNo)} /> Detail Usage import React, { useState } from "React"; import Pagination from 'react-awesome-paginate';...
Must-Know Security Practices for Every Full Stack Developer should know in 2025 In today's world of rapid development, ignoring security can cost more than just downtime. Whether you're building SaaS, eCommerce, or APIs — security must be baked into every layer . Here’s a power-packed checklist every Full Stack Developer should follow: Frontend Security 1. XSS Attack (Cross-Site Scripting) Never trust user input. Sanitize all dynamic content. ❌ dangerouslySetInnerHTML (React) ✅ Use v-text or auto-binding (Vue, Angular) 2. CSRF Attack (Cross-Site Request Forgery) Session cookies can betray you. ✅ Use SameSite=Strict cookies + CSRF tokens. 3. Secure Local Storage Don’t store access tokens in localStorage . ✅ Use HttpOnly cookies instead. 4. CSP Headers Prevent malicious scripts. ✅ Add Content-Security-Policy: script-src 'self' Backend Security 1. CORS Policy (Cross-Origin Resource Sharing) Only allow known origins. ✅ Acc...