Tag

Frontend

Client-side web development with HTML, CSS, and JavaScript

11 articles

web development11 min read
How to Convert an SVG into a React Component: A Simple Guide
Learn how to convert SVG to React component with dynamic styling. This guide shows how to import SVGs as components, change SVG color and size in React, and handle complex SVG files.
Apr 22, 2025
web development5 min read
How to use Inline CSS Variable in Html
Learn how to use CSS variables inline in HTML for dynamic and personalized styling. Understand the benefits and explore practical examples with inline CSS variables.
Feb 15, 2024
web development2 min read
How to Auto Update Copyright Year on Your Website
Easily add & update the copyright year on your website with this JavaScript code. Ensure accurate protection & signal the content's ongoing relevance & maintenance
Dec 15, 2023
web development24 min read
How to Build Responsive Layouts Using CSS Grid
Responsive web design is essential in today's web development landscape due to the diversity of devices and screen sizes.
Dec 3, 2023
web development18 min read
Best Practices for Securing Your React Application
React is a robust library that empowers developers to create reusable components and build sophisticated user interfaces. However, as with any web application, security is paramount to safeguard against potential attacks like XSS (Cross-Site Scripting) and CSRF (Cross-Site Request Forgery).
Sep 20, 2023
web development13 min read
How to Debug React Code: Tips and Tricks for Developers
Learn tips & tricks for debugging React code effectively with this article. Explore different techniques & tools to identify & fix issues in your React applications.
Jul 11, 2023
web development7 min read
How CSS Methodologies can enhance Code Efficiency
Learn how to avoid disorganized code by prioritizing proper CSS methodologies for readable, maintainable, and scalable code.
Mar 12, 2023
web development16 min read
How to Build a Real-time Chat App with React and Firebase
In this article, we will build a real-time chat app using React and Firebase. We will allow the user to log in with their google account using Firebase's Google sign-in Authentication, and we will store and retrieve all the chatroom messages using Firebase's Cloud Firestore.
Jan 13, 2023
web development8 min read
Creating responsive images with image-set
The image-set() is a CSS function that allows web developers to turn an image into a responsive image, showing variations of the same photo for different screen resolutions when needed.
Sep 27, 2022
web development11 min read
How to Build an Accordion Menu 3 Simple Ways
Learn how to create HTML and JavaScript accordion menus for a cleaner and organized user experience in web design.
Mar 15, 2022
web development10 min read
all vs root vs html vs body selectors
CSS selectors are used to select elements in our web document so we can apply CSS styles to them.
Nov 24, 2021

The newsletter

Join Timonwa's Notes

What I've been working on, and whatever links, tools, and posts stuck with me. Roughly once a month.