Timonwa's Notes — Web Development, Open Source, AI & Career

Learn to build a real-time chat app with React and Firebase.

Learn how to add agent callbacks, session state, and memory to a TypeScript AI agent.

Build a multi-agent AI research assistant in TypeScript with ADK-TS.

Learn how to style an HTML progress bar with CSS, including cross-browser support for the HTML progress element, color states, animations, and custom progress bar patterns.

A personal reflection on the challenges, growth, and lessons learned in 2025.

Learn to build your first AI agent in TypeScript using ADK-TS.

Discover the essential tools and setups for creating a comfortable and productive work-from-home environment as a developer.

Learn how to convert SVG to React component with dynamic styling.

Rather than focusing on achievements and goals, I share the deeper lessons and experiences that shaped my 2024 journey.

It's easy for devs to default to JavaScript to fix every problem.

Feature flags are powerful tools for managing new releases.

Hi there!

In the previous articles of our Hacktoberfest preparation series, we've covered a lot of ground.

Learn the dos and don'ts of Hacktoberfest etiquette and best practices in open source.

Welcome back to our journey into the world of open source and Hacktoberfest!

Get started with Hacktoberfest by learning how to contribute to open-source projects with valuable tips for success.

Prepare for Hacktoberfest with essential tools and guidelines.

In the world of programming and software development, October takes on a special meaning.

Discover what Hacktoberfest 2025 is, why it matters, and how beginners can contribute to open source.

Setting up a subscription form on your website is a great way to collect emails from your visitors.

Learn how to use CSS variables inline in HTML for dynamic and personalized styling.

Join me on a raw 2023 journey, where triumphs meet breakdowns, productivity battles guilt, and life unfolds unfiltered.

Easily add & update the copyright year on your website with this JavaScript code.

Build a loading spinner with an overlay using Html and CSS for loading content or before page loads.

Responsive web design is essential in today's web development landscape due to the diversity of devices and screen sizes.

React is a robust library that empowers developers to create reusable components and build sophisticated user interfaces.

Learn how to how to fork a repo in github on your mobile device.

Online security is of utmost importance in the digital age.

Learn tips & tricks for debugging React code effectively with this article.

Next.js provides developers with a straightforward solution to create high-performance, efficient, and scalable React apps.

When most people think about Tech jobs, they think of coding, programming, hacking, maths.

Next.js 13 brings a host of new features and improvements to the popular React framework.

Learn how to avoid disorganized code by prioritizing proper CSS methodologies for readable, maintainable, and scalable code.

Learn why using !

Uncover the journey of debugging a React app, encountering compilation errors, and the importance of reading the Build log.

Technical debt is a term that describes the cost associated with using quick and dirty solutions in software development.

In this article, we will build a real-time chat app using React and Firebase.

Learn how to transform static SVGs into reusable React components.

In 2022, I navigated challenges in my tech career and learned to trust in God.

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.

So, earlier this year, I applied for and was accepted for SCA's Contributhon open-source boot camp.

Next.js is a React framework that makes working with React easier and faster whilst boosting the online presence and SEO of the websites built with it.

Learn to create a responsive image slider using HTML, CSS, and JavaScript.

Learn JavaScript with our color flipper tutorial!

Learn how to create HTML and JavaScript accordion menus for a cleaner and organized user experience in web design.

Tech Roadmap provides you with articles, guides, videos, and other useful resources to help you choose a career path, start your journey and grow in tech.

Have you ever come across a checkbox asking you to confirm if you are not a robot followed by a visual test asking you to select images of traffic lights or something of that nature?

Code Snippet is a term used in programming to describe a small portion of reusable source code, machine code, or text.

Discover Tech Roadmap, your ultimate resource for choosing and excelling in tech careers, curating articles, guides, videos, and more.

CSS selectors are used to select elements in our web document so we can apply CSS styles to them.